Selamat Datang Di Blog Bisnis Online Terpercaya www.maslukis.com


Minggu, 11 Desember 2016

Cara Membuat Multiple Pages Dengan Navigasi di Postingan Blogger

Tutorial kali ini saya akan membagikan bagaimana membuat multiple page di postingan blog. Pastinya sobat pernah melihat postingan yang di buat multiple page atau postingan yang di bagi dalam beberapa halaman. Kalau sobat sering baca artikel yang di bagikan di Facebook pastinya pernah melihat yang seperti ini, dimana satu postingan di bagi menjadi beberapa halaman.

Di Blogger kita juga bisa membagi halaman postingan blog kita, walau di bagi tapi sebenarnya kita tidak benar-benar membuat halaman yang baru, dan halaman tidak perlu di load berkali-kali atau menuju halaman baru untuk membaca artikel kelanjutannya. Bagaimana tertarik ingin membuatnya? berikut adalah caranya.

Cara Membuat Multiple Pages di Blogger

1. Di Blog Blogger kamu.
2. Pilih menu Template kemudian pilih Edit HTML
3. Letakan kode berikut di atas </head> .
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src='https://cdn.rawgit.com/Brando07/share/newbe/multiple-pages-SEOCIPS.js' type='text/javascript'></script>
<style>
.post-pagination { margin:40px auto; text-align:center; width:100%; float:left; }
.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>
Kode berwarna merah di atas di hapus saja jika sudah ada yang seperti itu di template kamu. Save.
4. Buat postingan dan jika selesai jangan dulu di publikasikan tapi masuk ke mode HTML

5. Masukan kode dibawah ini.
<div class="content_1">
Masukan artikel kamu 1
</div>
<div class="content_2" style="display: none;">
Masukan artikel kamu 2
</div>
<div class="content_3" style="display: none;">
Masukan artikel kamu 3
</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>
Ganti tulisan berwarna hijau di atas dengan postingan yang sudah kamu bagi, yaitu Masukan artikel kamu 1 diganti dengan bagian pertama postingan kamu Masukan artikel kamu 2 di ganti dengan bagian kedua postingan kamu dan Masukan artikel kamu 3 diganti dengan bagian ketiga postingan kamu. Oh ya!, kamu hanya dapat membagi postingan kamu menjadi 3 Bagian.
6. Jika selesai langsung publikasikan postingan kamu dan ingat, jangan kembai ke mode compose.
7. Selesai. 


Selamat mencoba, salam sukses.



Baca Juga:

Comments
0 Comments

0 komentar:

Posting Komentar

 
Copyright © 2018. Info Hari Ini . All Rights Reserved
Jl. Delta Raya Utara Kav. 49 - 51 Deltasari Baru, Sidoarjo, Jawa Timur, Indonesia 61256
PT. Bimasakti Multi Sinergi