หน่วยโฆษณา

วิธีปรับแต่งหน่วยเนื้อหาที่ตรงกันที่ปรับเปลี่ยนตามอุปกรณ์

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

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

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

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

เปลี่ยนการออกแบบของหน่วยเนื้อหาที่ตรงกัน

พารามิเตอร์การออกแบบ (data-matched-content-ui-type) ช่วยให้คุณสามารถควบคุมการจัดเรียงของข้อความและรูปภาพในหน่วยเนื้อหาที่ตรงกันของคุณ ตัวอย่างเช่น คุณสามารถเลือกวางรูปภาพและข้อความไว้ข้างกัน รูปภาพอยู่ด้านบนข้อความ ฯลฯ

ตัวเลือกการออกแบบที่ใช้ได้มีดังต่อไปนี้

รูปภาพและข้อความแสดงคู่กัน

การออกแบบนี้ รูปภาพและข้อความจะปรากฏข้างๆ กัน หากต้องการเลือกการออกแบบนี้ ให้เพิ่มพารามิเตอร์ data-matched-content-ui-type="image_sidebyside" ลงในโค้ดโฆษณาของคุณ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-ui-type="image_sidebyside"
     data-matched-content-rows-num="4"
     data-matched-content-columns-num="1"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Image and text side by side layout

รูปภาพและข้อความแสดงคู่กันพร้อมการ์ด

การออกแบบนี้ รูปภาพและข้อความจะปรากฏข้างๆ กันภายในการ์ด หากต้องการเลือกการออกแบบนี้ ให้เพิ่มพารามิเตอร์ data-matched-content-ui-type="image_card_sidebyside" ลงในโค้ดโฆษณาของคุณ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-ui-type="image_card_sidebyside"
     data-matched-content-rows-num="4"
     data-matched-content-columns-num="1"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Image and text side by side with card layout

รูปภาพแสดงอยู่ด้านบนข้อความ

การออกแบบนี้ รูปภาพและข้อความถูกจัดเรียงให้รูปภาพปรากฏอยู่บนเหนือข้อความ หากต้องการเลือกการออกแบบนี้ ให้เพิ่มพารามิเตอร์ data-matched-content-ui-type="image_stacked" ลงในโค้ดโฆษณาของคุณ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-ui-type="image_stacked"
     data-matched-content-rows-num="3"
     data-matched-content-columns-num="1"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Image stacked above text layout

รูปภาพแสดงอยู่ด้านบนข้อความพร้อมการ์ด

การออกแบบนี้ รูปภาพและข้อความถูกจัดเรียงให้รูปภาพปรากฏอยู่บนเหนือข้อความภายในการ์ด หากต้องการเลือกการออกแบบนี้ ให้เพิ่มพารามิเตอร์ data-matched-content-ui-type="image_card_stacked" ลงในโค้ดโฆษณาของคุณ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-ui-type="image_card_stacked"
     data-matched-content-rows-num="3"
     data-matched-content-columns-num="1"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Image stacked above text with card layout

ข้อความเท่านั้น

การออกแบบที่มีเฉพาะข้อความเท่านั้นโดยไม่มีรูปภาพ หากต้องการเลือกการออกแบบนี้ ให้เพิ่มพารามิเตอร์ data-matched-content-ui-type="text" ลงในโค้ดโฆษณาของคุณ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-ui-type="text"
     data-matched-content-rows-num="4"
     data-matched-content-columns-num="1"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

text-only layout

ข้อความพร้อมการ์ด

การออกแบบที่มีเฉพาะข้อความเท่านั้นภายในการ์ด หากต้องการเลือกการออกแบบนี้ ให้เพิ่มพารามิเตอร์ data-matched-content-ui-type="text_card" ลงในโค้ดโฆษณาของคุณ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-ui-type="text_card"
     data-matched-content-rows-num="4"
     data-matched-content-columns-num="1"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Text with card layout

ระบุจำนวนแถวและคอลัมน์ในหน่วยเนื้อหาที่ตรงกันของคุณ

วิดีโอแนะนำภายในหน่วยเนื้อหาที่ตรงกันจะจัดเรียงเป็นตารางกริด คุณสามารถระบุจำนวนแถวและคอลัมน์ที่คุณต้องการให้แสดงภายในตารางดังกล่าวได้ ตัวอย่างเช่น คุณสามารถตั้งค่าหน่วยเนื้อหาที่ตรงกันเป็นรูปแบบสี่เหลี่ยมจัตุรัส 2x2, คอลัมน์ 4x1 ฯลฯ

