การใส่โค้ด adsesne ในเนื้อหาของ Blogger

การใส่โค้ด adsesne ในเนื้อหาของ Blogger
         ถ้าเป็น WordPress ก็แค่ใช้ plugin นิดหน่อยแต่พอเป็น Blogger มันค่อนข้างยุ่งยากนิดหน่อย ต้องเปลี่นแปลงครื่องหมายต่างๆ ภายในโค็ด adsesne เพราะเราใส่ไปตรงๆมันไม่ได้ครับ
ใช้บริการเว็บนี้ได้เลยครับ ใส่โค้ดแอดเซ็นเข้าไป มันจะแปลงออกมาในรูปแบบที่ใช้ใน Blogger ทันที
http://www.eblogtemplates.com/blogger-ad-code-converter/
เราเอาโค้ดเดิมใส่เข้าไปในช่อง converter ครับ จะได้ออกมาเป็นแบบนี้

<script type="text/javascript"><!–
google_ad_client = "pub-12345678";
/* 336×280, created 11/16/09 tom */
google_ad_slot = "12345678";
google_ad_width = 336;
google_ad_height = 280;
//–>
</script>
<script type="text/javascript"
src="hxxp://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

พอเราได้โค้ดที่แปลงแล้วก็ login เข้ามาที่ Dashboard ใน Blogger ของเราแล้วเลือก Template -> Edit HTML แล้วติ๊กที่ Expand Widget Templates ด้วยนะครับ เพราะถ้าเราไม่ติ๊ก โค้ดที่ซ่อนไว้เราจะหาไม่เจอนะครับ
จากนั้นเพื่อให้ง่ายต่อการค้นหาก็ให้กด ctr+f ค้นหา (ใช้ได้กับการค้นหา keyword ใน browser) แล้วพิมพ์  “post.body” จะเจอโค้ดรูปแบบนี้  เราจะทำการใส่โค้ดแอดเซ็นที่เราได้มาลงไป

<div class=’post-header-line-1′/>
<div style=’float:left;’>
โค้ด adsense ที่เป็นรูปแบบ Blogger แล้ว
</div>
<div class=’post-body’>
<p><data:post.body/></p>
<div style=’clear: both;’/> <!– clear for photos floats –>
</div>

จากรูปแบบข้างบนจะได้โฆษณา adsense ที่ตำแหน่งด้านซ้ายครับ

ถ้าอยากให้โฆษณา adsense ชิดด้านขวา ก็แค่เปลี่ยนโค้ดจาก left เป็น right

<div style=’float:right;’>
โค้ด adsense ที่เป็นรูปแบบ Blogger แล้ว
</div>

ก็จะได้แจะได้โฆษณา adsense ที่ตำแหน่งด้านขวาแบบนี้ครับ

นอกจากนั้นเรายังสามารถกำหนดระยะห่างโดยรอบของโฆษณา adsense กับเนื้อหา โดยใช้กำหนด margin

<div style=’float:left; margin:5px 10px 15px 20px’>
โค้ด adsense ที่เป็นรูปแบบ Blogger แล้ว
</div>

• ตัวเลข    5  px คือค่าระยะห่างด้านบน
• ตัวเลข 10  px คือค่าระยะห่างด้านขวา
• ตัวเลข 15  px คือค่าระยะห่างด้านล่าง
• ตัวเลข 20 px คือค่าระยะห่างด้านซ้าย

ส่วนสีของโค้ดโฆษณา adsense แบบใหม่ก็เข้าไปแก้กันเองใน Google นะครับ