Cara membuat multiple page di blogger

halo semua, mau tanya nih ada yang tau gak cara buat halaman di postingan blog seperti di blog ini goo.gl/Ikwdj3

Cara membuat multiple page di blogger

ane udah nyari2 tutor yang kaya blog diatas cuman g ada yang nge-reload setiap klik halaman selanjutnya.

Terima kasih 😀

TK Ditanyakan on 29 November 2016 pada Blog.
Tambah Komentar
2 Jawaban

Pagination sekarang enggan diminati banyak blogger yang udah masta, kenapa ? semakin banyak reload maka bounce rate maka semakin tinggi itu tidak disukai oleh google. Bisa jadi nanti ranking blog agan bakalan turun. Sekarang google sangat mengutamakan kenyamanan user dimana google menyuarakn AMP atau load via ajax biar tidak terjadi load halaman berlebihan.

Itu terserah agan sih saya cuma ngasih saran dan info terbaru, memang kalo segi adsense itu bisa menambah page view tapi apalah arti pageview kalo nanti visitor sedikit 🙂

Doktor Terjawab on 29 November 2016

hehe… makasih atas sarannya gan, ane g akan pake yg gituan ko gan, cuman pengen tau aja + bakalan ane jadiin tutorial di blog ane, soalnya belum ada yg buat tutorial cara buat paginaion yg bisa nge-reload di blogger 😀

on 30 November 2016.
Tambah Komentar

Bantu jawab saja gan 🙂 kebetulan blog ane seperti itu 😀

  • Taruk kode ini di bawah <head>

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

  • Setelah itu taruk kode ini di bawah ]]></b:skin>

.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;

}

  • Setalah itu taru lagi kode ini dibawah </head>

<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>

  • Terakhir taru kode ini setiap mau posting artikel untuk menunjukkan halaman berikutnya

RE: Cara membuat multiple page di blogger


<div class="content_1">

Konten Pertama

</div>

<div class="content_2" style="display: none;">

Konten Halaman kedua

</div>

<div class="content_3" style="display: none;">

Konten Halaman ketiga

</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>

 

Semoga membantu :iloveindonesia

Megister Terjawab on 29 November 2016

makasih gan atas tutorialnya, cuman yg agan itu page nya kaya tab, yg ane maksud kalo mau ke halaman selanjutnya bisa nge reload kaya blog ini lho https://goo.gl/Ikwdj3

on 30 November 2016.
Tambah Komentar
  • Jawaban Anda

    Dengan memposting jawaban, anda setuju dengan Kebijakan Privasi dan ketentuan layanan.