Cara merubah tampilan home post blog rak buku

banyak sekali kini desain desain template blog yang sangat bagus maupun menarik terutama bisa kita lihat di bagian home post blog anda berubah menjadi lebih menarik, nah disini saya akan memberitahukan kepada anda sekalian cara membuat tampilan home post blog keren lebih menarik menjadi seperti rak buku ya bisa kita sebut juga mengganti thumbnail post blog menjadi seperti rak buku dan jauh lebih simple.

DEMO

Ikuti Langkah - Langkah :

1. Login Blog anda dan buka yang ingin di pasang
2. Buka Tata Letak
3. Tambahkan Gadget > HTML/JavaScript
4. Masukan Kode Di Bawah, Beri nama Latest Post Dan Simpan
5.      <style>
       #daftar-isi-body
       {
                width:760px!important;
                height:600px!important;
                padding:30px 40px;
                margin:0 auto;
       }
        #daftar-isi-wrap
       {
                margin: 0 auto;
       }
        .box-posting
       {
                background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgONZXlMVA4uiENmSp2MPqMAEnwHxIwxy4woYz7-xJlQCqwbZZTtw5YTdtb9maC_YwZyzDMHrRylMAV79fDEPezB_FmyiupGRMFL0_4ZwFcchgMDyk2OUC8maCgzPWbi0MQZXWEaDYqAwA/s1600/bg-box.png);
                background-position:bottom center;
                background-repeat:no-repeat;
                overflow:hidden;
                cursor:pointer;
                float:left;
                height:140px;
                width:248px;
                margin:-50px 0 0 0;
       }
        .box-posting img
       {
                height:46px;
                width:46px;
                float:left;
                margin:20px 0 0 25px;
                background-color:#2E0700;
                border:1px solid #2E0700;
                -webkit-border-radius: 30px;
                -moz-border-radius: 30px;
                border-radius: 50%;
       }
        .box-posting .judul-posting
       {
                float:left;
                height:35px;
                margin:0;
                width:220px;
       }
        .box-posting .judul-posting a
       {
                font-family:arial,Serif !important;
                color:#774A34!important;
                text-shadow:0 0 1px rgba(0,0,0,0.9);
                margin:-40px 0 0 80px;
                display:block;
                font-size:13px !important;
                line-height:18px!important;
                font-weight:bold !important;
       }
        .box-posting .judul-posting a:hover
       {
                color:#333!important;
       }
        .box-posting:hover
       {
                border-left-color:#C6EB04;
       }
        #totales
       {
                text-align:center;
                color:#774A34 !important;
                text-shadow:0 1px rgba(0,0,0,0.2);
       }
        #loadingscript
       {
                color:#444;
                font-family:Century Gothic;
                font-size:100px;
                letter-spacing:-10px;
                text-align:center;
                text-shadow:-5px 0 1px #444;
       }
        #paginacion
       {
                color:#BBB;
                font-size:24px;
                font-weight:bold;
                height:35px;
                line-height:28px;
                padding:0;
                margin:0 auto;
                text-align:center;
       }
        #paginacion span,#paginacion a
       {
                display:inline-block;
                font-size:13px !important;
                line-height:24px;
                font-weight:bold;
                margin:0 1px;
                width:25px;
                height:25px;
       }
       #paginacion a, #paginacion span.actual
       {
                background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj61UeyL5JyrmX6nden4SkMYEibnd2kSw6jHoe6hnLE5yv7tOwVulyG8cu_pbvS-rTA2aP-UlfAZaE797hugom_ZDqqmXjnmLqwlgVal3EtTmaU2p-E-hauXpybpPZRP2k2Wk8Z7e0L9yQ/s1600/page-link.png);
                background-position:top center;
                background-repeat:no-repeat;
                color:#250700 !important;
                text-shadow:0px 1px 0px rgba(255,255,255,0.1);
       }
        #paginacion span.actual
       {
                color:#774A34 !important;
       }
        #paginacion a:hover
       {
                color:#FFF !important;
       }
        #paginacion .nextprev-link,
        #paginacion span.nextprev-link
       {
                border:none;
                color:#250700 !important;
                text-shadow:0px 1px 0px rgba(255,255,255,0.1);
                width:100px;
                background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoCRmuIlVs-YKCt7cb4IFCk-Lx0FWUs5qYRVEJsmL_smJ3Xztn18Fz_w2TAUQwxmojZshICCSu9z0hyUAZOV99ArjkRB5sljVx94JN6Nq4HIv0W_YoYrjEAKtJclXOcczgE3_wt45cwjc/s1600/nextprev.png);
                background-position:top center;
                background-repeat:no-repeat;
       }
       </style>
       <script type="text/javascript">
                         var jumlahposting = 18;
                         var urlblog = "http://Baraka Bisnis.blogspot.com";
                         var minpaginas = 5;
                         var maxpaginas = 10;
                         var thumbs = "https://blog-barakabisnis.blogspot.com//search?q=cara-widget-hanya-tampil-di-homepage">Cara Menampilkan Widget Hanya Di HomePage SEO Friendly
   
   Selesai deh silahkan anda lihat hasilnya sendiri dan selamat menikmati , kami tunggu kunjungan selanjutnya

Share this post