Cara Menciptakan Style Tag Di Post Body

Cara Membuat Style TAG Di Post Body

Di semua template tentu nya sudah mempunyai yang nama nya tag di dalam body artikel. Meskipun tidak semua template mempunyai nya. Tag yang berada pada body artikel merupakan suatu hal yang sebenar nya dapat di bilang wajib tapi tidak ada pun juga tidak masalah. Tapi dengan ada nya tag ini secara dapat menciptakan pengunjung lebih efisien untuk mencari suatu artikel dengan mengurutkan sebuah kategori.

Bentuk style pada setiap tag di dalam body artikel pun sangat bermacam - macam pada template yang mungkin kalian pernah melihat nya. Dan pada artikel kali ini aku akan mengembangkan Cara Membuat Style TAG Di Post Body dengan tampilan yang cukup sederhana.

Bila sahabat ingin mencoba menambahkan atau mengganti model style TAG yang berada pada template sobat, sahabat dapat ikuti langkah - langkah di bawah ini.

Cara Membuat Style TAG Di Post Body

Silahkan sahabat copy instruksi CSS di bawah ini kemudian letak kan instruksi tersebut di atas instruksi </style>

 .label-wrap{display:block;color:#666;padding:10px 15px;border-bottom:1px solid rgba(0,0,0,0.05);overflow:hidden} .label-info{position:relative;margin:auto} .label-info a,.label-tags{background:#111;float:left;display:inline-block;position:relative;font-size:10px;margin-left:8px;color:#fff;text-decoration:none;text-transform:uppercase;height:18px;line-height:18px;padding:0 6px;border-radius:3px} .label-tags{background:#e9f1f2;color:#6c6c6c} .label-info a:hover{background:#cf2f1e;color:#fff;border-color:inherit;text-decoration:none}

Setelah itu sahabat copy instruksi di bawah ini kemudian letakan instruksi tersebut di dalam body html template sobat. Sobat dapat meletakan nya di bawah judul artikel maupun di simpulan / bawah artikel.

 <b:if cond='data:blog.pageType != &quot;index&quot;'>           <div class='label-wrap'> <span class='label-tags'><i CLASS='fa fa-hashtag' aria-hidden='true'/> Tags</span> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <div class='label-info'> <a class='label-block' expr:href='data:label.url + &quot;?max-results=7&quot;' rel='tag'> <data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'/> </div> </b:loop> </b:if> </div> </b:if>

Bila sahabat belum tau cara penempatan nya di dalam body artikel, sahabat dapat lihat teladan di bawah ini. Sobat cari instruksi menyerupai di bawah ini. Biasa nya setiap template niscaya ada instruksi tersebut. Kode untuk meletakan iklan adsense di bawah judul artikel. Nanti instruksi tag yang di atas kita letakan di atas instruksi iklan adsense. Lihat teladan di bawah ini.

 Letakan instruksi tag nya disini <b:if cond='data:blog.pageType == &quot;item&quot;'> &lt;div style=&quot;display:table;text-align:center;padding:0;margin:0 auto&quot;&gt; <!-- Kode Banner/Iklan Anda Di sini --> &lt;/div&gt; </b:if>

Bila sahabat ingin letakan instruksi tag nya di simpulan artikel, cara nya juga sama menyerupai cara di atas, cuman sahabat cari instruksi iklan nya yang berada pada simpulan atau bawah postingan. Dan letakan instruksi tag nya di bawah nya instruksi iklan adsense. Seperti teladan di bawah ini.

 <b:if cond='data:blog.pageType == &quot;item&quot;'> &lt;div style=&quot;display:table;text-align:center;padding:0;margin:0 auto&quot;&gt; <!-- Kode Banner/Iklan Anda Di sini --> &lt;/div&gt; </b:if> Letakan instruksi tag nya disini

Setiap template mungkin mempunyai instruksi yang berbeda, jadi sahabat cari yang sekira nya hampir sama menyerupai instruksi di atas. Bila di template sahabat sudah ada Tag di dalam body artikel tapi sahabat ingin mengganti nya, sahabat cukup menghapus instruksi dari bawaan template dengan instruksi tag yang dari aku dan ganti instruksi css tag nya dengan instruksi css tag yang dari saya.

Sobat dapat merubah tampilan warna nya cukup dengan mengedit css tag nya tersebut.

Kalo sahabat kurang yakin dengan penempatan nya, untuk menjaga hal yang tidak kita ingin kan alangkah baik nya sahabat dapat menerapkan di blog sahabat yang lain blog untuk percobaan.

Untuk teladan sahabat dapat lihat pada gambar di bawah ini. Atau pada simpulan artikel ini.

Mungkin itu saja yang dapat aku bagikan pada kesempatan kali ini. Semoga artikel ini dapat bermanfaat buat sahabat yang ingin mencari Cara Membuat Style TAG Di Post Body. Selamat mencoba!