Cara Menciptakan Gambar Post Di Atas Judul (First Image)

| Sempat galau dengan Cara Membuat Gambar (Thumbnail) berada di atas judul artikel pada body postingan, Gambar (First Image) ini bersama-sama berkonsep keluar dari body sebuah postingan tersebut jadi perlu isyarat yang akan di tambahkan.

Di kesempatan kali ini aku akan membagikan bagaimana sih menciptakan Gambar atau Thumbnail Pertama pada postingan kita dapat berada di atas judul ya kira-kira akan menjadi ibarat Arlina design atau bung frangki kurang lebih.

Keuntungan dari Penggunaan Cara ini yaitu anda dapat meletakkan Iklan adsense sempurna sebelum kata pertama pada sebuah artikel atau dapat disebut diatas postingan. Sehingga slot iklan kalian dapat bertambah tanpa harus merubah template yang sudah kalian kuasai. Ok pribadi saja lihat tutorialnya di bawah ini.

Gambar Keluar dari Body Postingan :

1. Masuk Ke Menu Template >> Edit HTML
2. Masukkan Kode CSS dibawah ini untuk pengaturan tampilan nya. dan letakkan diatas ]]></b:skin> atau </style>

css .firstimage{   background:#fff;   padding-bottom:10px;   background-repeat:no-repeat;   background-position:center;   background-size:cover } 

3. Cari isyarat <b:if cond='data:post.link'> (Permudah dengan memakai CTRL+F)
4. Letakkan Kode di bawah ini sempurna di atas perintah No. 2 , Kemungkinan akan ada banyak jadi coba saja satu persatu.

HTML <b:if cond='data:blog.pageType == "item"'><div class='coverImage'> <b:if cond='data:post.firstImageUrl'><img class='firstimage' expr:alt='data:post.title' expr:src='data:post.firstImageUrl'/><b:else/><img class='firstimage' expr:alt='data:post.title' src='URL_GAMBAR_NOIMAGE'/></b:if></div> </b:if> 

5. Setelah selesai, Masukkan isyarat Javacript ini di atas isyarat </body>

JS <script type="text/javascript"> //<![CDATA[ $(function() {    $(".separator:first").remove();       $(".post-body > img:first").remove();                       }); //]]> </script> 

6. Simpan Template Kalian

Itulah sedikit tutorial kali ini dari , untuk live demo nya silahkan lihat pada postingan ini sudah diterapkan di blog mamang sendiri. Bila kurang mengerti dapat tanyakan lewat halaman kontak atau hubungi fb admin.

Demikan informasi dari artikel Cara Membuat Gambar Post di Atas Judul (First Image), biar bermanfaat untuk anda dan kalau menyukai artikel ini silahkan like, share, and subscribe untuk berlangganan artikel terbaru pribadi dari email anda.
Sumber https://www.mangotep.com/