Langsung ke konten utama

Cara menerapkan gambar hanya bisa liat dihalaman homepage saja

 

Cara Menerapkan Gambar Hanya bisa liat Dihalaman Homepage



Cara menerapkan gambar hanya bisa dihalaman homepage dengan kode html. Berawal dari keinginan untuk bisa menampilkan gambar hanya di halaman beranda saja, saya blogwalking atau mengunjungi blog lain dan nemu tipsnya dari blog maxmanroe.com. Ternyata caranya sangat mudah sekali, cukup menggunakan html dan tidak membutuhkan javascript ataupun jquery khusus.

Alasan kenapa saya ingin agar gambar yang ada di dalam posting tidak tampil di halaman artikel namun tetap bisa tampil sebagai thumbnail di halaman homepage. Karena ingin supaya posting yang dipublikasikan terlihat rapih. Jadi nanti gambarnya tidak tampil di postingan, namun tetap bisa muncul di halaman homepage.

Sementara jika di dalam artikel tersebut tidak saya masukan gambar, maka otomatis dihalaman homepage gambar thumbnailnya kosong. Karena kebetulan di salah satu blog saya itu memakai template yang pada home page ada gambar thumbnail dari masing-masing artikel.

Cara menerapkan gambar hanya muncul di homepage ini sangat cocok bila digunakan di blog yang menggunakan tampilan gambar di halaman homepage, namun tidak akan menampilkan gambar di postingan. Terkadang jika tidak menyertakan gambar maka tampilan homepage akan kurang bagus, namun jika menyertakan gambar kadang, gambar bertabrakan dengan iklan yang ada di tengah artikel, oleh karena itu jalan satu-satunya adalah dengan hanya menampilkan gambar di hompage saja.

Cara ini telah berhasil saya terapkan pada 2 template yang berbeda, yang pertama adalah template blog ini yaitu template kompi males dari kompiajaip , dan yang kedua adalah template viomagz dari mas sugeng . 

Jadi kelihatan jelek kalau yang muncul cuma tulisan “No Image” saja. Kalau temen-temen juga mungkin ada yang menginginkan gambar diposting tidak muncul namun dihalaman homepage tetap tampil, silahkan gunakan cara berikut.

Menampilkan Gambar Hanya Dihalaman Homepage

  • Login ke dashboard blogger
  • Pilih Template
  • Edit HTML
  • Format Template

 Tempatkan script di bawah ini setelah atau di atas kode </head><b:if cond=’data:blog.pageType == &quot;item&quot;’>

<style type=”text/css”>
.thumbnail {display:none}
</style>
</b:if>

  • Jika sudah Klik Save Template

Langkah berikutnya yang harus dilakukan yaitu menambahkan sedikit kode kedalam url gambar yang ada disetiap posting.

Berikut kode yang harus ditambahkan pada url gambaruntuk setiap artikel yang gambarnya hanya ingin muncul dihalaman homepage.

Ingat hanya pada gambar yang ingin muncul di homepage saja tidak untuk semua gambar yang ada di dalam artikel.

  • Kode yang harus ditambahkan

 class=”thumbnail”

  • Sehingga lengkapnya nanti akan menjadi seperti berikut.

<img class=”thumbnail” src=”ssblogger22.blogspot.com "

Link-gambar anda ” alt=”penjelasan gambar” />

Demikian artikel Cara Menerapkan Gambar Hanya Muncul Di HomepageAkan lebih mudah tidak perlu merubah semua kode url gambar yang telah ada di dalam posting, cukup hanya menambahkan kode tersebut sebelum “scr”. Cukup mudah bukan, silahkan dicoba dan lihat hasilnya. Semoga membantu dan bermanfaaat untuk anda. 

Komentar

Terbaru

Cara Membuat Link Hidup di Kotak Komentar Blog orang lain

SSBLOGGER22.blogspot.com    Cara Membuat Link Hidup di Kotak Komentar Blog  - Blogwalking adalah komunikasi antar admin blog dengan cara saling mengunjungi blog masing-masing. Agar blog kita juga dikunjungi, kita harus memberitahukan link blog kita kepada orang lain. Hal ini dapat dilakukan dengan "meninggalkan jejak" berupa link blog kita pada kotak komentar, atau pada chat box blog jika tersedia. Breed, khusus untuk link di kotak komentar, butuh kode HTML khusus untuk membuat link tersebut aktif (dapat di-klik). Kali ini blog Dua Rupa akan berbagi cara untuk membuat link aktif pada kotak komentar blog. Cara membuat link hidup di komentar blog atau website orang lain Untuk membuat link aktif pada kotak komentar blog dilakukan dengan cara menuliskan link dengan kode HTML di bawah ini. Ahref="ssblogger22.blogspot.com /" Ssblogger22 </a)> Hasil:Ssblogger22 Penjelasan : Ganti ssblogger22.blogspot.com .  dengan URL link blog atau postingan anda. Ganti Ssblogger22...

Cara Membuat Tampilan Blog di HP Menjadi Versi Dekstop terbaru

SSblogger22.blogspot.com ... Menerapkan  tampilan mobile(seluler) tentunya membuat loading blog menjadi cepat, namun tampilan dari template blog yang sudah diterapkan tak akan terlihat.  Nah, cara agar tampilan blog bisa terlihat menarik sesuai tema/template blog yang sudah kamu terapkan, caranya mudah sekali! Kamu hanya perlu  merubah tampilan blog dari mobile ke versi dekstop . Untuk lebih jelasnya ikuti langkah berikut ini: Baca juga: Cara cari kode html di Android   Cara Membuat Tampilan Blog di HP Menjadi Dekstop  1. Pada dashboard Blogger, pilih Tema Pilih pratinjau tema 2. Klik icon gear atau tanda titik berjumlah tiga dan pada bagian Tema pilih option "Tidak". Tampilkan tema dekstop di perangkat seluler" Pilih gambar dekstop 3 . Setelah menonaktifkan tampilan seluler,tampilan blog yang awalnya mobile akan menjadi dekstop Selesai ganti model dekstop Itulah cara yang bisa kamu lakukan jika ingin  merubah  atau membuat tampilan blog di HP menjadi ...

Cara riset kata kunci turunan,tutorial optimasi seo

Cara riset kata kunci turunan,tutorial {optimasi seo}  Ilustrasi gambar riset kata kunci turunan  Cara riset kata kunci turunan,tutorial optimasi seo ~ Riset kata kunci turunan adalah proses mencari dan mengidentifikasi kata kunci yang berkaitan dengan kata kunci utama yang telah ditentukan. Riset kata kunci turunan dapat dilakukan untuk berbagai tujuan, seperti meningkatkan optimisasi mesin pencari (SEO), menemukan ide konten baru, atau mencari cara untuk menargetkan audiens yang lebih spesifik. Untuk melakukan riset kata kunci turunan, Anda dapat menggunakan alat riset kata kunci seperti Google Ads Keyword Planner atau Ahrefs. Anda juga dapat menggunakan tanda kurung untuk mencari frasa yang terkait dengan kata kunci utama Anda di mesin pencari seperti Google. Anda juga dapat menggunakan sinonim, antonim, atau variasi kata yang berbeda untuk menemukan kata kunci turunan yang relevan. Contoh: Jika kata kunci utama Anda adalah "resep masakan", maka beberapa contoh kata...