หน่วยโฆษณา

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

ถัดไป: เกี่ยวกับ Accelerated Mobile Pages (AMP)

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

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

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

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

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

ขยายทั้งหมด ยุบทั้งหมด

เปลี่ยนเลย์เอาต์ของหน่วยโฆษณา Multiplex

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

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

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

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

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           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>

ตัวอย่างโฆษณาที่มีเลย์เอาต์รูปภาพและข้อความแสดงคู่กัน

รูปภาพและข้อความแสดงข้างกันโดยมีกรอบเป็นการ์ด

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

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           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>

Example of an ad with 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?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           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>

ตัวอย่างโฆษณาที่มีรูปภาพแสดงเหนือเลย์เอาต์ข้อความ

รูปภาพแสดงเหนือข้อความโดยมีกรอบเป็นการ์ด

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

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           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>

ตัวอย่างโฆษณาที่มีรูปภาพแสดงเหนือข้อความโดยมีเลย์เอาต์เป็นการ์ด

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

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

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           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>

ตัวอย่างเลย์เอาต์โฆษณาแบบข้อความเท่านั้น

ข้อความโดยมีกรอบเป็นการ์ด

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

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

      <!-- pbad -->

      <ins class="adsbygoogle"

           style="display:block"

           data-ad-client="ca-pub-1234567890123456"

           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>

ตัวอย่างข้อความที่มีเลย์เอาต์โฆษณาเป็นการ์ด

ระบุจํานวนแถวและคอลัมน์ในหน่วยโฆษณา Multiplex

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

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

หมายเหตุ:

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

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

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

โค้ดตัวอย่างนี้จะแสดงวิธีการสร้างหน่วยโฆษณา Multiplex ที่มี 4 แถว 1 คอลัมน์ ซึ่งแสดงโฆษณาทั้งหมด 4 รายการ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

        <!-- pbad -->

        <ins class="adsbygoogle"

             style="display:block"

             data-ad-client="ca-pub-1234567890123456"

             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>

ตัวอย่างรูปภาพและข้อความที่จัดเรียงให้รูปภาพปรากฏอยู่บนเหนือข้อความใน AdSense

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

โค้ดตัวอย่างนี้จะแสดงวิธีการสร้างหน่วยโฆษณา Multiplex ที่มี 2 แถว 2 คอลัมน์ ซึ่งแสดงโฆษณาทั้งหมด 4 รายการ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

        <!-- pbad -->

        <ins class="adsbygoogle"

             style="display:block"

             data-ad-client="ca-pub-1234567890123456"

             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>

หน่วยโฆษณา Multiplex ใน AdSense ที่มี 2 แถวและ 2 คอลัมน์ ซึ่งแสดงโฆษณาทั้งหมด 4 ชิ้น

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

โค้ดตัวอย่างนี้จะแสดงวิธีการสร้างหน่วยโฆษณา Multiplex ที่มี 3 แถว 3 คอลัมน์ ซึ่งแสดงโฆษณาทั้งหมด 9 รายการ

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

        <!-- pbad -->

        <ins class="adsbygoogle"

             style="display:block"

             data-ad-client="ca-pub-1234567890123456"

             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>

หน่วยโฆษณา Multiplex ใน AdSense ที่มี 3 แถวและ 3 คอลัมน์ ซึ่งแสดงโฆษณาทั้งหมด 9 ชิ้น

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

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

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890123456" crossorigin="anonymous"></script>

        <!-- pbad -->

        <ins class="adsbygoogle"

             style="display:block"

             data-ad-client="ca-pub-1234567890123456"

             data-ad-slot="1234567890"

             data-matched-content-rows-num="4,2"

             data-matched-content-columns-num="1,2"

             data-matched-content-ui-type="image_stacked,image_stacked"

             data-ad-format="autorelaxed"></ins>

        <script>

        (adsbygoogle = window.adsbygoogle || []).push({});

        </script>

หน่วยโฆษณา Multiplex ใน AdSense ที่มี 2 แถวและ 2 คอลัมน์ ซึ่งแสดงโฆษณาทั้งหมด 4 ชิ้น

การแก้ปัญหา

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

หน่วยโฆษณา Multiplex ว่างเปล่า

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

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

หน่วยโฆษณา Multiplex มีโฆษณาน้อยกว่าที่คุณคาดไว้

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

โฆษณาของคุณเป็นแบบข้อความเท่านั้น

ปัญหานี้อาจเกิดขึ้นหากหน่วยโฆษณา Multiplex แคบเกินไปสำหรับจํานวนโฆษณาที่คุณกำหนดไว้ ในกรณีนี้ คุณควรเพิ่มความกว้างของหน่วยโฆษณา Multiplex

ใช้คอนโซลเพื่อค้นหาข้อผิดพลาดในหน่วยโฆษณา Multiplex

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

หากใช้ Chrome คุณสามารถทำตามขั้นตอนเหล่านี้เพื่อทดสอบโค้ดโฆษณาในคอนโซลเครื่องมือสำหรับนักพัฒนาเว็บได้

ไปที่หน้าที่มีหน่วยโฆษณา Multiplex
กด Ctrl+Shift+J (Windows/Linux) หรือ Cmd+Opt+J (Mac)
ตรวจสอบแผงควบคุมคอนโซลว่ามีข้อความแสดงข้อผิดพลาดหรือไม่

ข้อมูลนี้มีประโยชน์ไหม

เราจะปรับปรุงได้อย่างไร