เอาการใส่ Read more ใน Template Blogger มาฝาก แบบใส่สคริป Auto พร้อม ตย.รูป

[Fineme]

สำหรับ Blogger นะครับ คราวที่แล้วมีวิธีการทำแนะนำไปแล้ว ผมก็เข้าไปศึกษา พร้อมกลับเอาไปใช้ ก็ใช้ได้ดีครับ แต่ถ้าเราใส่ code เอง พร้อมทั้งต้องตัดคำเองด้วย วันละ1บทความก็ไม่เป็นไร พอได้อยู่ แล้วถ้าบทความวันละเป็นสิบๆบทความ นี่แย่เลย นั่งงมตาลาย  ผมยิ่งไม่เก่งกับ Code Javascript ด้วย อีกทั้งบาง Template ก็ทำไม่ได้ ผมก็เอาวิธีนี้มาฝากครับ ดูรูปตัวอย่าง รับรองใช้ได้ทุก Template ครับ ทำครั้งเดียว ไม่ต้องทำซ้ำอีก (ถ้าเปลี่ยน Template ก็ทำใหม่ครับ)

เครื่องมือที่ใช้
1.Template Blogger ที่เราต้องการแก้ไข (แล้วแต่ชอบ) ไม่มีไปที่นี่ http://btemplates.com/
2.โปรแกรม EditPlus 3

วิธีการทำ
1.ขั้นแรก login เข้า Blogger ก่อน เข้าไปแล้วไปที่ Tab แก้ไข HTML>เลือกที่ หัวข้อ ดาวน์โหลดแม่แบบฉบับเต็ม เพื่อดาวน์โหลด Template ที่เราใช้ไปแล้วเอาออกมาแก้ไข (ถ้าจะเอา Template ใหม่ก็ข้ามข้อนี้ไปเลย)
2.จะได้ไฟล์ template-XXXXXXX.xml มา 1 อัน
3.ใช้โปรแกรม EditPlus 3 เปิดเพื่อแก้ไข (ง่ายดีครับ ผมไม่เป็นทางนี้ยังใช้เป็นเลย)
4.ไปที่ Tab Search ใน EditPlus เลือก Find ใส่ ]]></b:skin> ในช่อง Find what แล้วกด ปุ่ม Find
เลย
5.จากนั้น Copy Javascript ดังต่อไปนี้ เอาไปวางต่อคำสั่ง ]]></b:skin> ได้เลยตามรูป

ใส่ code นี้

<script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
</script>
<script src='http://www.thaivegas.com/lab/files/read-moreotomatis.js'/>

โดยสามารถกำหนดความกว้างและยาวของรูปตัวอย่างในบทความได้โดย ความยาว img_thumb_hieght และความกว้างที่ img_thumb_width

6.จากนั้น search หาคำว่า  <data:post.body/> แล้ววาง Code ทับCode <data:post.body/> อันเก่าได้เลย ด้วย Code Javascript ต่อไปนี้ ดังภาพ

ใส่ code นี้

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> read more &#8220;<data:post.title/>&#8221;</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

รูปก่อนใส่

รูปหลังใส่ Code ทับ <data:post.body/> อันเก่าได้เลย

หลังทำแล้ว ก็ทดลองใส่ Template Blogger ที่เราแก้ไขแล้วกลับเข้าไปดูครับ (คงไม่ต้องบอกนะว่าใส่ยังไง ) ตามตัวอย่างเว็บนี้ครับ http://playstation3story.blogspot.com/

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

*****รู้แล้วแบ่งบันกันครับ*****

[KaPonGZaYo]

+1 ครับ  ขอบคุณสำหรับความรู้ดีๆที่มาแบ่งปันครับ 

[bom_z]

+1 ครับ
อ่านต่อก่อน

[KasaBiaN]

ขอบคุณมากๆครับ กำลังอยากทำเป็นอยู่พอดีเลย

จะรองฝึกทำดูครับ

[hunterx555]

แจ่มเลยคร้าบ

[Extreme]

blog สวยมากครับ ชมจากใจจริง blogger ปรับแต่งซะหน่อยก็สวย+แรงไม่แพ้เว็บใดในโลก อิอิ

[chanin607]

ขอบคุณครับ

[harleydavidsons]

ตัดลิ้งออกจาก read more ด้วยครับ ให้เหลือลิงค์จาก title อย่างเดียวจะดีกว่าครับ

[gigkokman]

ขอบคุณครับ อยากได้มานานแล้ว 

[yayeenui]

ทำไม่ได้ค่ะหา <data:post.body/> ไม่มี

ไม่ทราบว่ามีวิธีอื่นอีกไหมค่ะ

[oat_indy]

ขอบคุณมากครับ

[protun]

ทำไม่ได้ค่ะหา <data:post.body/> ไม่มี

ไม่ทราบว่ามีวิธีอื่นอีกไหมค่ะ

ติ๊กถูกที่ expand หรือยังครับ

[GSI]

จะเข้ามาบอกว่า template สวยมากกกก 

+1 ให้คนมีน้ำใจ 

[เกรียนพันธ์แท้]

ขอบใจมากครับ

[จ.จื้อ]

อยากถามว่าถ้าในโพส บทความเราเป็นบรรทัดๆไม่ได้เป็นย่อหน้ายาว

แล้วหน้าแรก read more บรรทัดจะเด้งขึ้นมาเป็นย่อหน้าเดียวกันเปล่าครับ อยากคงให้มันเป็นบรรทัดเอาไว้น่ะครับ

จะเข้าใจคำถามผมมั้ยนี่  

[Mankapook]

 
น้ำใจงามจริง   

[iPOM]

หา data:post.body ไม่เจอเหมือนกันครับ

ต้องเปลี่ยนธีมรึเปล่า  


แก้ไขครับ : หาเจอแล้ว ขอบคุณครับ 

[ลุงอุ๋ย]

ขอบคุณมากครับ มีประโยชน์จริงๆ

[doop]

ขอบคุณครับ

[zidit]

ถูกใจคอบล๊อกเกอร์อย่างผมจริงๆ