Cara Mudah Membuat Thumbnail Post Warna-Warni Sesuai Label Post - Halo sobat, kali ini saya akan memberikan Trik bagaimana Cara mudah menbuat thumbnail post berwarna-warni sesuai dengan label post sobat.
Sebenarnya mudah saja untuk membuatnya, sobat tidak perlu menggunakan/menambahkan script atau jquery yang mengakibatkan blog bertambah berat.
Lalu bagaimana cara membuatnya ?, berikut Triknya :
1. Pertama-tama Sobat harus mencari kode pembungkus dari thumbnail post sobat dengan cara Klik Kanan Pada Thumbnail Post -> Inspect Element , Dibawah ini menunjukkan bahwa kode pembungkus template saya adalah .thumbnail
2. Masuk Template, Cari kode berikut <div class='thumbnail'> , biasanya kode tersebut lebih dari satu, maka sobat pilih kode pertama yang sobat temukan, ganti kata thumbnail dengan kode pembungkus sobat.
3. Ganti kode tersebut dengan kode dibawah ini :
Ganti thumbnail dengan kode pembungkus post sobat.
4. Setelah itu scroll sedikit kebawah, maka sobat akan menemukan kode </div> yang berwarna merah yang berarti menunjukkan error pada kode, ganti kode </div> yang berwarna merah tadi dengan kode berikut :
5. Terakhir, sobat hanya perlu menambahkan kode css berikut :
Terima kasih telah berkunjung, mari berkomentar dan Happy Blogging, Wassalam.
Sebenarnya mudah saja untuk membuatnya, sobat tidak perlu menggunakan/menambahkan script atau jquery yang mengakibatkan blog bertambah berat.
Baca juga : Cara Membuat Artikel SEO
Lalu bagaimana cara membuatnya ?, berikut Triknya :
1. Pertama-tama Sobat harus mencari kode pembungkus dari thumbnail post sobat dengan cara Klik Kanan Pada Thumbnail Post -> Inspect Element , Dibawah ini menunjukkan bahwa kode pembungkus template saya adalah .thumbnail
 |
| Ilustrasi Element Pembungkus Post |
2. Masuk Template, Cari kode berikut <div class='thumbnail'> , biasanya kode tersebut lebih dari satu, maka sobat pilih kode pertama yang sobat temukan, ganti kata thumbnail dengan kode pembungkus sobat.
3. Ganti kode tersebut dengan kode dibawah ini :
<div class='thumbnail <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'><b:if cond='data:label.isLast == "true"'><data:label.name/></b:if></b:loop></b:if>'>Ganti thumbnail dengan kode pembungkus post sobat.
4. Setelah itu scroll sedikit kebawah, maka sobat akan menemukan kode </div> yang berwarna merah yang berarti menunjukkan error pada kode, ganti kode </div> yang berwarna merah tadi dengan kode berikut :
</div>5. Terakhir, sobat hanya perlu menambahkan kode css berikut :
.thumbnail.Templates {background: none repeat scroll 0% 0% #277FBF; }Perhatikan :
Ganti kode .thumbnail dengan kode pembungkus post sobat.
Ganti kode .Templates dengan nama Label post sobat.
Ganti kode #277FBF dengan kode warna yang sobat suka.
Terima kasih telah berkunjung, mari berkomentar dan Happy Blogging, Wassalam.
Pengelola Blog : ABDUL WAHAB
Judul : Cara Mudah Membuat Thumbnail Post Warna-Warni Sesuai Label Post
Ditulis oleh :Blog Shiro pada hari 2019/12/17
Rating Blog : 5 dari 5
Terima kasih sudah membaca artikel tentang Cara Mudah Membuat Thumbnail Post Warna-Warni Sesuai Label Post
Kalian boleh menyebar luaskannya atau mengcopy paste-nya jika artikel ini sangat bermanfaat bagi Blog dan teman-teman kalian.
Namun jangan lupa harap memberikan link aktif dofollow ke URL
https://fajriandaviar.blogspot.com/2014/10/cara-mudah-membuat-thumbnail-post-warna.html
Dan Terima kasih sekali lagi atas kunjungannya.
Ditulis oleh :Blog Shiro pada hari 2019/12/17
Rating Blog : 5 dari 5
Terima kasih sudah membaca artikel tentang Cara Mudah Membuat Thumbnail Post Warna-Warni Sesuai Label Post
Kalian boleh menyebar luaskannya atau mengcopy paste-nya jika artikel ini sangat bermanfaat bagi Blog dan teman-teman kalian.
Namun jangan lupa harap memberikan link aktif dofollow ke URL
https://fajriandaviar.blogspot.com/2014/10/cara-mudah-membuat-thumbnail-post-warna.html
Dan Terima kasih sekali lagi atas kunjungannya.
Kritik dan saran atau apapun bisa kalian sampaikan melalui kotak komentar.
Dan mohon maaf jika komentar atau pertanyaan tidak bisa cepat saya respon,
karena Saya tidak selalu online dikarenakan sibuk.
15 komentar
Boleh juga ya jadi bervariasi kalau dengan cara ini, mas bisa bantu saya enggak tolong cari template magazine ya profesional soalnya, saya lagi cari-cari kayak kabarnusa misalnya.
asyik nih,, warna-warni.. hehehe
gan gw mau nanyak klo bikin menu sidebar leftnya gimana
gan gilaa keren banget template blog iniiii.. btw ini dibangun pakai css atau software atau agan download templatenya??
Akhirnya ketemu cara nya :-)
yang ke 5 itu di taruh di mana?
OOT nih, bisa sharing tutorial buat recent post label tapi thumbnailnya hanya judul postingan atas saja, kebawahnya tidak ada
templatenya bagus,. bisa sharing gak ?
templatenya bagus.. bisa di sharing gak ya..? trim's
Saya lebih suka gambarnya besar, tapi saya juga tertarik buat-buat warna. Bisakah gambarnya diperbesar sampai 50 kotak?
Terimakasih ya gan atas pengetahuanya,.,. Salam kenal dan jangan lupa followbacknya.,.,.,
ilmu baru lagi buat ane, mayan nih biar blog makin hidup dan penuh warna kayak syahrini feel freeeee.., kalau untuk membuat gambar label berbeda sesuai label gimana caranya gan?
gan mau tanya cara nambahin gambar di komentar gimana ya?? thanks
Gan gimana cara nambahin (Berkomentarlah dengan bijak dan sopan, Dilarang menggunakan Link Aktif, Link Mati, Promo, dll.
Dan Berbagilah Jawaban atas apa kesulitan yang sobat-sobat lainnya dapatkan.
Mohon maaf jika ADA komentar atau pertanyaan tidak bisa cepat saya respon,
DIkarenakan Saya tidak selalu online selama 24 Jam.) ??? sehingga muncul di atas kolom komentar
Halo gan, link blog agan sudah ane taruh di situs ane di halaman sli*p*nes*ia(dot)com/p/tukar-link(dot)html <- hapus (*)
Jangan lupa taruh punya ane juga, ditunggu gan..
Berkomentarlah dengan bijak dan sopan, Dilarang menggunakan Link Aktif, Link Mati, Promo, dll.
Dan Berbagilah Jawaban atas apa kesulitan yang sobat-sobat lainnya dapatkan.
Mohon maaf jika ADA komentar atau pertanyaan tidak bisa cepat saya respon,
DIkarenakan Saya tidak selalu online selama 24 Jam.