เคยสังเกตกันไหมว่า Blogger ของผู้ใช้บางคนจะแสดงข้อมูลในหน้าเว็บบล็อกแบบไม่ซ้ำกัน ตัวอย่างการแสดงข้อมูลส่วนตัวไว้เฉพาะหน้าแรกของบล็อกเท่านั้นหรือในหน้าบทความ ผมมั่นใจว่าน้อยคนนักที่จะรู้เกี่ยวกับเรื่องนี้ ส่วนใหญ่การแสดงข้อมูลเพิ่มเติมบน Blogger จะมีตัวเลือกสำเร็จรูปที่เรียกกันว่า Widgets อาทิเช่น ช่องค้นหา, สถิติบล็อก, รูปภาพ ฯลฯ ที่สามารถเปิดใช้งานผ่าน Gadgets ของบล็อกได้ทันที
ดังนั้นเมื่อเราเปิดใช้องค์ประกอบ Widgets ข้อมูลต่างๆ ก็จะแสดงบนบล็อกอัตโนมัติ แต่ Widgets จะแสดงผลในทุกๆ หน้าบนบล็อก ทำให้ผู้เข้าชมบล็อกอาจจะเกิดความรำคาญที่มีข้อมูลแสดงซ้ำกันทุกหน้า ซึ่งในบทความนี้ผมจะมาแนะนำวิธีการซ่อนและแสดงข้อมูลในหน้าบล็อกที่ต้องการ ยกตัวอย่างเช่น เมื่อเราเข้าไปในหน้าของบทความหรือหมวดหมู่แต่ละบทความ Widgets บางตัวจะหายไปซึ่งเป็นการซ่อนเอาไว้นั้นเอง
ทุกครั้งที่เราต้องการเพิ่ม Widgets ใน Blogger ให้ไปเมนูการออกแบบ Layout เพื่อกำหนดก่อนว่าจะปรับแต่ง Widgets ใดบนหน้าบล็อก ยกตัวอย่างเช่น ผมเลือก Gadgets – HTML/Javascript แล้วตั้งชื่อ Title ของวิดเก็ตอย่าง Sample (แนะนำให้ตั้งชื่อเป็นภาษาอังกฤษก่อน) เพื่อให้ง่ายต่อการค้นหาโค้ด
Blogger การปรับแต่ง Widgets
จากนั้นไปที่เมนูธีม Template ตรงเมนู ปรับแต่ง ให้คลิกที่ลูกศร เลือก แก้ไข HTML ในหน้าต่างใหม่จะปรากฏโค้ดธีมทั้งหมดของ Blogger ให้กดปุ่ม Ctrl + F แล้วค้นหาชื่อของ Widgets ที่เราได้ตั้งไว้ในขั้นตอนการเพิ่มวิดเก็ตจากตัวอย่างใช้ชื่อว่า “Sample” ดังภาพด้านล่างนี้
เมื่อเราค้นหาโค้ดพบแล้วก็จะเข้าสู่การปรับแต่ง Widgets ให้แสดงผลในหน้าเว็บที่เราต้องการ ซึ่งจะแบ่งออกเป็น 8 รูปแบบ ดังนี้
1.แสดงผลเฉพาะหน้าแรก
<b:if cond='data:blog.url == data:blog.homepageUrl'>
</b:if>2.แสดงผลเฉพาะหน้าบทความ
<b:if cond='data:blog.pageType == "item"'>
</b:if>3.ซ่อนการแสดงผลในหน้าบทความ
<b:if cond='data:blog.pageType!= "item"'>
</b:if>4.เปิดการแสดงผลเฉพาะหน้าที่ระบุ URL
<b:if cond='data:blog.url == "URL of the page"'>
</b:if>5.ซ่อนการแสดงผลเฉพาะหน้าที่ระบุ URL
<b:if cond='data:blog.url != "URL of the page"'>
</b:if>6.แสดงผลในหน้า Static Pages
<b:if cond='data:blog.pageType == "static_page"'>
</b:if>7.ซ่อนแสดงผลในหน้า Static Pages
<b:if cond='data:blog.pageType != "static_page"'>
</b:if>8.แสดงผลในหน้าคลังบทความเท่านั้น
<b:if cond='data:blog.pageType == "archive"'>
</b:if>ตัวอย่างการใช้งาน
<b:widget id='HTML1' locked='false' title='Sample' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if></b:includable>
</b:widget>แนะนำ: วิธีสร้าง Blogger ขายของออนไลน์
เมื่อเพิ่มโค้ดข้างต้นลงไปในบรรทัดของ Widgets แล้วให้กด Save Template จากนั้นตรวจสอบโค้ดอีกครั้งแล้วดูผลลัพธ์ที่ได้ ซึ่งเทคนิคการซ่อนและแสดง Widgets บนบล็อกยังสามารถนำไปประยกต์ใช้กับโค้ดอื่นๆ ได้อีกด้วยเพิ่มความน่าสนใจให้แก่บล็อกของเรามากขึ้น