Hướng dẫn này bắt nguồn từ Arlina Design, sẽ cung cấp cho các bạn cách Tạo Box Trình Bày Nội Dung Qua Nhiều Trang. Ở đây bạn chỉ cần thêm mã HTML vào trình chỉnh sửa bài đăng sẽ xuất hiện trên blog của bạn.
Hướng dẫn này là hoàn hảo cho các blogger để tạo ra một box bài viết đủ dài, đủ để trình bày nội dung của các bạn mà tiết kiệm được không gian trang của website.

Các Bước Tạo Box Hiệu Ứng Trình Bày Nội Dung Qua Nhiều Trang

Bước 1: Thêm đoạn code bên dưới vào trước ]]></b:skin

/* Multiple Page Slide */

a.movepg.nexter,a.movepg.prever{color:#fff}

.separator{overflow:hidden;max-height:240px;margin:0 0 20px}.separator img{background:#eee;max-width:100%;vertical-align:middle;background-position:middle;border:0;height:auto;width:100%}.next-wrap img,.next-wrap video,.next-wrap object{max-width:100% }.next-wrap{position:relative;padding:0 0 0 40px;line-height:normal;}.instruction{display:block;height:100%;width:100%;overflow:hidden}.slidecontentWrap{width:1000%}.slidecontent{float:left;width:10%;line-height:161%;overflow:hidden}.movepg{display:none;position:absolute;bottom:20px;background:#e74c3c;color:#fff;font-weight:700;text-transform:uppercase;padding:6px 12px;cursor:pointer;font-size:80%;outline:none;border-radius:3px;transition:background .6s}.movepg:hover{background:#c0392b}.movepg.prever{left:20px}.movepg.nexter{right:20px}

Bước 2: Thêm đoạn script bên dưới vào trước </body>

<script type='text/javascript'>

//<![CDATA[

function updateBtnState(){0==index?$(".prever").hide():$(".prever").show(),index==maxIndex?$(".nexter").hide():$(".nexter").show()}var index=0,maxIndex=4;$(".nexter").on("click",function(e){if(index++,index>maxIndex)return void e.preverentDefault();updateBtnState();var n=$(this).parent().find(".slidecontentWrap"),t=100*-index+"%";n.animate({marginLeft:t},300)}),$(".prever").on("click",function(e){if(index--,0>index)return void e.preverentDefault();updateBtnState();var n=$(this).parent().find(".slidecontentWrap"),t=100*-index+"%";n.animate({marginLeft:t},300)}),updateBtnState();

//]]>

</script>

Chú ý: Để thêm một trang, hãy thay đổi maxIndex = 4 bằng một số nhất định.
Bước 3: Thêm đoạn code bên dưới vào nơi bạn cần hiển thiện box trình bày nội dung qua nhiều trang

<div class="next-wrap">

<div id="photocons" class="instruction">

<div class="slidecontentWrap">

<div class="slidecontent">

<-- ISI KONTEN DI SINI -->

</div>

<div class="slidecontent">

<-- ISI KONTEN DI SINI -->

</div>

<div class="slidecontent">

<-- ISI KONTEN DI SINI -->

</div>

<div class="slidecontent">

<-- ISI KONTEN DI SINI -->

</div>

<div class="slidecontent">

<-- ISI KONTEN DI SINI -->

</div>

</div>

</div>

<a class="movepg prever">prev</a>

<a class="movepg nexter">next</a>

</div>