Mungkin kalian sudah pernah melihat kotak kecil berisi keterangan dan pesan penulis disertai judul posting dan tanggal terbit yang biasa ditampilkan di bawah posting, namun di sini Saya hanya ingin mengatakan tampilan yang sedikit berbeda menyerupai ini:
Di sini Saya telah menerapkan beberapa arahan perwakilan yang umum terdapat di dalam sebuah widget posting menyerupai arahan perwakilan judul, perwakilan tautan judul, perwakilan tanggal terbit dan nama penulis, sehingga kau tidak perlu lagi menuliskan nama dan URL secara manual, alasannya ialah kode-kode tersebut nantinya akan mengikuti keadaan berdasarkan data-data yang telah tersimpan berdasarkan jenisnya. Yang perlu kau lakukan hanya mengganti gambar dan ulasannya saja.
Pertama-tama, masuklah ke halaman editor HTML templatmu kemudian cek Expand Template Widget biar seluruh elemen pembangun posting tampil.
Temukan arahan ini:
<div class='post-footer'>
TIP: Tekan CTRL + F kemudian ketik class='post-footer' untuk mempermudah pencarian.
Salin arahan ini, kemudian letakkan sempurna di atas arahan tadi:
<!-- Kotak Admin --> <b:if cond='data:blog.pageType == "item"'> <div class='admin-tulisan'> <h4>Penulis: <a expr:href='data:blog.homepageUrl'><data:post.author/></a> Lokasi: Sumpiuh, Banyumas</h4> <div class='kontainer'> <img src='http://1.bp.blogspot.com/_yGa4b5VGx6w/Skrkk_0ByLI/AAAAAAAAAC8/gJy0GYR_M08/S220/toilet.jpeg'/>Artikel <a expr:href='data:post.url'><data:post.title/></a>, diterbitkan oleh <data:post.author/> pada hari <data:post.dateHeader/>. Semoga artikel ini sanggup menambah wawasan Anda. <data:post.author/> ialah seorang penulis mahadahsyat yang masih suka pipis di celana dan maunya nenen sama mama. Suka minta jajan yang aneh-aneh dan suka kentut di depan mikrofon. <div style='clear:both;'/> </div> </div> </b:if> <!-- Akhir Kotak Admin -->Sekarang gulung formulirnya ke atas, dan segera temukan arahan ]]></b:skin> atau </style>. Letakkan arahan ini sempurna di atasnya:
.admin-tulisan { display:block; width:98%; background:#CFE2E0; border:2px solid #fff; -webkit-box-shadow:0 1px 3px #000; -moz-box-shadow:0 1px 3px #000; box-shadow:0 1px 3px #000; padding:0; margin:30px auto 10px auto; font:normal 11px/normal Arial,Sans-Serif; color:#222; } .admin-tulisan .kontainer {padding:5px} .admin-tulisan h4 { background:#8A9C04; border:none; border-bottom:1px solid #699019; color:#fff; text-transform:uppercase; text-shadow:0 1px 0 rgba(0,0,0,.4); font:bold 11px/normal Arial,Sans-Serif; padding:5px 10px; margin:0 0 0 0; display:block; } .admin-tulisan h4 a {color:#FEEA83} .admin-tulisan img { width:70px; height:70px; margin:0 10px 0 0; float:left; border:1px solid #954B02; padding:4px; background:#C36702; -webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none; }Ganti arahan yang Saya beri tanda dengan URL foto profilmu. Untuk mendapat URL foto profil caranya mudah. Cukup klik kanan pada foto profil di dasbormu, kemudian pilih copy image location:
Untuk selebihnya Saya yakin kau sanggup menyesuaikannya sendiri. Klik Simpan Template.
Sumber https://www.dte.web.id/