Ubah Posting Lama dan Posting Lebih Baru Dengan Tombol

Ubah Posting Lama dan Baru Pasca Dengan Buttons - Umumnya, pagination pada blogger bertuliskan t Pos Lama atau Baru Post atau sesuai dengan bahasa yang dipilih untuk blog Anda.

Have you ever seen a blog that pagination using button as shown below? Apakah Anda pernah melihat blog yang pagination menggunakan tombol seperti yang ditunjukkan di bawah ini?

The buttons use in pagination are considered more attractive for some bloggers, but many bloggers doesn't like it. Tombol digunakan dalam pagination dianggap lebih menarik bagi beberapa blogger, tapi banyak blogger tidak menyukainya. If you consider that the use of buttons on pagination is more interesting but don't know how to apply it to your blog, then blogger tutorial try to discuss it this time. Jika Anda menganggap bahwa penggunaan tombol pada pagination lebih menarik tapi tidak tahu bagaimana untuk menerapkannya ke blog Anda, maka tutorial blogger mencoba untuk membahas kali ini.

Create HTML Image Code for Button Buat Image Kode HTML untuk Button

The first step you should prepare is the icon for the button. Langkah pertama yang harus Anda siapkan adalah ikon untuk tombol. You can create yourself or download on free icons website provider. Anda dapat membuat sendiri atau download pada website penyedia ikon gratis. Example for free icons website provider is http://www.iconspedia.com . Contoh untuk situs penyedia ikon gratis http://www.iconspedia.com . For example, I will use the icon as follows: Sebagai contoh, saya akan menggunakan ikon sebagai berikut:

Upload those icons to bloggers. Upload mereka ikon untuk blogger. For how to upload images to blogger has been discussed in posts How to upload images in Blogger and how to create HTML code to display the image on the blog in Create HTML Code to Display Image on Blog article. Untuk cara untuk meng-upload foto ke blogger telah dibahas dalam posting Cara untuk upload gambar di Blogger dan bagaimana membuat kode HTML untuk menampilkan gambar pada blog di Buat Kode HTML untuk Tampilan Gambar di Blog artikel. For example, button code will be used are as follows: Sebagai contoh, kode tombol akan digunakan adalah sebagai berikut:

 <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7xQ7g9LSu6ThfBIiqlljICbzN8XzMvayC-oBcH4dZd2E80C44cfG_FPKRALemTXfvg-aPFdEyMQC3xKdcg2Wo3iDe9Hbbi0Ab-GYUmRdwKq7eMJ3fq0SXp_oZGVtOSkfIrHCgs9HzypKz/s1600/left.png" /> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7xQ7g9LSu6ThfBIiqlljICbzN8XzMvayC-oBcH4dZd2E80C44cfG_FPKRALemTXfvg-aPFdEyMQC3xKdcg2Wo3iDe9Hbbi0Ab-GYUmRdwKq7eMJ3fq0SXp_oZGVtOSkfIrHCgs9HzypKz/s1600/left.png" />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzjoRrQubtCb65cu_A-MU2mlI6hJCSOdFmldCT08WqP2LM5QKHMt-2CltgLXEbbegrFN7wBcPzHFMQuQdWJBMRTT7sGBOufZ4pFNe-on-IDXF8QnzccAqPvNR-gapZfs2yp-plxlz60b7i/s1600/home.png" /> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzjoRrQubtCb65cu_A-MU2mlI6hJCSOdFmldCT08WqP2LM5QKHMt-2CltgLXEbbegrFN7wBcPzHFMQuQdWJBMRTT7sGBOufZ4pFNe-on-IDXF8QnzccAqPvNR-gapZfs2yp-plxlz60b7i/s1600/home.png" />
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbqnPZMI1uYbzlXpeXZSyj7FGyXQiRx95G4CmB3IJUuktnunIsn5GBFlLIylNGwBz6amnslrCPz50Ye4RPrMFKsBQ7_ounsFRZNb_Xl7jNoQu5OtR0lQvJvWwfPI9QG5v2oQgTaQUj5nFx/s1600/right.png" /> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbqnPZMI1uYbzlXpeXZSyj7FGyXQiRx95G4CmB3IJUuktnunIsn5GBFlLIylNGwBz6amnslrCPz50Ye4RPrMFKsBQ7_ounsFRZNb_Xl7jNoQu5OtR0lQvJvWwfPI9QG5v2oQgTaQUj5nFx/s1600/right.png" />

Change Older Post and Newer Post with Buttons Ubah Posting Lama dan Baru Post dengan Buttons

Now it's time to change your blog pagination code with button code which has been prepared. Sekarang saatnya untuk mengubah kode pagination blog Anda dengan kode tombol yang telah disiapkan.

Here are the steps: Berikut adalah langkah-langkahnya:

1. Please login to blogger with your ID Silahkan login ke blogger dengan ID anda
2. Click Design Klik Design
   
