สวัสดีครับ

มีหลายๆคนที่ใช้งาน Blogger.com หรือ ซับโดเมน Blogspot.com อยู่ คงเคยคิดอยากมี Read more… เหมือนอย่างใน WordPress กันบ้าง เพื่อลดอัตราการดาวน์โหลดหน้าเว็บของเราให้เร็วขึ้น อีกทั้งเป็นเสน่ห์ในการดึงดูดให้ผู้อ่านได้คลิก เพื่อติดตามอ่านบทความนั้นๆ อย่างใจจดใจจ่อ สำหรับผู้ใช้งานบล็อกมือเซียนต่างๆ คงทำกันเป็นแล้ว แต่สำหรับมือใหม่นั้น คุณกำลังจะเป็นมือเซียนแล้ว…

การทำ Read more ของ blogger blogspot นั้นไม่ยากนักนะครับ หากคุณทำตามขั้นตอนที่ผมจะแนะนำต่อไปจากนี้ การที่เราจะมี read more ได้นั้น เราจำเป็นต้องเข้าไปแก้ code ตรงส่วนของ HTML ฉะนั้น ผมจึงอยากให้ระมัดระวังกันสักนิด หากผิดพลาดไป theme หรือ Template ของคุณ อาจเจ๊งได้ หุหุ ผมพูดจริงๆนะ แต่…ผมมีวิธีป้องกันมาบอกด้วย ไม่ต้องกังวลไป… มาเริ่มกันเลยดีกว่า…

หลังจากที่เรา Log in เข้าบัญชี เพื่อใช้งานบล็อกของเราแล้วนั้น ให้คลิกที่ Layout (รูปแบบ) และ คลิกอีกครั้งที่ Edit HTML (แก้ไข HTML) ซึ่งจะแสดงอยู่ที่บริเวณแถบด้านบน ลองหาดูนะครับ

เมื่อเข้ามาสู่หน้าที่เราสามารถทำการแก้ไข Code HTML แล้ว ผมอยากให้เพื่อนๆ Save รูปแบบเทมเพลตที่ใช้อยู่ก่อนหน้านี้ เพื่อเป็นการป้องกันธีมหรือเทมเพลตพังอย่างที่ผมพูดไว้ก่อนหน้านี้ โดยให้เพื่อนๆ คลิกที่ Download Full Template ดังหมายเลข 1 ที่แสดงในรูป เมื่อโหลดเสร็จแล้วให้เพื่อนๆ คลิกที่ Expand Widget Templates เพื่อทำการขยายเทมเพลตออกดังหมายเลข 2 ที่แสดงในรูปนะครับ


หลังจากนั้น ให้กด Ctrl+F พร้อมกัน ระบบจะเรียกกล่องเล็กๆ ขึ้นมา ให้เราใส่ post-header-line-1 ลงไปในกล่องเล็กๆ นั้น กด Next เมื่อเจอข้อความดังกล่าวแล้วให้เพื่อนๆใส่ Code ด้านล่างนี้

*b:if cond=’data:blog.pageType == “item”‘>
*style>.fullpost{display:inline;}*/style>
*b:else/>
*style>.fullpost{display:none;}*/style>
*/b:if>

โดยนำ Code ใส่ไว้ใต้ *div class=’post-header-line-1’/> ทำให้เหมือนในรูปด้านล่างนะครับ


เมื่อนำ Code ดังกล่าว ใส่เสร็จเป็นที่เรียบร้อยแล้ว ให้ทำการกด Ctrl+F อีกครั้ง เพื่อใส่ข้อความนี้ data:post.body/ ลงไปในกล่อง กด Next หลังจากนั้นนำ Code ด้านล่างนี้

*b:if cond=’data:blog.pageType != “item”‘>
*a expr:href=’data:post.url’>Click here to Read more…*/a>
*/b:if>

ไปใส่ไว้ใต้ *p>*data:post.body/>*/p> ดูภาพประกอบ

เมื่อทุกอย่างเสร็จสิ้นเรียบร้อยให้ลองกด Preview ดูนะครับ หากว่าหน้าบล็อกเราแสดงเป็นอันว่า Code ที่ใส่ไม่มีปัญหาใดๆ ให้กลับมาคลิก Save Template ได้เลย

ขั้นตอนสุดท้ายแล้วนะครับ ให้เรานำ Code ด้านล่างนี้

*span class=”fullpost”>

*/span>

ไปใส่ในส่วน Formatting (การจัดรูปแบบ) โดยคลิกที่ Setting (การตั้งค่า) แล้วไปคลิกอีกครั้งที่ Formatting (การจัดรูปแบบ) นะครับ เลื่อนแถบข้างลงมาด้านล่างสุด จะสังเกตุเห็น Post Template (แม่แบบบทความ) และมีกล่องอยู่ด้านข้างให้เราใส่ Code ด้านบนที่ผมให้ไว้ลงในกล่องดังกล่าว ดูภาพประกอบ

คลิก Save (บันทึก) เป็นอันเสร็จสิ้นการติดตั้ง Read more… แล้วครับ ง่ายๆใช่ไหมครับ???

Read more จะแสดงขึ้นเมื่อเราใส่ข้อความไว้ระหว่าง *span class=”fullpost”> กับ */span>


ลองนำไปใชู้ดูนะครับ หน้าเว็บบล็อกของเพื่อนๆจะได้โหลดได้เร็วขึ้น สำหรับเพื่อนๆ ใครที่ขายสินค้า Affiliate ผ่าน Blogspot อยู่ แนะนำว่าต้องใช้ครับ…

หมายเหตุ: Code ต่างๆที่เห็นนั้น ให้แก้ * เป็น เครื่องหมาย < ทุกอันนะครับ เนื่องด้วยเทคนิคบางประการ ผมไม่สามารถใส่ Code ที่ถูกต้องให้ได้ อย่างไรแล้ว ก่อนนำไปใช้ อย่าลืมแก้ด้วยนะครับ

เพื่อนๆ สามารถอ่านข้อมูลเพิ่มเติมที่ http://help.blogger.com/read-more-blogger ได้นะครับ