Cara Memasang Tag Label Di Bawah Postingan Blogger - Jejakdzgn

Cara Memasang Tag Label Di Bawah Postingan Blogger

Jejakdzgn.my.id - Pada kesempatan kali ini, saya akan share tutorial cara memasang tag label di bawah postingan blog.

cara-memasang-tag-label-dibawah-postingan-blog.

Tetapi sebelum saya share tutorial nya, saya ingin menjelaskan terlebih dahulu manfaat dan pengertian dari Tag Label tersebut.

Pengertian Tag Label

Menurut saya pribadi, tag label merupakan sebutan dari kata hastag, yang dimana akan memberikan sebuah kata kunci pada label tersebut.

Hanya saja beda nya tag label ini tidak memberikan judul ataupun tulisan artikel, melainkan hanya memberikan sebuah nama label dari artikel tersebut.

Manfaat dari Tag Label

Untuk manfaat nya banyak sekali, salah satu nya adalah dapat meningkatkan pengunjung blog.

Bukan hanya untuk meningkatkan pengunjung saja, tetapi manfaat dari tag label juga bisa untuk membuat artikel kita muncul dihalaman pertama.

Maka dari itu manfaat dari tag label ini juga sangat berpengaruh terhadap blog anda. Nah, jika anda tertarik untuk membuatnya, anda bisa mengikuti langkah-langkah dibawah ini.

Cara Memasang Tag Label Di Bawah Postingan Blog

Langkah 1 : masuk ke akun blogger.

Langkah 2 : masuk ke menu TEMA >> Edit HTML.

Langkah 3 : silahkan copy kode dibawah ini, lalu pastekan kode tersebut tepat DIATAS kode </head>

<style type='text/css'>
/*Post Label*/
.post-labels{float:left;display:block;width:100%;color:#999}
.post-labels a{float:left;height:24px;line-height:24px;position:relative;font-size:12px;margin-left:12px;padding:0 10px;background:rgba(0,0,0,0.25);color:#fff;text-decoration:none;border-bottom-right-radius:3px;border-top-right-radius:3px}
.post-labels a:before{content:"";float:left;position:absolute;top:0;left:-12px;width:0;height:0;border-color:transparent rgba(0,0,0,0.25) transparent transparent;border-style:solid;border-width:12px 12px 12px 0}
.post-labels a:after{content:"";position:absolute;top:10px;left:-1px;float:left;width:4px;height:4px;border-radius:2px;background:#fff;transition:all .3s}
.post-labels a:nth-child(1){background:#ca85ca}
.post-labels a:nth-child(1):before{border-color:transparent #ca85ca transparent transparent}
.post-labels a:nth-child(2){background:#e54e7e}
.post-labels a:nth-child(2):before{border-color:transparent #e54e7e transparent transparent}
.post-labels a:nth-child(3){background:#61c436}
.post-labels a:nth-child(3):before{border-color:transparent #61c436 transparent transparent}
.post-labels a:nth-child(4){background:#f4b23f}
.post-labels a:nth-child(4):before{border-color:transparent #f4b23f transparent transparent}
.post-labels a:nth-child(5){background:#46c49c}
.post-labels a:nth-child(5):before{border-color:transparent #46c49c transparent transparent}
.post-labels a:nth-child(6){background:#607ec7}
.post-labels a:nth-child(6):before{border-color:transparent #607ec7 transparent transparent}
.post-labels a:nth-child(7){background:#ca85ca}
.post-labels a:nth-child(7):before{border-color:transparent #ca85ca transparent transparent}
.post-labels a:nth-child(8){background:#e54e7e}
.post-labels a:nth-child(8):before{border-color:transparent #e54e7e transparent transparent}
.post-labels a:nth-child(9){background:#61c436}
.post-labels a:nth-child(9):before{border-color:transparent #61c436 transparent transparent}
.post-labels a:nth-child(10){background:#f4b23f}
.post-labels a:nth-child(10):before{border-color:transparent #f4b23f transparent transparent}
</style>

Langkah 4 : kemudian copy kode dibawah ini, lalu pastekan kode tersebut tepat DIBAWAH kode <data:post.body/>.

<b:if cond='data:blog.pageType == &quot;item&quot;'> <span class='post-labels'> <div id='maia-signature'/> <b:if cond='data:post.labels'> <span style='float: left;'>Tags: </span><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url + &quot;?max-results=6&quot;' expr:title='data:label.name' rel='tag nofollow'><data:label.name/></a> </b:loop> </b:if> </span> </b:if>

PENTING : Biasa nya kode <data:post.body/> lebih dari 1, maka anda masukan kode tersebut pada bagian kode <data:post.body/> yang ke 3.

Langkah 5 : Simpan.

Akhir Kata :

Itulah tutorial cara memasang tag label di bawah postingan blog, jika anda masih bingung, silahkan komentar dibawah ini.
Show Comments
Hide Comments

Belum ada Komentar untuk "Cara Memasang Tag Label Di Bawah Postingan Blogger"

Posting Komentar

Catatan Untuk Para Jejaker
  • Mohon Tinggalkan jejak sesuai dengan judul artikel.
  • Tidak diperbolehkan untuk mempromosikan barang atau berjualan.
  • Dilarang mencantumkan link aktif di komentar.
  • Komentar dengan link aktif akan otomatis dihapus
  • *Berkomentarlah dengan baik, Kepribadian Anda tercemin saat berkomentar.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel