Related post บทความที่คุณอาจสนใจ ใน blogger

เพื่อนใหม่ท่านหนึ่งฝากคอมเม้นท์ไว้ที่บล็อก แต่ว่าคำถามกลับไปอยู่ที่ spam box พึ่งได้เปิดดูเมื่อตะกี้นี้เอง ครั้นเห็นคำถามตอบได้ทันทีก็เลยรีบตอบดีกว่า ประเดี๋ยวโรคประจำตัวคือ ขี้ลืม จะทำพิษให้กลายเป็นการดองคำถาม

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

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

ขั้นตอนแรก ให้ Login เข้าไปที่ Blogger>การออกแบบ>แก้ไข html> ติ๊กเครื่องหมายถูกที่ ขยายเทมเพลตวิตเจ็ต ดังรูปด้านบน

ขั้นตอนที่ 2 คลิีก crtl+f ค้นหา โค้ดต่อไปนี้ </head> เมื่อเจอให้ copy code ในตารางด้านบนนี้ไปวาง โดยให้วางไว้ก่อนหน้า </head>

ขั้นตอนที่ 3 คลิีก crtl+f เพื่อค้นหา โค้ดต่อไปนี้ <data:post.body/> หรือไม่ก็ <div class='post-body> หรือบาง template ก็ มีรูปแบบ <data:post.body/> จะค้นหาให้ง่าย อธิบายเพิ่มสักนิดว่า เมื่อคลิ๊ก crtl ค้างแล้วคลิ๊ก f จะปรากฏช่องเล็ก ๆ ด้านล่าง บราวเซอร์ ให้ copy โค้ดทีเราต้องการค้นหาวางลงไป แล้วค้นหาด้วยการคลิ๊ก ถัดไปเรื่อย ๆ หากเจอจะมี cursor สีเขียว ๆ ให้ดังรุปด้านบนค่ะ

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=5"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

ขั้นตอนที่ 4 เมื่อค้นหา code เจอแล้ว ให้เพื่อน ๆ copy code ในตารางด้านบนนี้วางไว้ต่อจาก code ที่หาเจอ

ขั้นตอนสุดท้าย เลือกบันทึกแม่แบบ แค่นี้ก็เรียบร้อย

เพิ่มเติมอีกนิดนะคะ จากตาราง code ที่ 2 ตรง Related Posts : ข้อความนี้เราสามารถปรับแต่งได้ อาจจะเปลี่ยนเป็นบทความที่คุณอาจสนใจ หรือข้อความอื่น ๆ ได้

อีกที่คือ max-results=5

เป็นค่าที่กำหนดการแสดงผลบทความ หากต้องการให้แสดงกี่บทความเราก็เปลี่ยนที่ จาก 5 เป็น 4 หรือ 3 แล้วแต่อยากจะกำหนด แต่จากการทดลองของดิฉ้นเอง เปลี่ยนค่าเป็น 4 แต่ผลการแสดงกลับเป็น 5 เปลี่ยนค่าเป็น 5 การแสดงบทความเป็น 6 เอาเป็นว่าลองทดสอบดูกันเอาเองค่ะ

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

ทดลองนำไปปรับแต่งกันดูนะคะ ได้ผลเป็นเช่นไร ชอบใจหรือไม่ แวะมาทักทายกันได้ค่ะ

ที่มา http://widgetsforfree.blogspot.com/2009/01/related-posts-widget-for-blogger.html