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

สอนทำบล็อก วิธีสร้าง blogger Linkwithin

การติดตั้ง Linkwithin Gadget นั้นไม่ใช่เรื่องยากเพียงทำตามขั้นตอน 2-3 ขั้นตอนก็ติดตั้งได้สำเร็จแล้ว แต่บางท่านที่ใช้ Automatic Readmore ก็จะทราบดีว่า Linkwithin Gadget นั้นจะปรากฎในหน้าแรกด้วย ซึ่งมันไม่ควรเป็นเช่นนั้น บทความนี้ผมจะมานำเสนอวิธีการปรับแต่ง ให้ปัญหาที่ว่านี้หมดไปและยังมีลูกเล่นในการปรับแต่งมานำเสนอเพิ่มเติมด้วย

ขั้นตอนการติดตั้ง Linkwithin Gadget

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

ขั้นที่ 1 ไปที่ Homepage ของ Linkwithin
http://www.linkwithin.com/
วิธีสร้างบล็อก สอนเขียนบล็อก แต่ง blog

ขั้นที่ 2 สร้าง Gadget
ให้คุณกรอก email + URL ของบล็อกที่ต้องการติดตั้งและให้ + เลือก platform เป็น other ส่วนเลข 3 – 4 – 5 นั้นหมายถึงจำนวนบทความที่จะแสดง ซึ่งขึ้นอยู่กับว่า Template ในส่วนบทความของคุณกว้างแค่ไหน

วิธีแต่ง blogspot

ขั้นที่ 3 รับโค้ดเพื่อนำไปติดตั้งบน blogger
เมื่อผ่านขั้นที่ 2 แล้วระบบจะสร้างโค้ดให้เราดังรูป
สอนแต่งบล็อก สอนสร้างบล็อก ทำบล็อก

ซึ่งโค้ดที่ได้จะมีลักษณะดังนี้


Related Posts with  Thumbnails
จากนั้นให้ปรับแต่งโค้ดดังนี้ (เติมโค้ดสีแดงลงไป)



Related Posts with  Thumbnails
เราเติมโค้ดสีแดงลงไปเพื่อให้ Gadget ปรากฎเฉพาะในหน้าบทความเท่านั้น ส่วนโค้ดสีเขียวเป็นเครดิตจะลบทิ้งก็ได้แต่โดยมารยาทก็ไม่ควรลบทิ้ง

ขั้นที่ 4 ติดตั้งโค้ดใน Blogger
การติดตั้งโค้ดที่ได้จากขั้นที่ 3 ทำได้โดยการนำโค้ดไปวางในตำแหน่งก่อนหน้าโค้ด หรือก่อนหน้า ในแม่แบบของ blogger ก็ได้
สร้าง blog ทำบล็อก blogspot
เมื่อบันทึกแม่แบบแล้วแน่นอนว่า Gadget จะยังไม่ปรากฎ

ขั้นที่ 5 กำหนดตำแหน่งที่ต้องการให้ Gadget แสดงผล
ขั้นต่อมาถ้าคุณต้องการให้แสดงผลที่ตำแหน่งใดก็ให้ใช้โค้ด้านล่างนี้ไปวางในตำแหน่งที่ต้องการของ Template
โดยก่อนจะหาตำแหน่งในการติดตั้งคุณจะต้อง ขยายเทมเพลตวิดเจ็ตเสียก่อน
สอนทำ blogspot

ตัวอย่างเช่น
5.1 ถ้าต้องการให้อยู่ตอนท้ายของบทความวางโค้ดถัดจากโค้ดใดโค้ดหนึ่งที่พบในแม่แบบของคุณ
หรืออาจจะพบโค้ดเป็น
ซึ่งขึ้นอยู่กับว่าแม่แบบของคุณจะใช้โค้ดแบบใด (แนะนำให้ติดตั้งโดยวิธีนี้)
5.2 ถ้าคุณต้องการให้ Gadget นี้ปรากฎอยู่ใต้ชื่อบทความก็วางถัดจากโค้ด
ซึ่งผมคิดว่าไม่ค่อยเหมาะเท่าไร
5.3 คุณอาจจะนำโค้ด
ไปติดตั้งใน HTML/จาวาสคริปต์ Gadget ก็ได้ ตามความต้องการและความเหมาะสม

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


ขั้นตอนการปรับแต่ง Linkwithin Gadget

ในขั้นนี้เป็นการตกแต่งเพิ่มเติมซึ่งคณอาจจะทำตามหรือไม่ทำก็ได้

ขั้นที่ 6 ปรับแต่ง Title ของ Linkwthin Gadget
เราสามารถปรับแต่งคำว่า You might also like: เป็นคำอื่น ๆ ได้โดยเติมโค้ด
เพิ่มลงไปจากโค้ดของเดิมเช่นถ้าผมเพิ่มโค้ดนี้เข้าไปรวมกับโค้ดในขั้นที่ 3 ก็จะได้โค้ดใหม่เป็น





Related Posts with  Thumbnails

การติดตั้งก็ทำเหมือนที่อธิบายในขั้นที่ 4 และ 5 เช่นเดิมครับ

ขั้นที่ 7 คุณสามารถกำหนด CSS ให้กับ Gadget นี้ได้
เช่น ถ้าผมใช้โค้ด CSS
.linkwithin_div a{color:#000}/*ลิงค์สีดำ*/
.linkwithin_div a:hover{color:#AD0000}/*เปลี่ยนเป็นสีแดงเข้ม*/
เมื่อนำ CSS โค้ดนี้ไปติดตั้งในแม่แบบโดยวางโค้ดในตำแหน่งกอ่นหน้าโค้ด ]]>

สอนแต่งบล็อกของ blogger ิสนเหยนะ

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

หวังว่าคงเป็นประโยชน์นะครับ สวัสดีครับ
from http://www.hackublog.com/2010/07/7-step-to-customize-linkwithin-gadget.html

0 comments:

Post a Comment

Related Posts Plugin for WordPress, Blogger...