ข้ามไปยังเนื้อหา

สร้างข้อความในแอปด้วยเครื่องมือแก้ไขแบบไม่ต้องเขียนโค้ด

วิดีโอ YouTube: สร้าง In-App โดยไม่ต้องเขียนโค้ดในเครื่องมือแก้ไขที่ใช้งานง่ายของเรา

หากต้องการสร้างเทมเพลตในแอป (หรือที่เรียกว่า Rich Media) ให้ไปที่ ContentIn-Apps (Rich Media) และคลิก Add template:

ที่นี่ คุณมีสามตัวเลือก:

  1. อัปโหลดไฟล์ ZIP พร้อมข้อความในแอป HTML ของคุณ
  2. เลือกและปรับแต่งหนึ่งในเทมเพลตที่สร้างไว้ล่วงหน้า
  3. สร้างเทมเพลตของคุณเองตั้งแต่เริ่มต้น

ในบทความนี้ เราจะดูวิธีการสร้างเทมเพลตตั้งแต่เริ่มต้น ทำตามขั้นตอนเดียวกันเพื่อปรับแต่งเทมเพลตที่มีอยู่ของคุณ

การกำหนดเลย์เอาต์

Anchor link to

กำหนดเลย์เอาต์ของเทมเพลตโดยการลากและวางบล็อกเนื้อหาที่ต้องการลงในส่วนเนื้อหาของเทมเพลต คุณสามารถเพิ่มรูปภาพ ข้อความ ปุ่ม ตัวแบ่ง ฟอร์มที่กรอกได้ บล็อก HTML และเมนู

หากคุณต้องการวางองค์ประกอบเนื้อหามากกว่าหนึ่งรายการในแถวเดียวกัน ให้เพิ่มองค์ประกอบ Columns ลงในเทมเพลต เลือกประเภทบล็อกที่ต้องการ และเพิ่มเนื้อหาลงในแต่ละคอลัมน์:

หากต้องการเปลี่ยนสีพื้นหลังของเลย์เอาต์ ให้คลิกที่ขอบด้านนอก ตรวจสอบให้แน่ใจว่าได้เลือกเลย์เอาต์ทั้งหมดแล้ว และเลือกสี:

หากเลือกเลย์เอาต์ทั้งหมดแล้ว คุณยังสามารถแก้ไขการตั้งค่า padding และอัปโหลดภาพพื้นหลังได้อีกด้วย

การสร้าง Rich Media แนวตั้งและแนวนอน

Anchor link to

Pushwoosh มอบความยืดหยุ่นในการสร้างเนื้อหา Rich Media ทั้งในแนวตั้งและแนวนอน เพื่อให้แน่ใจว่าแคมเปญของคุณจะดูน่าสนใจและมีประสิทธิภาพในทุกอุปกรณ์

Rich Media แนวตั้ง

Anchor link to

หากต้องการสร้าง Rich Media ที่ออกแบบมาสำหรับแนวตั้ง ซึ่งโดยทั่วไปจะใช้บนอุปกรณ์มือถือ ให้ไปที่แท็บ Mobile ในเครื่องมือแก้ไข ที่นี่คุณสามารถออกแบบเนื้อหาของคุณให้พอดีกับเลย์เอาต์แนวตั้ง ซึ่งเหมาะสำหรับหน้าจอสมาร์ทโฟน

Rich Media แนวนอน

Anchor link to

สำหรับ Rich Media ที่เน้นแนวนอน ซึ่งโดยทั่วไปจะแสดงบนหน้าจอที่กว้างขึ้น เช่น แท็บเล็ต หรือในแอปที่เน้นแนวนอน เช่น เกมหรือเครื่องเล่นเพลง ให้ไปที่แท็บ Desktop ภายในเครื่องมือแก้ไข ที่นี่คุณสามารถจัดโครงสร้าง Rich Media ของคุณเพื่อใช้ประโยชน์จากพื้นที่แนวนอนที่กว้างขึ้น

การเพิ่มคอลัมน์ใน Rich Media แนวนอน

Anchor link to

หากคุณต้องการเพิ่มคอลัมน์ใน Rich Media แนวนอนของคุณ ก่อนอื่นให้เพิ่มองค์ประกอบ Column และกำหนดจำนวนและเลย์เอาต์ของคอลัมน์ที่คุณต้องการ

หลังจากออกแบบ Rich Media แนวนอนของคุณพร้อมคอลัมน์แล้ว ให้สลับไปที่แท็บ Mobile

เลื่อนลงไปที่ส่วน RESPONSIVE DESIGN ซึ่งอยู่ที่ด้านล่างของแผงการตั้งค่า และเปิดใช้งานตัวเลือก Do Not Stack on Mobile

Pushwoosh ยังช่วยให้คุณสามารถผสมผสานเลย์เอาต์คอลัมน์ใน Rich Media ของคุณได้ คุณสามารถกำหนดค่าคอลัมน์เฉพาะให้ซ้อนกันในแนวตั้งในขณะที่คอลัมน์อื่น ๆ ยังคงอยู่ในแนวนอนได้ ในการทำเช่นนี้ ให้ปรับแต่ละบล็อกคอลัมน์ตามต้องการ

องค์ประกอบเนื้อหา

Anchor link to

หัวข้อ

Anchor link to

คุณสามารถแก้ไขพารามิเตอร์แบบอักษร สี การจัดแนวข้อความ ความสูงของบรรทัด และ padding สำหรับหัวข้อได้

คุณยังสามารถประหยัดเวลาได้โดยให้ AI สร้างข้อความหัวข้อให้คุณ คลิกปุ่มในส่วน Smart Headings ป้อนคีย์เวิร์ดบางคำ แล้วคลิก Get Suggestions:

ข้อความ

Anchor link to

ข้อความสามารถปรับแต่งได้เช่นเดียวกับหัวข้อ: คุณสามารถเปลี่ยนแบบอักษร สี การจัดแนวข้อความ ความสูงของบรรทัด และพารามิเตอร์ padding ได้

คุณยังสามารถใช้ตัวแก้ไข AI ของ Pushwoosh เพื่อเขียนข้อความของคุณใหม่ด้วยน้ำเสียงที่แตกต่างกัน เปลี่ยนความยาวของอักขระ และตรวจสอบไวยากรณ์ ในการทำเช่นนี้ ให้คลิกที่บล็อกข้อความ → Smart Text และเลือกหนึ่งในรูปแบบข้อความสำเร็จรูป:

รูปภาพ

Anchor link to

หากต้องการเพิ่มรูปภาพ ให้คลิกที่บล็อกรูปภาพแล้วลากไฟล์ของคุณไปยังแผงแก้ไข:

อีกทางเลือกหนึ่ง คุณสามารถระบุ Image URL แทนการอัปโหลดไฟล์

คุณยังสามารถทดลองสร้างภาพด้วย AI ได้อีกด้วย ในการทำเช่นนี้ ให้คลิกปุ่มในส่วน Magic Image อธิบายภาพที่คุณต้องการสร้าง แล้วคลิก Generate Images:

ในส่วน Action คุณสามารถตั้งค่าการกระทำที่ควรดำเนินการเมื่อคลิกที่รูปภาพ: เปิดเว็บไซต์ (หรือ deep link ไปยังหน้าภายในแอปของคุณ) หรือปิดป๊อปอัป คุณยังสามารถแทรกแอตทริบิวต์ตัวจัดการ JavaScript ที่กำหนดเองเพื่อตั้งค่าการกระทำเมื่อคลิกรูปภาพได้ หากไม่ต้องการการกระทำใดๆ ให้ข้ามการตั้งค่านี้ไป

หากคุณต้องการเปิดหน้าในแอปมือถือของคุณเมื่อมีการคลิกรูปภาพ ให้เลือกตัวเลือก Open Website และแทรก deep link

ปุ่ม

Anchor link to

เมื่อเพิ่มปุ่มลงในเทมเพลตของคุณแล้ว คุณสามารถปรับแต่งข้อความ สี padding และเส้นขอบของปุ่มได้

AI สามารถช่วยคุณคิดข้อความบนปุ่มได้ เพียงคลิกที่ปุ่มในส่วน Smart Buttons ป้อนคีย์เวิร์ด แล้วคลิก Get Suggestions:

หากต้องการระบุการกระทำที่ควรดำเนินการหลังจากคลิกปุ่ม ให้ไปที่ส่วน Action และเลือกตัวเลือกที่ต้องการ: เปิดเว็บไซต์หรือปิดป๊อปอัป คุณยังสามารถแทรกแอตทริบิวต์ตัวจัดการ JavaScript ที่กำหนดเองเพื่อตั้งค่าการกระทำเมื่อคลิกปุ่มได้

หากคุณต้องการเปิดหน้าในแอปมือถือของคุณเมื่อมีการคลิกปุ่ม ให้เลือกตัวเลือก Open Website และแทรก deep link

ตัวแบ่ง

Anchor link to

ตัวแบ่งคือเส้นที่คุณสามารถวางไว้ระหว่างบล็อกเนื้อหาได้ ใช้เพื่อจัดโครงสร้างเทมเพลตของคุณและเน้นบล็อกที่สำคัญที่สุด คุณสามารถเปลี่ยนความกว้าง ประเภทเส้น การจัดแนว และการตั้งค่า padding ของตัวแบ่งได้

ฟอร์ม

Anchor link to

ในการกำหนดค่าองค์ประกอบนี้ คุณจะต้องได้รับความช่วยเหลือจากนักพัฒนา

ฟอร์มช่วยให้คุณสามารถรวบรวมอีเมล หมายเลขโทรศัพท์ ความชอบ และข้อมูลอื่นๆ ของผู้ใช้ซึ่งอาจเป็นประโยชน์สำหรับการสื่อสารในอนาคต องค์ประกอบนี้ถูกกำหนดค่าเป็นฟอร์ม HTML มาตรฐาน: ข้อมูลจะถูกส่งในคำขอ GET หรือ POST ไปยังที่อยู่ที่ระบุในฟิลด์ URL

