Blogger: ซ่อนเครื่องมือบางตัวขณะอยู่ในหน้าที่กำหนดไว้
วิธีทำให้ผู้อ่านมองไม่เห็นเครื่องมือหรือ Widget ในบางหน้า (Hide Blogger Widget On Specific Page) แต่เมื่อผู้อ่านเข้าไปสู่หน้าอื่นก็จะสามาถเห็นเครื่องมือเหล่านั้นได้ตามปกติ สามารถทำได้ดังนี้
โดยวิธีตามขั้นตอนที่ 1-5 จะเป็นการซ่อนเครื่องมือที่ต้องการนั้นให้ผู้อ่านมองไม่เห็นในหน้าแรกแต่ถ้าต้องการซ่อนขณะเปิดในหน้าบทความแทนก็ให้ดูได้ที่อธิบายเพิ่มเติม
นอกจากนี้สามารถดูวิธีตรงข้ามกับบทความนี้ซึ่งก็คือ 'แสดงเครื่องมือเฉพาะในหน้าที่กำหนดไว้เท่านั้น' ได้ตามลิงก์นี้ครับ
http://tip.maxlayout.com/2012/02/display-blogger-widget-only-on-specific-page.html
ขั้นตอนที่ 1. เข้าสู่บล็อกของคุณจากนั้นไปที่ 'การออกแบบ > แก้ไข HTML > ขยายแม่แบบเครื่องมือ'
ขั้นตอนที่ 2. ให้คัดลอก Widget ID ของเครื่องมือที่ต้องการซ่อนเอาไว้ ซึ่งจะเขียนอยู่ที่บริเวณส่วนบนของโค้ดเครื่องมือนั้น
โดยให้สังเกตได้ว่าเครื่องมือ (Widget) จะขึ้นต้นด้วยโค้ดแบบนี้
<b:widget id=
ตัวอย่างเช่น
เครื่องมือ 'ข้อความ' จะขึ้นต้นด้วย
<b:widget id='Text1' locked='false' title='your-widget-name' type='Text'>
ก็จะมี Widget ID คือ 'Text1'
เครื่องมือ 'ป้ายกำกับ' จะขึ้นต้นด้วย
<b:widget id='Label1' locked='false' title='your-widget-name' type='Label'>
ก็จะมี Widget ID คือ 'Label1'
เครื่องมือ 'HTML/จาวาสคริปต์' จะขึ้นต้นด้วย
<b:widget id='HTML1' locked='false' title='your-widget-name' type='HTML'>
ก็จะมี Widget ID คือ 'HTML1'
เครื่องมือ 'รายชื่อลิงก์' จะขึ้นต้นด้วย
<b:widget id='LinkList1' locked='false' title='your-widget-name' type='LinkList'>
ก็จะมี Widget ID คือ 'LinkList1'
ขั้นตอนที่ 3. กด 'Ctrl + F' บนคีย์บอร์ดแล้วสั่งค้นหาคำว่า
]]></b:skin>
จากนั้นให้แทนที่โค้ดที่หาเจอนั้นด้วยโค้ดข้างล่างนี้
]]></b:skin>
<!-- hide widgets start -->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
[HIDE_WIDGET_ID] {
display:none;
}
</style>
</b:if>
</b:if>
<!-- hide widgets end -->
ขั้นตอนที่ 4. ให้เอา Widget ID ของบทความที่เราต้องการซ่อน ซึ่งหาได้มาจากวิธีในขั้นตอนที่ 2 นั้นไปใส่ไว้แทนที่โค้ดในขั้นตอนที่แล้วในบรรทัดที่ 6 ซึ่งเขียนว่า
[HIDE_WIDGET_ID]
โดยเวลาใส่ Widget ID ลงไปแทนที่นั้นต้องอย่าลืมใส่ # นำหน้าด้วยตัวอย่างเช่น
ถ้าต้องการซ่อน 'Text1' ให้มองไม่เห็นในหน้าแรกก็ให้แทนที่ [HIDE_WIDGET_ID] ด้วย #Text1
ซึ่งพอแก้ไขแล้วก็จะเป็นเหมือนกับข้างล่างนี้
]]></b:skin>
<!-- hide widgets start -->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
#Text1 {
display:none;
}
</style>
</b:if>
</b:if>
<!-- hide widgets end -->
นอกจากนี้ถ้าต้องการซ่อนเครื่องมือทีเดียวหลายอันพร้อมกันก็สามาถนำ Widget ID มาเขียนต่อกันได้เลย
โดยต้องอย่าลืมใส่เครื่องหมาย , คั้นไว้ระหว่าง Widget ID แต่ละอันเช่น
ถ้าต้องการซ่อน Text1, Label1, HTML1, จนกระทั่งถึง LinkList1 ให้มองไม่เห็นในหน้าแรกก็ให้แทนที่ [HIDE_WIDGET_ID] ด้วยโค้ดว่า #Text1, #Label1, #HTML1, #LinkList1
ซึ่งพอแก้ไขแล้วก็จะเป็นเหมือนข้างล่างนี้
]]></b:skin>
<!-- hide widgets start -->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
#Text1, #Label1, #HTML1, #LinkList1 {
display:none;
}
</style>
</b:if>
</b:if>
<!-- hide widgets end -->
ขั้นตอนที่ 5. เลือกที่ 'บันทึกแม่แบบ' จากนั้นลองเปิดบล็อกดูผลลัพธ์
อธิบายเพิ่มเติม
ถ้าต้องการให้ครื่องมือ (Widget) ถูกซ่อนก็ต่อเมื่อเลือกเข้าไปอ่านที่บทความแต่ ในหน้าแรกก็ให้แสดงตามปกติ ทำได้ด้วยการเปลี่ยนโค้ด 4 บรรทัดแรกในขั้นตอนที่ 3 และ 4 ซึ่งจากเดิมเขียนเอาไว้ว่า
]]></b:skin>
<!-- hide widgets start -->
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
โดยให้นำโค้ด 3 บรรทัดด้านล่างนี้ใส่ลงไปแทน
]]></b:skin>
<!-- hide widgets start -->
<b:if cond='data:blog.pageType == "item"'>
ป้ายกำกับ:
Blogger
Post Status
เขียนโดย
Max
เขียนเมื่อ
วันพฤหัสบดี, กุมภาพันธ์ 09, 2555
Related Posts:
สมัครสมาชิก:
ส่งความคิดเห็น (Atom)
8 ความคิดเห็น:
ทำเป็นขั้นตอน อ่านเข้าใจง่ายมาก เว็บก็ดูสะอาดน่าใช้มากๆ ขอบคุณครับ
แต่ไม่เห็นอับเดตเฟซบุ๊คเลยครับ รอติดตามอยู่นะครับ
ขอบคุณครับ ในส่วนของเฟซบุ๊คแฟนเพจคงมีการอัพเดทเร็วๆ นี้ครับ
งง ตรง อธิบายเพิ่มเติม อะ 555+
ไห้เอา
]]>
ไปทับ
หลอครับ
อ้าวโค้ดไปไหน หว่า
ผมว่าพีเขียน ตรง อธิบายเพิ่มเติม ผิดแล้ว พี่
จาเอา ไปทับ ขั้นตอนที่ 2 ได้ยังไง อะ
ขั้นตอนที่ 2 มันวิธีหา id widget มะใช่หลอ T^T
โอ้ ผมพิมพ์เลขขั้นตอนผิดจริงด้วย แก้ไขใหม่แล้วครับ
เราสามารถ กำหนดไม่ให้โชว์เมื่อเข้าดู หน้าเว็บ บางหน้าได้มั๊ยคับ
ทำได้ครับ โดยวิธีกำหนดเงื่อนไขว่าทำงานในหน้านั้นหรือไม่จะเขียนต่างกันตรง
== และ !=
ตัวอย่างเช่น
ถ้าต้องการให้เงื่อนไขทำงานเมื่อเข้าสู่บทความแบบเต็มก็เขียนว่า
<b:if cond='data:blog.pageType == "item"'>
แต่หากจะให้เงื่อนไขทำงานในหน้าอื่นยกเว้นหน้าบทความแบบเต็มก็เขียนว่า
<b:if cond='data:blog.pageType != "item"'>
แสดงความคิดเห็น
หมายเหตุ: มีเพียงสมาชิกของบล็อกนี้เท่านั้นที่สามารถแสดงความคิดเห็น