Cara Menciptakan Spilit Page Menyerupai Tribunews

 Spilit page atau yang biasa kita sebut membagi Cara menciptakan spilit page ibarat tribunews

Spilit page atau yang biasa kita sebut membagi-bagi setiap beberapa paragraf artikel ke beberapa halaman ialah cara terbaik untuk mengurangi bounce rate, tetapi cara ibarat ini sangat tidak cantik dimata pengunjung. Jika kau ingin menerapkan ini pada website atau blog kau harus pastikan artikel yang ada di blog tersebut panjang dan memadai bukan hanya sekedar artikel 700 kata saja.

Tahukah kau kenapa situs gosip ibarat tribun ada yang dibenci pembaca? Salah satunya ialah alasannya ialah ini. Karna cukup kenyulitian bagi pengunjung dalam membaca artikel apalagi dalam satu halaman tersebut terdapat aneka macam iklan.

Sebenarnya cara penerapanya itu sangat praktis sekali,namun pastinya kau sedikit harus memahami fungsi dan penulisan isyarat HTML dasar. Karena untuk menerapkanya pada setiap paragraf yang akan dibagi kita memakai div Elements. Cara ibarat ini sudah aku terapkan pada artikel cara praktis berguru seo di tahun 2020.

Cara membagi artikel menjadi beberapa halaman

Pertama aku akan contohkan proses penerapanya pada blogger melalui template halaman. Silakan backup template kau sebelum mengikuti tahapan ini, kalau sudah yuk lanjut ke tahapanya.

Langkah pertama buka sajian thema dan klik edit HTML, jikalau kau tidak sanggup mengeditnya secara online kau sanggup mengunduh file template nya terlebih dahulu dan edit memakai aplikasi teks editor favorite kamu. Salin semua isyarat Css dibawah ini.

<style type='text/css'> /* Membagi Halaman di Postingan */ .ryanjhr,.pagearl br{display:none} .ryan_page{text-align:center;margin-top:6px auto 0 auto;border-top:1px solid rgba(0,0,0,0.1)} .pagearl{margin:6px auto;text-align:center;padding:0;overflow:hidden} .pagearl .buttonar{background:#fff;font-weight:400;display:inline-block;color:#222;text-decoration:none;text-align:center;border:1px solid rgba(0,0,0,0.1);border-right:0;margin:auto;font-size:14px;  padding;4rem .75rem;margin:1px; transition:all .1s}.pagearl .buttonar:last-child{border-right:1px solid rgba(0,0,0,0.1)} .pagearl .buttonar:hover,.pagearl .buttonar:active{background:#fafafa;color:#222}.buttonar.ryan_page{background:#3498DB;border-color:#3498DB;color:#fff;transition:all .1s} .buttonar.ryan_page:hover{background:#2980B9;border-color:#2980B9;color:#fff} </style>

Kembali ke editor kamu, cari tag <head&gt, jikalau kau memakai komputer tekan CTRL + F untuk mencari string head. Kalau sudah ketemu pastekan css yang sudah kau copy dibawah nya.

Read:  Cara Mudah Menghasilkan Dan Menggunakan Kabel Edl Atau Dfc

Kita lanjut ke langkah kedua pemasangan javascript. Sebelumnya pastikan template kau sudah mebggunakan Jquery versi berapapun, jikalau belum tambahkan script jquery berikut sebelum tag epilog </body>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'/></script>

Salin juga isyarat javascripy spilit page ini, kemudian paste pada template kau sebelum tag epilog </body>

<script type='text/javascript'> //<![CDATA[ function get_n(halaman){var o,t,e=decodeURIComponent(window.location.search.substring(1)).split("&");for(t=0;t<e.length;t++)if((o=e[t].split("="))[0]===halaman)return void 0===o[1]||o[1]}$(document).ready(function(){var halaman=get_n("halaman");$(".ryanjhr").hide(),void 0===halaman?$(".content_1").show():$(".content_"+halaman).show();var o=$(".ryanjhr").length;if(0!=o)for(i=1;i<=o;i++){var t=window.location.pathname;$(".pagearl").append($('<a href="'+t+"?halaman="+i+'#paragraf'+i+'" class="buttonar n'+i+'"> '+i+" </a>"))}else $(".pagearl").hide();void 0==halaman&&$(".buttonar.n1").toggleClass("ryan_page"),halaman==halaman&&$(".buttonar.n"+halaman).toggleClass("ryan_page")}); //]]> </script>  

Tahapan terakhir silakan kau cari isyarat <data:post.body/>, pada template umum ada 3 isyarat tersebut. Pastekan isyarat script dibawah ini, sempurna sesudah isyarat post body diatas, ingat ada 3 ya sanggup saja ada dua tergantung template yang kau gunakan pastekan di setiap meta tersebut.

 <div class="ryan_page"></div> <div class="pagearl"></div> 

 

Cara penggunaan isyarat script diatas

Untuk penggunaanya kau harus menulis artikel eksklusif dalam mode HTML Di blogger, gunakan class div dibawah ini untuk mengatur paragraf menjadi beberapa halaman.

 <div class="ryanjhr content_1" id="paragraf1"> Artikel paragraf   </div>  <div class="ryanjhr content_2" id="paragraf2"> Artikel paragraf   </div>  

Lapisi dengan div setiap beberapa paragraf yang akan kau jadikan satu halaman, dan angka yang aku beri latar kuning dipakai untuk menciptakan paragraf berada pada halaman satu, kedua, ketiga secara berurutan. Pastikan kau menulis tidak menyalahibaturan yang dibuat. Jangan gunakan ini jikalau satu artikel kau pendek, untuk demonya kau sanggup melihatnya disini.

You May Also Like