คลิกที่ชื่อฟิลด์เพื่อกำหนดค่าพารามิเตอร์:

  • Field Type: ประเภทของข้อมูลที่ควรส่งในฟิลด์
  • Field Name: ชื่อของพารามิเตอร์ที่จะส่งข้อมูลจากฟิลด์ไป
  • Field Label: ข้อความที่แสดงเหนือฟิลด์
  • Placeholder Text;
  • ช่องทำเครื่องหมายที่ระบุว่าจำเป็นต้องกรอกฟิลด์นี้เพื่อส่งฟอร์มหรือไม่

หากต้องการเพิ่มฟิลด์อื่น ให้คลิก Add New Field และเลือกประเภทข้อมูล:

คุณสามารถปรับแต่งพารามิเตอร์ของฟอร์มได้ เช่น ความกว้าง การจัดแนว ระยะห่างระหว่างฟิลด์ ข้อความบนปุ่ม สี และแบบอักษร

เพิ่มบล็อก HTML หากคุณต้องการรวมโค้ด HTML ของคุณเองไว้ในเทมเพลต

เมนู

Anchor link to

องค์ประกอบ Menu ช่วยให้คุณสามารถวางรายการที่คลิกได้หลายรายการในแถวหรือคอลัมน์ ตัวอย่างเช่น คุณสามารถเพิ่มแถบนำทางหรือข้อมูลติดต่อของบริษัทได้

หากต้องการเพิ่มรายการเมนู ให้คลิก Add New Item:

เพิ่มข้อความรายการและตั้งค่าการกระทำที่ควรดำเนินการเมื่อคลิกที่รายการ:

เลือกประเภทเมนูแนวนอนหรือแนวตั้ง และเพิ่มตัวคั่นระหว่างรายการหากจำเป็น:

การปรับแต่งเนื้อหาให้เป็นส่วนตัว

Anchor link to

ปรับแต่งข้อความหลัก หัวเรื่อง หรือข้อความบนปุ่มให้เป็นแบบส่วนตัวเพื่อทำให้เนื้อหาของคุณมีความเกี่ยวข้องและน่าสนใจยิ่งขึ้น ตัวอย่างเช่น คุณสามารถเรียกชื่อผู้ใช้หรือกล่าวถึงความชอบของพวกเขาได้

ขั้นแรก คุณต้อง ตั้งค่า Tags และกำหนดค่าการรวบรวมข้อมูลจากผู้ใช้ (เช่น ผ่านแบบฟอร์มความคิดเห็น) เมื่อสร้าง Rich Media ให้เลือกบล็อกเนื้อหาที่ต้องการ คลิก Merge Tags และเลือก Tag ที่คุณต้องการใช้:

เทมเพลตหลายภาษา

Anchor link to

คุณสามารถแปลข้อความในเทมเพลต Rich Media ของคุณสำหรับแต่ละภาษาที่ผู้ใช้ของคุณพูดได้ ในการทำเช่นนี้ ให้สลับระหว่างภาษาในรายการ Editable language และแก้ไขเนื้อหาในแต่ละภาษาแยกกัน:

หากเนื้อหาไม่ได้ถูกแปลเป็นภาษาท้องถิ่น เนื้อหานั้นจะแสดงในภาษาที่ระบุเป็น default ใน Language settings

องค์ประกอบใดๆ ที่คุณเพิ่มลงในเทมเพลตจะปรากฏพร้อมเนื้อหาเดียวกันสำหรับทุกภาษา อย่าลืมแปลข้อความที่เพิ่มเข้ามา (รวมถึงข้อความบนปุ่ม) สำหรับทุกภาษาที่คุณใช้ในเทมเพลตของคุณ

การตั้งค่าเทมเพลตทั่วไป

Anchor link to

ในแท็บ Popup คุณสามารถกำหนดค่าการตั้งค่าเทมเพลตทั่วไปได้:

  • ตั้งค่าตำแหน่งป๊อปอัปบนหน้าจอ
  • เปลี่ยนความกว้างและความสูงของป๊อปอัป
  • ปรับความโค้งของเส้นขอบ
  • กำหนดค่าการตั้งค่าเนื้อหาสำหรับทั้งเทมเพลต: การจัดแนว ความกว้าง แบบอักษร และสี
  • ตั้งค่าสีพื้นหลังหรือเพิ่มภาพพื้นหลัง
  • ปรับแต่งตำแหน่งและลักษณะที่ปรากฏของปุ่มปิด

การบันทึกและใช้เทมเพลต

Anchor link to

คลิก Save เพื่อใช้การเปลี่ยนแปลง:

ตอนนี้คุณสามารถใช้เทมเพลต Rich Media เพื่อส่งข้อความในแอปของคุณได้แล้ว โปรดทำตามคำแนะนำนี้เพื่อดำเนินการ >