หน้าเว็บ

วันเสาร์ที่ 29 ตุลาคม พ.ศ. 2554

การทำ READ MORE,อ่านต่อ ให้กับบทความ BLOGGER

สำหรับบทความที่ยาวๆ เราอยากให้ดูสั้นพอประมาณ และให้ผู้อ่านคลิกเข้าไปอ่านต่อ นั้นคือ การทำ read more หรือ อ่านต่อ ให้กับบทความใน blogger ของเรา  มีขั้นตอนการทำดังนี้
1. คลิกไปที่เมนู ออกแบบ
2. คลิก แก้ไข HTML
3. คลิก ดาว์โหลดแม่แบบฉบับเต็ม (เป็นการ back up แม่แบบเดิมที่ยังไม่ได้แก้ไข เก็บไว้ที่เครื่อง นะครับ กันพลาด ก็โหลดแม่แบบนี้กลับคืนได้ภายหลัง)
4.เลือก (ติกเครื่องหมายถูก) หน้า ขยายเทมเพลตวิดเจ็ด 
5.ใส่ code สีแดงข้างล่างนี่ใส่ไว้ก่อน </head> หลัง </b:skin> จะได้ตามรูปเลยครับ


]]></b:skin> 
<b:if cond='data:blog.pageType != "item"'> 
<style>#fullpost{ display:none;}</style> 
</b:if> 
</head>


6. จากนั้นกด Ctrl+F หา Code ตัวนี้ครับ <p><data:post.body/></p> เจอแล้วให้ใส่ Code สีแดงไว้ด้านล่าง ตามรูปเลยครับ (จาก code หากไม่ชอบคำว่า Read more เปลี่ยนเป็นคำอื่นได้ครับ)

<div class='post-body entry-content'> 
      <p><data:post.body/></p> 
      <b:if cond='data:blog.pageType != "item"'> 
         <p><a expr:href='data:post.url'>Read More</a></p> 
      </b:if> 
      <div style='clear: both;'/> <!-- clear for photos floats –>


7. บันทึก
8. กลับไปคลิกที่แท็บ การตั้งค่า 
9.คลิกที่แท็บ การจัดรูปแบบ จากนั้นเลือนลงมาด้านล่างสุดจะเจอกล่องข้อความที่ชื่่อ แม่แบบบทความ ให้ Copy ตัว code ข้างล่างนี่ใส่เข้าไป

ส่วนที่จะให้แสดง 
<span id="fullpost"> 
ส่วนที่เหลือ 
</span>


10.ทำการ Save ครับ


11. เราอยากให้ข้อความส่วนไหนแสดงในหน้าแรกให้ใส่ (พิมพ์) ข้อความ ทับหรือแทนคำว่า ส่วนที่จะให้แสดง และอยากให้ส่วนไหนไม่แสดง (ส่วนที่เหลือ) ให้ใส่ (พิมพ์) ข้อความแทนที่คำว่า ส่วนที่เหลือ
ลองทำกันดูนะครับ