Tutorial Menciptakan Sajian Navigasi Tetap Walaupun Di Scroll

Cara Membuat Menu Navigasi Statis atau Sticky di Blog,- Template yaitu sebuah elemen dasar yg membangun sebuah blog atau web yg berisi dari semua fitur menyerupai Sidebar, Header, Post, footer serta lain-lain. atau sanggup dikatekan bahwa template yaitu sebuah wadah untuk eleman lain dari blog serta sebagai tampilan sebuah website.atau blog.

Template blog pun sangat mempengaruhi kesuksesan sebuah blog, kesudahannya silahkan pilih template yg sudah terbukti Seo friendly atau disukai mesin penelusuran google. namun dari semua elemen yg membangun template menyerupai sidebar, Header, Footer serta lain-lain. disini aku akan membagikan sedikit tutorial yg mungkin bermanfaat untuk anda yaitu Cara menciptakan sajian navigasi tetap walaupun di scroll kebawah.

Sebenarnya tutorial ini aku peruntukan bagi yg ingin sekali menciptakan sajian navigasi sticky menyerupai blog lain yg menggunakan, serta cara ini sanggup dibilang sedikit rumit, oleh alasannya itu silahkan di simak baik-baik. berikut tutrialnya:

Cara Membuat Menu Navigasi Tetap walaupun di Scroll


1. Pertama silahkan masuk ke Blogger - Template - Edit Html.

2. Kemudian Silahkan cari instruksi Menu navigasi, pada setiap blog kodenya berbeda-beda namun yg niscaya terdapat instruksi (nav), sebagai pola instruksi blog aku yaitu #navitions.


3. Silahkan catat atau hafalkan instruksi tersebut, lalu silahkan cari instruksi </body>, jikalau sudah ketemu copy instruksi dibawah ini serta paste diatas instruksi </body>

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
    var stickyNavTop = $('#nav').offset().top;
    var stickyNav = function(){
        var scrollTop = $(window).scrollTop();
        if (scrollTop > stickyNavTop) {
            $('#nav').css({ 'position': 'fixed', 'top':0, 'z-index':9999 });
        } else {
            $('#nav').css({ 'position': 'relative' });
        }
    };
    stickyNav();
    $(window).scroll(function() {
        stickyNav();
    });
});
//]]>
</script>

4. Selanjutnya ganti instruksi #nav diatas dengan instruksi sajian navigasi yg sebelumnya ada hafalkan atau catat.

5. Biasanya sajian tersebut akan berantakan, untuk mengatasinya silahkan ganti width:100%; yg ada pada instruksi sajian menyerupai langkah no 2, dengan width:950px; atau jikalau tidak ada silahkan tambahkan sendiri. serta untuk menyesuaikanya dengan template anda sanggup diganti 950px dengan ukuran lain.

Itulah cara menciptakan sajian navigasi tetap walaupun di scroll kebawah, sekian tips blog yg sanggup aku bagikan serta Semoga berhasil.

Artikel Terkait