จัดสไตล์ของโฆษณาเนทีฟ

เมื่อกำหนดการตั้งค่าโฆษณาเนทีฟแล้ว คุณจะจัดสไตล์ของโฆษณาเนทีฟได้ บทความนี้จะอธิบายการตั้งค่าที่จำเป็นและที่ไม่บังคับซึ่งคุณต้องกำหนดค่า 

หมายเหตุ: สำหรับโค้ดของแอป Android และ iOS เนื่องจากคุณจะไม่กำหนดค่าสไตล์ใน Google Ad Manager คุณจึงสามารถข้ามส่วนนี้และส่วนการใช้สไตล์โฆษณาเนทีฟกับรายการโฆษณาที่เจาะจง และปฏิบัติตามวิธีการเพิ่มครีเอทีฟโฆษณาเนทีฟ

จัดสไตล์ของโฆษณาเนทีฟโดยใช้สิ่งต่อไปนี้

• ตัวแก้ไขดีไซน์ที่มีคำแนะนำ
• HTML และ CSS

ตัวแก้ไขดีไซน์ที่มีคำแนะนำ

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

เคล็ดลับในการใช้ตัวแก้ไขดีไซน์ที่มีคำแนะนำ

ขนาดการแสดงตัวอย่าง

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

เรียงลำดับองค์ประกอบใหม่

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

แผง "จัดสไตล์ของโฆษณาเนทีฟ"

แผง "จัดสไตล์ของโฆษณาเนทีฟ" ช่วยให้คุณอัปเดตการตั้งค่าได้ตามต้องการ เช่น หากขยาย "ชื่อ" คุณจะเลือกได้ว่าต้องการให้ชื่อหรือบรรทัดแรกของโฆษณามีอักขระไม่เกิน 30 ตัว (แบบสั้น) หรือ 90 ตัว (แบบยาว)

ดูรายการแบบอักษรที่รองรับ

• Archivo
• Arial
• Arimo
• Bitter
• Comic Sans
• EB Garamond
• Geneva
• Georgia
• Helvetica
• Lato
• Libre Baskerville
• Libre Franklin
• Lora
• Merriweather
• Montserrat
• Mukta
• Muli
• Nunito
• Open Sans
• Open Sans Condensed
• Oswald
• Playfair Display
• Poppins
• Raleway
• Roboto
• Roboto Condensed
• Roboto Slab
• Slabo 27px
• Source Sans Pro
• Times New Roman
• Trebuchet
• Ubuntu
• Verdana
• Volkhov

จัดสไตล์ในเครื่องมือแก้ไข CSS

คุณสามารถแก้ไข CSS ได้โดยตรง แต่มีข้อจำกัดดังนี้

• เมื่อแก้ไขเสร็จเรียบร้อยแล้ว คุณจะเปลี่ยนแปลงเพิ่มเติมผ่านการควบคุมใน UI ไม่ได้
• หากคุณทำข้อผิดพลาดด้านนโยบายเมื่อแก้ไข CSS สไตล์โฆษณาเนทีฟจะเสียสิทธิ์ในการประมูล Ad Exchange แต่ยังแสดงผ่านการรับประกันแบบเป็นโปรแกรมได้อยู่
• HTML จะแก้ไขไม่ได้ในตัวแก้ไขดีไซน์ที่มีคำแนะนำ คุณจะเลือกตัวเลือกตัวแก้ไข HTML และ CSS ได้หากต้องการปรับแต่งมากขึ้น แต่ก็จะเสียสิทธิ์ใช้ตัวเลือกแบบเป็นโปรแกรม

หากต้องการแก้ไข CSS โดยตรง ให้เปิดสวิตช์จัดสไตล์ในเครื่องมือแก้ไข CSS

หากคุณแก้ไข CSS ให้คลิกตรวจสอบเพื่อให้แน่ใจว่าสไตล์เป็นไปตามนโยบายของ Ad Exchange

