page thuah dan

How to Install the Code: The first thing you need to do is make sure you have jQuery installed in your template. The easiest wsy to do that is to go to your template HTML and search for "jquery.min.js" if you don't find it, you need to paste: right before in your template. Depending on how frequently you plan on splitting up posts, you can either add this code to the template of your blog and whenever you write a post you just need to add the content *OR* if it is just a one-off type of thing, you can add the full code to the post itself. Here is how you add the ENTIRE code to your post itself. Open a new post, compose it (get it formatted and beautiful) and then switch over to HTML and paste this at the top.

Add content here

Add content here

Add content here

1 2 3




How to Install the Code: The first thing you need to do is make sure you have jQuery installed in your template. The easiest wsy to do that is to go to your template HTML and search for "jquery.min.js"

if you don't find it, you need to paste:

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>

right before </head> in your template.


Depending on how frequently you plan on splitting up posts, you can either add this code to the template of your blog and whenever you write a post you just need to add the content *OR* if it is just a one-off type of thing, you can add the full code to the post itself.

Here is how you add the ENTIRE code to your post itself.

Open a new post, compose it (get it formatted and beautiful) and then switch over to HTML and paste this at the top. 

<style>     .post-pagination {         margin: 20px auto;         text-align: center;         width: 100%;     }     .button_1, .button_2, .button_3 {         border: 2px solid #f4655f;         font-weight: 900;         padding: 6px 36px;         color:#f4655f;         transition:ease 0.69s !important;     }     .button_1:hover, .button_2:hover, .button_3:hover {         background: none repeat scroll 0 0 #f4655f;         color: #fff;         text-decoration: none;     }     </style>     <script type="text/javascript">     jQuery(document).ready(function(){     jQuery('.button_1').click(function(){     jQuery('.content_1').fadeIn('slow');       jQuery('.content_2').fadeOut('fast');     jQuery('.content_3').fadeOut('fast');     jQuery(this).css('background','#F4655F');     jQuery(this).css('color','#fff');     jQuery('.button_2').css('background','#fff');     jQuery('.button_2').css('color','#F4655F');     jQuery('.button_3').css('background','#fff');     jQuery('.button_3').css('color','#F4655F');     return false;     });     jQuery('.button_2').click(function(){     jQuery('.content_1').fadeOut('fast');       jQuery('.content_2').fadeIn('slow');     jQuery('.content_3').fadeOut('fast');     jQuery(this).css('background','#F4655F');     jQuery(this).css('color','#fff');     jQuery('.button_1').css('background','#fff');     jQuery('.button_1').css('color','#F4655F');     jQuery('.button_3').css('background','#fff');     jQuery('.button_3').css('color','#F4655F');     return false;     });     jQuery('.button_3').click(function(){     jQuery('.content_1').fadeOut('fast');       jQuery('.content_2').fadeOut('fast');     jQuery('.content_3').fadeIn('slow');     jQuery(this).css('background','#F4655F');     jQuery(this).css('color','#fff');     jQuery('.button_1').css('background','#fff');     jQuery('.button_1').css('color','#F4655F');     jQuery('.button_2').css('background','#fff');     jQuery('.button_2').css('color','#F4655F');     return false;     });     });     </script>     <div class="content_1">     Add content here     </div>     <div class="content_2" style="display: none;">     Add content here     </div>     <div class="content_3" style="display: none;">     Add content here     </div>     <div class="post-pagination">     <a class="button_1" href="#">1</a>     <a class="button_2" href="#">2</a>     <a class="button_3" href="#">3</a>     </div>

Written by Admin

We are Creative Blogger Theme Wavers which provides user friendly, effective and easy to use themes. Each support has free and providing HD support screen casting.