หลังจากที่คุณสร้างโฆษณา In-feed แล้ว ขั้นตอนถัดไปคือการวางโค้ดภายใน HTML ของฟีด
ตำแหน่งที่จะวางโค้ดโฆษณา In-feed
วางโค้ดโฆษณา In-feed ไว้ในระหว่างเนื้อหาของฟีด หรือตำแหน่งที่ฟีดเริ่มต้นหรือสิ้นสุด โดยคุณสามารถทำได้ด้วยการแก้ไขโค้ด HTML ของฟีดโดยตรง หรือหากคุณใช้ระบบจัดการเนื้อหา (CMS) คุณสามารถใช้ปลั๊กอินเพื่อแทรกโค้ดให้คุณได้
ตัวอย่างการตั้งค่าโฆษณา In-feed อาจมีหน้าตาดังนี้
บล็อกเนื้อหา 1: |
|
บล็อกเนื้อหา 2: |
|
โฆษณาเนทีฟแบบ In-feed: |
|
บล็อกเนื้อหา 3: |
|
บล็อกเนื้อหา 4: |
วิธีวางโฆษณา In-feed
โดยปกติ CMS ของคุณจะมี 1) ฐานข้อมูลที่ประกอบด้วยเนื้อหา และ 2) โค้ดชิ้นหนึ่งที่เรียกใช้เนื้อหาผ่านลูป ซึ่งจะสร้างฟีดขึ้น คุณสามารถค้นหาโค้ดชิ้นนี้ได้ในไฟล์เทมเพลต ซึ่งจะเก็บไว้ในโฟลเดอร์เทมเพลตของ CMS (บางครั้งเรียกว่าโฟลเดอร์ธีม)
แก้ไขโค้ดในไฟล์เทมเพลต
แก้ไขโค้ดในไฟล์เทมเพลตดังนี้เพื่อวางโฆษณา In-feed
- เปิดไฟล์เทมเพลตของหน้าเว็บที่คุณมีฟีด
- ค้นหาลูปที่สร้างฟีดของคุณ (คำแนะนำ: โค้ดลูปมักจะประกอบด้วยคำสั่ง "while" หรือ "for each" เป็นส่วนใหญ่)
- แก้ไขโค้ดลูปเพื่อแทรกโฆษณา In-feed ไว้ในฟีด โดยเฉพาะอย่างยิ่งในกรณีต่อไปนี้
- ถ้าลูปของคุณไม่มีตัวนับ ให้เพิ่มตัวนับเพื่อตั้งค่าความถี่ที่คุณต้องการให้มีการแทรกโฆษณา In-feed
- เพิ่มคำสั่ง "if" ภายในลูปเพื่อทำให้โฆษณา In-feed ปรากฏตามความถี่ที่คุณกำหนดไว้ในตัวนับ
เราได้แสดงโค้ดเทียมบางส่วนไว้ด้านล่าง โค้ดของคุณจะมีโครงสร้างคล้ายกับโค้ดเทียมนี้ แต่การใช้งานจริงจะแตกต่างออกไป ทั้งนี้ขึ้นอยู่กับภาษาการเขียนโปรแกรมที่คุณใช้
โพสต์[] โพสต์;
Var count=1; // ถ้าโค้ดของคุณไม่มีตัวนับ ให้ระบุ 1 รายการ
While (count < posts.length) // เพิ่มค่าของ "count" ขึ้น 1 ค่าจนกว่าจะถึงโพสต์สุดท้ายในฐานข้อมูล
{
If (count%3=0) //ถ้าค่าของ "count" เท่ากับ 3 หรือ 6 หรือ 9 แทรกโฆษณา
{
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
</script>
<ins class="adsbygoogle" style="display:block"
data-ad-format="fluid"
data-ad-client="ca-pub-1234567891234567"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
}
<h3>{{ post.title }}</h3> // สำหรับค่า count ทั้งหมด แทรกชื่อบล็อกเนื้อหา
<p>{{ post.body }}<p> //แทรกเนื้อหาบล็อกเนื้อหา
<img src="{{ post.thumbnail}}"> //แทรกรูปภาพบล็อกเนื้อหา
}
สำคัญ
ตรวจสอบว่าคุณวางโค้ดโฆษณาไว้ในคอนเทนเนอร์ระดับบนสุด (<div>
, <iframe>
ฯลฯ) ที่มีรายละเอียดต่อไปนี้
- ความกว้างที่ใช้ได้ หากคุณวางโค้ดโฆษณาไว้ในคอนเทนเนอร์ระดับบนสุดซึ่งไม่ได้กำหนดความกว้างไว้อย่างชัดเจน เช่น ในองค์ประกอบแบบลอย โฆษณาจะไม่แสดง เราใช้ความกว้างของคอนเทนเนอร์ระดับบนสุดเพื่อคำนวณความกว้างของโฆษณาของคุณ โปรดทราบว่าความกว้างขั้นต่ำของโฆษณา In-feed คือ 250px
- ความสูงที่ไม่คงที่ หากคุณวางโค้ดโฆษณาไว้ในคอนเทนเนอร์ระดับบนสุดซึ่งมีความสูงคงที่ โฆษณาอาจแสดงอย่างไม่สมส่วน