Tuesday, May 24, 2016

Cara Membuat Box Baca Juga di dalam Postingan

Cara Membuat Box Baca Juga di dalam Postingan - Box Baca Juga ini bermanfaat untuk menaikkan diagram traffic blog kita juga. Dengan bentuk box yang simple serta keren diisi dengan link url postingan yang menarik akan menunjang lebih traffic blog kita. Saya pun juga pakai. Nah, penampakannya kurang lebih seperti gambar dibawah.

Box Baca Juga


Atau, penampakkan aslinya beserta fitur nya. Silakhan anda coba klik!


Caranya sangat-sangat sederhana. Sama seperti cara biasanya.
Oke, kita langsung aja berikut caranya :

Cara Membuat Box Baca Juga di dalam Postingan


  • Login ke Blogger.com
  • Pilih Template -> Edit HTML, Cari Kode
  • ]]></b:skin> Atau </style>
  • Setelah ketemu, sisipkan kode CSS di bawah ini di salah satu kode di atas!

/* BOX BACA JUGA by http://youdhacom.blogspot.com/ */
.baca-juga{position:relative;display:inline-block}.baca-juga .title{background-color:#FFF;position:absolute;margin-left:30px;margin-top:-14px;padding:0 15px}.content-format b,.content-format strong{font-weight:700}.baca-juga .content{border:1px solid #DDD;padding:20px 20px 0}

  • Kemudian SIMPAN TEMPLATE
  • Habis itu, salin kode HTML di kotak kode bawah ini dan letakkan di postingan anda dengan benar pada Tab HTML (bukan COMPOSE).

<div class="baca-juga">
<div class="title">
<b>
<a href="http://youdhacom.blogspot.com/p/sitemap.html" title="Peta Situs blog YOUDHA">BACA JUGA</a> :
    </b>
  </div>
<div class="content">
<ul>
<li>
        <h4>
<a href="https://youdhacom.blogspot.co.id/2016/05/cara-ampuh-mendapatkan-banyak-traffic-ke-blog.html" title="Cara (AMPUH!!!) Mendapatkan Banyak Traffic Ke Blog">Cara (AMPUH!!!) Mendapatkan Banyak Traffic Ke Blog</a>
</h4>
</li>
<li>
        <h4>
<a href="https://youdhacom.blogspot.co.id/2016/05/cara-dapatkan-traffic-melimpah-dari-googleplus.html" title="Cara Dapatkan Traffic Melimpah dari GooglePlus+">Cara Dapatkan Traffic Melimpah dari GooglePlus+</a>
</h4>
</li>
<li>
        <h4>
<a href="https://youdhacom.blogspot.co.id/2016/05/cara-pasang-komentar-disqus-di-blog-valid-html5.html" title="Cara Pasang Komentar Disqus di Blog Valid HTML5">Cara Pasang Komentar Disqus di Blog Valid HTML5</a>
</h4>
</li>
</ul>
</div>
<br />
<h4>
</div>
<br />

Kode HTML diatas bisa anda kreasikan dengan lebih baik lagi serta lebih banyak lagi dan Ganti kode bewarna biru dengan yang sesuai blog anda . Terima kasih.

1 comment:

  1. makasih info nya
    jgn lupa mampir ya http://candu-blog.blogspot.co.id

    ReplyDelete