ควบคุมการแสดงผลหน้าบล็อกด้วยแท็ก more

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

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

ตัวอย่างการใช้ tag more

ตัวอย่างของการควบคุมการแสดงผล

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

more tag ในโหมด Visual

ปุ่มแทรกแท็ก more เมื่อเขียนบทความในโหมด Visual

more tag ในโหมด HTML

ปุ่มแทรกแท็ก more เมื่อเขียนบทความในโหมด HTML

จากภาพตัวอย่างการตัดข้อความเพื่อแสดงผลที่หน้าแรกนั้น เรามาดูภาพการใส่แท็ก more กัน

ตัวอย่างการใส่ tag more

วางเม้าส์ตรงจุดที่เราต้องการตัด จากนั้นคลิกแท็ก more เมื่อแสดงผลที่หน้าแรก ก็จะแสดงผลเฉพาะบทความที่อยู่ก่อนหน้าแท็ก more

2 thoughts on “ควบคุมการแสดงผลหน้าบล็อกด้วยแท็ก more

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>