Tutorial berikutnya akan memberikan sebuah tutorial Membagi Konten Artikel Menjadi Beberapa Halaman dengan Efek Slide. Di sini sobat hanya perlu menambahkan kode HTML di editor postingan yang nantinya akan muncul di blog sobat.
Tutorial ini sangat cocok bagi sobat yang memiliki tulisan artikel yang cukup panjang di blognya, sehingga akan menghemat ruang di halaman posting. Oke, langsung saja silakan ikuti langkah-langkah berikut ini.
Membagi Konten Artikel Menjadi Beberapa Halaman
1. Login ke blogger > Buka Template > Salin kode di bawah ini sebelum ]]></b:skin> atau </style>
/* 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}
Untuk menambahkan halaman, ganti maxIndex=4 dengan angka tertentu.
3. Simpan template.
4. Langkah berikutnya, buat postingan baru kemudian salin kode di bawah ini di tab HTML
<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>
5. Publish artikel dan lihat hasilnya.
Demikian tutorial cara membuat isi konten dibagi menjadi beberapa halaman dengan efek slide semoga bermanfaat dan membantu kegiatan blogging sobat semua.