ให้คุณตั้งค่าจำนวนแถวด้วยพารามิเตอร์ data-matched-content-rows-num และจำนวนคอลัมน์ด้วยพารามิเตอร์ data-matched-content-columns-num คุณต้องตั้งค่าทั้งพารามิเตอร์และ data-matched-content-ui-type

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

ตัวอย่างแถวและคอลัมน์

4x1 (อุปกรณ์เคลื่อนที่และเดสก์ท็อป)

โค้ดตัวอย่างนี้แสดงวิธีการสร้างหน่วยเนื้อหาที่ตรงกันที่มี 4 แถว 1 คอลัมน์ แสดงวิดีโอแนะนำทั้งหมด 4 วิดีโอ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-rows-num="4"
     data-matched-content-columns-num="1"
     data-matched-content-ui-type="image_stacked"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

4x1 grid

2x2 (อุปกรณ์เคลื่อนที่และเดสก์ท็อป)

โค้ดตัวอย่างนี้จะแสดงวิธีการสร้างหน่วยเนื้อหาที่ตรงกันที่มี 2 แถว 2 คอลัมน์ แสดงวิดีโอแนะนำทั้งหมด 4 วิดีโอ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-rows-num="2"
     data-matched-content-columns-num="2"
     data-matched-content-ui-type="image_stacked"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

2x2 grid

3x3 (อุปกรณ์เคลื่อนที่และเดสก์ท็อป)

โค้ดตัวอย่างนี้จะแสดงวิธีการสร้างหน่วยเนื้อหาที่ตรงกันที่มี 3 แถว 3 คอลัมน์ แสดงวิดีโอแนะนำทั้งหมด 9 วิดีโอ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     data-matched-content-rows-num="3"
     data-matched-content-columns-num="3"
     data-matched-content-ui-type="image_stacked"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

3x3 grid

4x1 (อุปกรณ์เคลื่อนที่) และ 2x2 (เดสก์ท็อป) สำหรับเว็บไซต์ที่ปรับเปลี่ยนตามอุปกรณ์

โค้ดตัวอย่างนี้แสดงวิธีการสร้างหน่วยเนื้อหาที่ตรงกันที่มีตารางกริดขนาด 4x1 บนอุปกรณ์เคลื่อนที่และตารางกริดขนาด 2x2 บนเดสก์ท็อป คุณอาจต้องการใช้การตั้งค่านี้หากคุณมีไซต์ที่ปรับเปลี่ยนตามอุปกรณ์

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- pbad -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxx"
     data-ad-slot="1234567890"
     ข้อมูลที่ตรงกับเนื้อหาแถว-NUM = "4,2"
     ข้อมูลที่ตรงกับเนื้อหาคอลัมน์ NUM = "1,2"
     ข้อมูลที่ตรงกับเนื้อหาประเภท UI = "image_stacked, image_stacked"
     data-ad-format="autorelaxed"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

4x1 grid

2x2 grid

แชร์ความคิดเห็น

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

การแก้ปัญหา

หลังจากที่คุณได้ปรับแต่งหน่วยเนื้อหาที่ตรงกันของคุณแล้ว การปรับแต่งนี้อาจจะไม่ปรากฏตามที่คุณคาดหวังไว้ ปัญหาทั่วไปเกี่ยวกับหน่วยเนื้อหาที่ตรงกันและวิธีแก้ไขมีดังต่อไปนี้

หน่วยเนื้อหาที่ตรงกันของคุณว่างเปล่า

อาจมาจากสาเหตุ 2 ข้อดังต่อไปนี้

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

หน่วยเนื้อหาที่ตรงกันของคุณมีวิดีโอแนะนำน้อยกว่าที่คุณคาดไว้

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

วิดีโอแนะนำของคุณเป็นแบบข้อความเท่านั้น

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

ใช้คอนโซลเพื่อค้นหาข้อผิดพลาดในหน่วยเนื้อหาที่ตรงกันของคุณ

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

หากใช้ Chrome คุณปฏิบัติตามขั้นตอนเหล่านี้ได้เพื่อทดสอบโค้ดโฆษณาใน DevTools Console

  1. ไปที่หน้าเว็บที่มีหน่วยเนื้อหาที่ตรงกันของคุณ
  2. กด Ctrl+Shift+J (Windows / Linux) หรือ Cmd+Opt+J (Mac)
  3. ตรวจสอบแผงควบคุมคอนโซลว่ามีข้อความแสดงข้อผิดพลาดหรือไม่
ข้อมูลนี้มีประโยชน์ไหม
เราจะปรับปรุงได้อย่างไร