HTML และ CSS

เมื่อคุณเลือก "ตัวแก้ไข HTML และ CSS" เพื่อสร้างสไตล์โฆษณาเนทีฟ คุณจะใช้ HTML และ CSS เพื่อจัดสไตล์ของโฆษณาเนทีฟให้เข้ากับรูปลักษณ์ของเว็บไซต์หรือแอป ระบบจะใช้การอัปเดตกับตัวอย่างโฆษณาในหน้านี้โดยอัตโนมัติเพื่อให้คุณทดลองใช้รูปแบบต่างๆ

เคล็ดลับในการใช้เครื่องมือแก้ไข HTML และ CSS

ขนาดการแสดงตัวอย่าง

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

ประเภทการแสดงผล

เลือกว่าจะสร้างโฆษณาเนทีฟที่เพิ่มประสิทธิภาพสำหรับ Accelerated Mobile Pages (AMP) ไหม โปรดทราบว่าหากเลือกขนาด "แบบยืดหยุ่น" ไว้ในการตั้งค่าโฆษณา คุณจะเปลี่ยนการตั้งค่าเริ่มต้น "มาตรฐาน" ที่นี่ไม่ได้

• มาตรฐาน: โฆษณาเนทีฟจะทำงานในเว็บบนเดสก์ท็อป เว็บบนอุปกรณ์เคลื่อนที่ และแอปบนอุปกรณ์เคลื่อนที่ โฆษณาเนทีฟมาตรฐานจะทำงานกับเนื้อหา AMP ได้ด้วย แต่จะไม่เร็วเท่ากับการเลือกตัวเลือก AMP
• AMP: โฆษณา AMP ออกแบบมาให้ทำงานได้เร็วขึ้นในเนื้อหา AMP โดยเฉพาะ แต่จะแสดงในเนื้อหามาตรฐานได้ด้วย
• มาตรฐานและ AMP: เพิ่มโค้ดแยกต่างหากเพื่อสร้างโฆษณาเนทีฟไม่ว่าเวอร์ชันใดใน 2 เวอร์ชันนี้ Ad Manager จะแสดงเวอร์ชัน AMP ในเนื้อหา AMP และเวอร์ชันมาตรฐานในเนื้อหามาตรฐาน ดูข้อมูลเกี่ยวกับการใช้ Wrapper โฆษณาเพื่อเพิ่มข้อมูลโค้ดลงในโฆษณา

แผง "จัดสไตล์ของโฆษณาเนทีฟ"

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

เพิ่ม "Universal Link ที่เข้าแอปเดิม" ของ iOS ลงใน HTML

Universal Link ที่เข้าแอปเดิมคือลิงก์ของ iOS ที่ใช้ในแอป iOS สําหรับการนําทางในแอป หากต้องการใช้ Universal Link ที่เข้าแอปเดิม ในครีเอทีฟโฆษณาเนทีฟ ให้เพิ่มมาโคร %%ONE_CLICK_HANDLER_TARGET%% ลงใน HTML ตามตัวอย่างนี้

ขั้นตอนถัดไป

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

• ตัวเลือกบันทึกและเปิดใช้งานจะอัปเดตสถานะของสไตล์เป็น "ใช้งานอยู่" และอนุญาตให้แสดงโฆษณา
• ตัวเลือกบันทึกจะอัปเดตสถานะเป็น "ไม่ใช้งาน" และยังไม่สามารถแสดงโฆษณาได้ หากต้องการเปิดใช้งานในภายหลัง ให้ไปที่ตารางสไตล์โฆษณาเนทีฟที่บันทึกไว้ เลือกสไตล์ แล้วคลิกเปิดใช้งาน

หากต้องการใช้สไตล์โฆษณาเนทีฟสำหรับรายการโฆษณาที่เจาะจง ให้ใช้สไตล์โฆษณาเนทีฟกับรายการโฆษณาที่เจาะจง