หน้าเว็บ

วันจันทร์ที่ 21 พฤศจิกายน พ.ศ. 2554

การใส่เลขหน้า Page Navigation ให้ Blogger แบบที่1

เพื่อความสวยงามของ blog เรา การทำ Page Navigation ด้านล่างของบทความสุดท้าย โดยคลิก Next เพื่ออ่านบทความถัดไป Previous คือไปยังบทความก่อนหน้านี้ เพื่อนๆ สามารถกำหนด blogger ให้มีเลขหน้า หรือ Page Navigation ได้ตามขั้นตอนง่ายๆ ดังนี้ครับ




1. ไปที่เมนู การออกแบบ (Design)
2. คลิก เพิ่ม gadget เลือกเพิ่ม gadget ที่ ชื่อ HTML/จาวาสคริบต์

3. ใส่ code ด้านล่างทั้งหมดนี้ลงไป (โดยไม่ต้องใส่อะไรในช่องชื่อ) ดูรูปประกอบ



<style type="text/css">.showpageArea a {text-decoration:underline;}
.showpageNum a {text-decoration:none;border: 1px solid #cccccc;margin:0 
3px;padding:3px;}.showpageNum a:hover {border: 
1px solid #cccccc;background-color:#cccccc;}.showpagePoint 
{color:#333;text-decoration:none;border: 1px solid #cccccc;background:
 #cccccc;margin:0 3px;padding:3px;}.showpageOf {text-decoration:none;padding:
3px;margin: 0 3px 0 0;}.showpage a {text-decoration:none;border: 
1px solid #cccccc;padding:3px;}.showpage a:hover {text-decoration:none;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;}</style>
<script style="text/javascript">var pageCount=10;var displayPageNum=5;
var upPageWord="Previous";var downPageWord="Next";
</script><script style="text/javascript" 
src='http://siiam.googlecode.com/files/blogger-page-nav-v2.js' ></script>



(คลิกเพื่อขยาย)
หมายเหตุ : var pageCount=10 คือ จำนวนบทความที่จะแสดงในแต่ละหน้า ในที่นี้ผมตั้งไว้ 10 บทความต่อหนึ่งหน้า (เราต้องตั้งให้ตรงกับที่เราตั้งค่าจำนวนบทความสูงสุดต่อหน้าหลักไว้หรือเข้าไป ตรวจสอบได้ที่ เมนู การตั้งค่า (setting) คลิกที่ การจัดรูปแบบ)
                            var displayPageNum=5 คือ จำนวนเลขหน้าที่แสดงใน Slider ในที่นี้ผมตั้งไว้ 5 เลขหน้า

4.บันทึก gadget (save gadget)
5.ลาก gadget ตัวนี้ ไปไว้ใต้บทความ (blog post)


6.บันทึก (save) 
7.ดูบล็อก

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

ชานิ กล่าวว่า...

ขอบคุณค่ะ

Unknown กล่าวว่า...

เยีียมครับ ค้นหามานาน

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