สวัสดีครับ ยังจำ กระทู้นี้ เมื่อ 6 ปีที่แล้วได้ไหมเอ่ย?
ใช่ครับ ผมกลับมาอีกแล้วตามคำเรียกร้องของแฟน ๆ ที่ต้องการปรับแต่งหน้าจอรายชื่อกระทู้ให้แสดงเฉพาะชื่อกระทู้
ก็ไม่พูดพล่ามทำเพลงครับ ครั้งนี้ขอเสนอการปรับแต่ง 4 อย่าง คือ
1. เพิ่มความกว้างให้เต็มหน้าจอของบราวเซอร์
2. ปรับการแสดงผลรายชื่อกระทู้ให้เป็นแบบบรรทัดเดียว
3. ซ่อนกระทู้ที่ไม่สนใจ (จากเดิมจะเห็นเป็นสีจาง)
4. ปรับการแสดงผลกระทู้แนะนำให้เป็นแบบบรรทัดเดียว
4.1. ปรับกระทู้แนะนำให้เป็นคอลัมน์เดียว
/* For new Pantip */
/* 1. Full width */
.pt-body.with-nav.with-footer .container { max-width: none !important; }
/* 2. Format post list to single-line */
#pt-topic-left ul.pt-list li.pt-list-item { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 16px !important; }
#pt-topic-left ul.pt-list li.pt-list-item .pt-list-item__title { display: inline !important; }
#pt-topic-left ul.pt-list li.pt-list-item .pt-list-item__title > h2 { display: inline !important; }
#pt-topic-left ul.pt-list li.pt-list-item .pt-list-item__info { display: inline !important; float: none !important; padding-left: 4px; }
#pt-topic-left ul.pt-list li.pt-list-item a .pt-list-item__img.img-thumbnail { display: none !important; }
#pt-topic-left ul.pt-list li.pt-list-item .pt-list-item__info > h5 { display: inline !important; }
#pt-topic-left ul.pt-list li.pt-list-item .pt-list-item__info > h5 > a { display: inline !important; }
#pt-topic-left ul.pt-list li.pt-list-item .pt-list-item__title .pt-list-item__tag { display: none !important; }
/* 3. Hide uninterested post */
#pt-topic-left ul.pt-list li.pt-list-item.pt-list-item_ignored { display: none !important; }
/* 4. Format recommen list to single-line */
ul.pt-list.pt-list-sidebar li.pt-list-item { padding-top: 4px !important; padding-bottom: 4px !important; padding-left: 16px !important; }
ul.pt-list.pt-list-sidebar li.pt-list-item a .pt-list-item__img.img-thumbnail { display: none !important; }
ul.pt-list.pt-list-sidebar li.pt-list-item .pt-list-item__title { display: inline !important; }
ul.pt-list.pt-list-sidebar li.pt-list-item .pt-list-item__title > h2 { display: inline !important; }
ul.pt-list.pt-list-sidebar li.pt-list-item .pt-list-item__info { display: inline !important; float: none !important; padding-left: 4px; }
ul.pt-list.pt-list-sidebar li.pt-list-item .pt-list-item__title .pt-list-item__tag { display: none !important; }
ul.pt-list.pt-list-sidebar li.pt-list-item .pt-list-item__info > h5 { display: inline !important; }
ul.pt-list.pt-list-sidebar li.pt-list-item .pt-list-item__info > h5 > a { display: inline !important; }
ul.pt-list.pt-list-sidebar li.pt-list-item .pt-list-item__info > span { display: inline !important; }
/* 4.1. Format recommend list to single-column */
ul.pt-list-sidebar.pt-list__2col li.pt-list-item { width: 100% !important; }
ต้องการใช้อันไหนก็เลือกใส่ตาม Comment เลยนะครับ จากนั้นก็ให้บันทึกไฟล์นี้โดยแต่ละบราวเซอร์มีวิธีการดังนี้
Firefox
- เข้าเมนู Help --> Troubleshooting Information
- คลิกปุ่ม Open Folder (หรือ Open Directory) ที่หัวข้อ Profile Folder (หรือ Profile Directory)
- สร้าง folder ชื่อว่า chrome (ถ้ามีอยู่แล้วก็ข้ามขั้นตอนนี้ไป)
- บันทึกไฟล์ในชื่อ userContent.css โดยเก็บไว้ในไดเรกทอรี chrome
- ปิด และเปิดบราวเซอร์ใหม่
Internet Explorer
- บันทึกไฟล์ในชื่ออะไรก็ได้ที่ไหนก็ได้
- เข้าเมนู Internet Options
- คลิกปุ่ม Accessibility...
- คลิกที่ตัวเลือก Format documents using my style sheet
- คลิกปุ่ม Browse... แล้วเลือกไฟล์ที่บันทึกไว้ข้างต้น
Google Chrome
- ให้ติดตั้ง Extension ชื่อ Personalized Web
- เมื่อติดตั้งเสร็จแล้วเข้าไปกำหนด Options ของ Extension
- คลิกปุ่ม Add new rule
- ในหัวข้อ Match URLs ให้ใส่ ^https://pantip.com/
[Spoil] คลิกเพื่อดูข้อความที่ซ่อนไว้
- ก็อปข้อความข้างต้นใส่ในช่อง Add CSS:
- คลิกปุ่ม Save
สำหรับ Opera ลองดูตาม 14-1 ครับ ถ้ามีสมาชิกมายืนยันผมจะเอาขั้นตอนมาใส่ไว้ตรงนี้
สำหรับ Safari ลองดูตาม 38-1 ครับ ถ้ามีสมาชิกมายืนยันผมจะเอาขั้นตอนมาใส่ไว้ตรงนี้
รายการแก้ไข
- ปรับการแสดงผลแบบเต็มหน้าจอให้มีผลกับเว็บพันทิปเท่านั้น
- เพิ่มคำสั่งสำหรับซ่อนกระทู้ที่ไม่สนใจ
- เพิ่มคำสั่งสำหรับกระทู้แนะนำให้เป็นบรรทัดเดียว (และคอลัมน์เดียว)
คุณต้องการสื่อสารอะไรครับ?
คำถาม คุณต้องการสื่อสารอะไรครับ?
คำตอบ คือผมตอบกระทู้ของคุณครับ หรือ รายการเปลี่ยนแปลงต่างๆของเว็บพันทิป ครับผม
หรืออยากร่วมแสดงความคิดเห็น เชิญได้ที่กระทู้นี้ครับ htดดtps://pantip.com/topic/39104681