Blogger: ซ่อนแถบด้านข้างในบางหน้าตามต้องการ


การสั่งซ่อนแถบคอลัมน์ด้านข้างของบล็อกในบางหน้าที่เรากำหนดโดยในหน้าอื่นๆ ของบล็อกยังสามารถแสดงแถบคอลัมน์ด้านข้างเหล่านั้นได้ตามปกติ

โดยสามารถดูตัวอย่างได้จากลิงก์ข้างล่างนี้
http://maxlayout-bookcase.blogspot.com/

ซึ่งในขั้นตอนที่ 2 จะมีให้เลือกอยู่สองแบบคือ
- แบบที่ 1 ซ่อนขณะอยู่ในหน้าสารบัญบทความ (Index Pages) ซึ่งก็คือ หน้าแรก, หน้า Label และ หน้า archive
- แบบที่ 2 ซ่อนเมื่อเข้าไปที่บทความเท่านั้น (Hide blogger sidebar Column on post page)
- แบบที่ 3 ซ่อนเมื่อเข้าไปที่บทความหรือหน้าเว็บอิสระ (Static Pages)
- แบบที่ 4 ซ่อนเปิดในอื่นที่ไม่ใช่หน้าแรก
ซึ่งสามารถทำได้ดังนี้

ขั้นตอนที่ 1. เข้าสู่บล็อกของคุณจากนั้นไปที่
'แม่แบบ > แก้ไข HTML'

ขั้นตอนที่ 2. กด 'Ctrl + F' บนคีย์บอร์ดแล้วสั่งค้นหาคำว่า
]]></b:skin>
จากนั้นให้เลือกแทนที่โค้ดที่หาเจอนั้นด้วยโค้ดแบบใดแบบหนึ่งข้างล่างนี้


แบบที่ 1 ซ่อนขณะอยู่ในหน้าสารบัญบทความ

]]></b:skin>
<!-- hide sidebar on index pages start -->
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<style>
.main-inner .columns {
padding-left: 0px !important;
padding-right: 0px !important;
}
.main-inner .fauxcolumn-center-outer {
left: 0px !important;
right: 0px !important;
}
.main-inner .fauxcolumn-left-outer, .main-inner .fauxcolumn-right-outer, .main-inner .column-left-outer, .main-inner .column-right-outer {
display: none !important;
}
</style>
</b:if>
<!-- hide sidebar on index pages end -->



แบบที่ 2 ซ่อนเมื่อเข้าไปที่บทความเท่านั้น

]]></b:skin>
<!-- hide sidebar on post pages start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
.main-inner .columns {
padding-left: 0px !important;
padding-right: 0px !important;
}
.main-inner .fauxcolumn-center-outer {
left: 0px !important;
right: 0px !important;
}
.main-inner .fauxcolumn-left-outer, .main-inner .fauxcolumn-right-outer, .main-inner .column-left-outer, .main-inner .column-right-outer {
display: none !important;
}
</style>
</b:if>
<!-- hide sidebar on post pages end -->



แบบที่ 3 ซ่อนเมื่อเข้าไปที่บทความหรือหน้าเว็บอิสระ

]]></b:skin>
<!-- hide sidebar on post and static pages start -->
<b:if cond='data:blog.pageType != &quot;index&quot;'>
 <style>
.main-inner .columns {
padding-left: 0px !important;
padding-right: 0px !important;
}
.main-inner .fauxcolumn-center-outer {
left: 0px !important;
right: 0px !important;
}
.main-inner .fauxcolumn-left-outer, .main-inner .fauxcolumn-right-outer, .main-inner .column-left-outer, .main-inner .column-right-outer {
display: none !important;
}
</style>
</b:if>
<!-- hide sidebar on post and static pages end -->



แบบที่ 4 ซ่อนเมื่อเปิดหน้าอื่นที่ไม่ใช่หน้าแรก

]]></b:skin>
<!-- hide sidebar on post and static pages start -->
<b:if cond='data:blog.url != data:blog.homepageUrl'>
 <style>
.main-inner .columns {
padding-left: 0px !important;
padding-right: 0px !important;
}
.main-inner .fauxcolumn-center-outer {
left: 0px !important;
right: 0px !important;
}
.main-inner .fauxcolumn-left-outer, .main-inner .fauxcolumn-right-outer, .main-inner .column-left-outer, .main-inner .column-right-outer {
display: none !important;
}
</style>
</b:if>
<!-- hide sidebar on post and static pages end -->




ขั้นตอนที่ 3. จากนั้นกดปุ่ม 'บันทึกเทมเพลต' แล้วลองเปิดบล็อกเพื่อดูผลลัพธ์

อธิบายเพิ่มเติม
นอกจากนี้อาจลองอ่านวิธีกำหนดเงื่อนไขแบบอื่นๆ ได้ตามลิงก์นี้ครับ
http://tip.maxlayout.com/2012/11/targeting-specific-pages-urls-with-conditional-tags.html

Post Status




4 ความคิดเห็น:

Top-NungD กล่าวว่า...

ซ่อนไม่ได้อ่ะคะ ลองทำแล้ว :(

Max กล่าวว่า...

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

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

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

Top-NungD กล่าวว่า...

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

Max กล่าวว่า...

ดูจากผลหลังการแก้ไขโค้ดก็ได้ครับ เช่นเดียวกับลิงก์ตัวอย่างซึ่งขณะนี้ถูกกำหนดว่าหน้าแรกของบล็อกจะไม่แสดงแถบด้านข้างหรือก็คือ Sidebar แต่ให้ปรากฏอยู่ในหน้าอื่นแทน

แสดงความคิดเห็น