3. Click Edit HTML tab Klik tab Edit HTML
   
4. Please backup your template first then click Download Full Template Harap Anda template backup terlebih dahulu kemudian klik Download Full Template
5. Check the small box next to Expand Widget Templates Centang kotak kecil di samping Expand Template Widget
   
6. Find the following code: Cari kode berikut:

   <span id='blog-pager-newer-link'> <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a> </span> </b:if> <b:if cond='data:olderPageUrl'> <span id='blog-pager-older-link'> <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a> </span> </b:if> <a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a> <span id='blog-pager-newer-link'> <kelas expr = 'blog-pager-newer-link ": href =' data: newerPageUrl 'expr: id data =': widget.instanceId +" _blog- pager-newer-link "'expr: title =' data: newerPageTitle '> <data:newerPageTitle/> </ a> </ span> </ b: if> <b:if cond='data:olderPageUrl'> < span id <> = 'blog-pager-older-link' kelas expr = 'blog-pager-older-link ": href =' data: olderPageUrl 'expr: id data =': widget.instanceId +" _blog-pager -tua-link "'expr: title =' data: olderPageTitle '> <data:olderPageTitle/> </ a> </ span> </ b: if> <a class =' ​​home-link 'expr: href =' Data: blog.homepageUrl '> <data:homeMsg/> </ a> 

7. Delete the code above and replace with the following code: Hapus kode di atas dan ganti dengan kode berikut:

    <span id='blog-pager-newer-link'> <span id='blog-pager-newer-link'>
         <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7xQ7g9LSu6ThfBIiqlljICbzN8XzMvayC-oBcH4dZd2E80C44cfG_FPKRALemTXfvg-aPFdEyMQC3xKdcg2Wo3iDe9Hbbi0Ab-GYUmRdwKq7eMJ3fq0SXp_oZGVtOSkfIrHCgs9HzypKz/s1600/left.png" /></a> <Kelas expr = 'blog-pager-newer-link ": href =' data: newerPageUrl 'expr: id' data: widget.instanceId +" _blog-pager-newer-link "'= expr: data title =': newerPageTitle '> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7xQ7g9LSu6ThfBIiqlljICbzN8XzMvayC-oBcH4dZd2E80C44cfG_FPKRALemTXfvg-aPFdEyMQC3xKdcg2Wo3iDe9Hbbi0Ab-GYUmRdwKq7eMJ3fq0SXp_oZGVtOSkfIrHCgs9HzypKz/s1600/left.png" /> </ a>
         </span> </ Span>
       </b:if> </ B: if>
       <b:if cond='data:olderPageUrl'> cond='data:blog.pageType cond='data:olderPageUrl'>
         <span id='blog-pager-older-link'> <span id='blog-pager-older-link'>
         <a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbqnPZMI1uYbzlXpeXZSyj7FGyXQiRx95G4CmB3IJUuktnunIsn5GBFlLIylNGwBz6amnslrCPz50Ye4RPrMFKsBQ7_ounsFRZNb_Xl7jNoQu5OtR0lQvJvWwfPI9QG5v2oQgTaQUj5nFx/s1600/right.png" /></a> <Kelas expr = 'blog-pager-older-link ": href =' data: olderPageUrl 'expr: id' data: widget.instanceId +" _blog-pager-older-link "'= expr: data title =': olderPageTitle '> <img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbqnPZMI1uYbzlXpeXZSyj7FGyXQiRx95G4CmB3IJUuktnunIsn5GBFlLIylNGwBz6amnslrCPz50Ye4RPrMFKsBQ7_ounsFRZNb_Xl7jNoQu5OtR0lQvJvWwfPI9QG5v2oQgTaQUj5nFx/s1600/right.png" /> </ a>
         </span> </ Span>
       </b:if> </ B: if>
       <a class='home-link' expr:href='data:blog.homepageUrl'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzjoRrQubtCb65cu_A-MU2mlI6hJCSOdFmldCT08WqP2LM5QKHMt-2CltgLXEbbegrFN7wBcPzHFMQuQdWJBMRTT7sGBOufZ4pFNe-on-IDXF8QnzccAqPvNR-gapZfs2yp-plxlz60b7i/s1600/home.png" /></a> <a class='home-link' expr:href='data:blog.homepageUrl'> perbatasan <img = "0" src = "http://2.bp.blogspot.com/-iWwHwNV2L5Y/TcPXo3eJhDI/AAAAAAAAACs/ dyS1qldWPmc/s1600/home.png "/> </ a>

8. Click Save Template Klik Simpan Template
9. Finish Selesai

If you didn't do any mistakes, then your pagination inscribed with Older Post , Newer Post , and Home should has been turned into buttons. Jika Anda tidak melakukan kesalahan, maka pagination Anda bertuliskan dengan Posting Lama , Baru Post, dan Home harus telah berubah menjadi tombol.