Cara Membuat Content Thumbnail Gambar dengan Bootstrap

1/24/2017

Kembali lagi kita bahas seputar bootstrap, sekarang saya akan membahas bagaimana memasang thumbnail gambar dan content pada blog. Terlebih dahulu bootstrap harus sudah terpasang pada template blog sobat. Silahkan lihat artikel Cara Memasang Bootstrap Pada Blog untuk yang belum pasang bootstrap pada template blognya.

Untuk sobat yang mau memasang thumbnail gambar dan content silahkan ikuti langkah-langkahnya :
Pertama sobat tentukan mau di mana memasangnya, kalau mau di postingan sobat tinggal pasang kodenya pada postingan sobat (di HTML jangan di Compose). Kalau mau di pasang di widget sobat tinggal buat gadget baru pilih HTML/JAVASCRIPT sobat tinggal kasih judul gadgetnya dan sobat copykan kodenya. Berikut kode yang harus di pasang :

<div class="row">
  <div class="col-sm-6 col-md-4">
    <div class="thumbnail">
      <img src="..." alt="patchloader">
      <div class="caption">
        <h3>Thumbnail label</h3>
        <p>...</p>
        <p><a href="#" class="btn btn-primary" role="button">Button</a> <a href="#" class="btn btn-default" role="button">Button</a></p>
      </div>
    </div>
  </div>
</div>

Pada (....) <img src="..." alt="patchloader"> silahkan isi dengan alamat gambar sobat, (...) <p>...</p> isi dengan keterangan gambar sobat dan "#" dengan alamat link sobat. Silahkan sobat lihat contoh di bawah ini :
See the Pen Thumbnail bootstrap by Ariez July (@secret28) on CodePen.

Selsai sudah pembahasan tentang memasang thumbnail dan content pada blog, semoga artikelnya dapat membantu dan bermanfaat buat sobat. Terimakasih

Artikel Terkait 

Artikel Terkait

Previous
Next Post »
Blogger
Disqus
Pilih Sistem Komentar Yang Anda Sukai

No comments

Jangan melakukan spam di blog ini..!!!
Tidak ada link dan bicara kotor...
Terimakasih...