Ridho Technology: Membuat Slide out pada navigasi Posting lama dan Posting baru

Bingung juga ngasih judul dari postingan saya kali ini, tapi untuk jelasnya Tutorial menu kali ini adalah membuat menu Fixed Slide Out yang saya terapkan pada Navigasi untuk Posting Lama dan Baru yang biasanya ada pada bagian bawah artikel, saya buat menjadi menu Fixed dengan efek slide out, yang saya sudah coba pada blog saya sendiri bisa dilihat di sebelah kanan atau kiri blog saya.

Log In Ke blogger anda
Masuk ke rancangan, lalu ke edit html.
Kemudian cari kode

/********************************
CSS Slide Out Posting lama/baru *
********************************/
.lama a {
    color: #000;
    position:fixed;
    top:50%;
    right:-50px;
    height: 23px; width: 100px;
    color: #fff; text-shadow: 1px 1px 0px #999;
    background: #aaa; background-color: rgba(116,116,116,0.36);
    -moz-border-radius-topleft:7px;
    -moz-border-radius-bottomleft:15px;
    padding: 3px 3px;
    text-decoration: none;
    -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in;
    }
.lama a:hover {
    color: #ffffff; /* background saat hover */
    right:-1px;
    background: #fff;
    }

.baru a {
    color: #000; position:fixed;
    top:50%; left:-50px;
    height: 23px; width: 100px;
    color: #fff; text-shadow: 1px 1px 0px #999;
    background: #aaa;
    background-color: rgba(116,116,116,0.36);
    -moz-border-radius-topright:7px;
    -moz-border-radius-bottomright:15px;
    padding: 3px 3px; text-decoration: none;
    -moz-transition: all 0.3s ease-in;
    -o-transition: all 0.3s ease-in;
    -webkit-transition: all 0.3s ease-in;
    transition: all 0.3s ease-in;
    }
.baru a:hover {
    color: #ffffff;
    left:-1px ; background: #fff; /* background saat hover */
    }