Tunggu Sebentar...

11/28/2016

Cara Memasang Widget Label Keren di Blog

Baca Juga



Cara Memasang Widget Label Keren di Blog ~ Halo sobat AA Sciences jelas nya terutama kalian para sobat Blogger kembali lagi ya dengan saya Aldi Andreansyah alhamdulilah saya di kesempatan kali ini masih diberikan nikmat terutama nikmat kesehatan oleh Allah SWT. sehingga saya dapat nih membagikan lagi artikel tutorial mengenai dunia Blogger nih yakni yang berjudul Cara Memasang Widget Label Keren di Blog .

Pada dunia Blogger pasti nya kita tidak luput dari menambahkan cantik tampilan atau membuat dengan cantik , yang bertujuan agar para pengunjung lebih tertarik dan juga lebih nyaman pada blog kita sendiri dengan ada nya widget label tersebut , sebelumnya widget label ini pun menurut saya sangat cocok bila di pasang nya tepat sesudah pada kolom posting dari artikel blog kita sendiri yang biasa nya pada tag data:post.body atau <div class='post-footer'/> atau tag sejenis nya yang tepat nya di bawah kolom artikel tersebut .

Widget Label ini sebelum nya terdapat pada bawaan template yang saya gunakan ini yaitu Simplify2 Premium , dan terletak pada bagian atas judul postingan kolom artikel melainkan bukan di bawah postingan artikel , tapi kalian tenang saja sudah saya atur ko mengenai perubahan nya baik di atas artikel maupun di bawah artikel hehe .

Seperti biasa nya sebelum kita ke langkah pemasangan widget label keren ini ada baik nya kita mengetahui terlebih dahulu baik kelebihan maupun kekurangan nya , cekidot :

Kelebihan dalam pemasangan widget label ini yang saya ketahui yaitu :
1 . Bukan berisi hanya teks melainkan widget label ini terdapat box kecil yang di dalam nya memiliki label otomatis dari artikel yang kalian postingkan tersebut
2 . Box nya bertampil responsive baik versi mobile maupun seluler 
3 . Dalam box ini saya sudah tambahkan sedikit fitur font awesome yang dimana membuat para pengunjung semakin tertarik dengan adanya sebuah font awesome tersebut
4 . Terdapat warna dalam box tersebut dan bisa kalian sesuai kan dengan tampilan keinginan kalian , #saran memakai warna nya sesuai tampilan blog kalian ya hehe.
Oke mungkin hanya cukup sekian dari kelebihan bila terpasang widget label keren ini yang saya ketahui .

Langsung saja kembali kita membahas mengenai kekurangan nya , yaitu :
1 . Terdapat CSS widget label yang terpasang yang memungkinkan menghambat laju fast loading blog kita 
2 . Terdapat HTML widget label keren ini bila di pasang memungkinkan pula menghambat laju fast loading dalam blog kita
3 . Penting , tapi kalian jangan heran masalah fast loading nya tidak memakan banyak byte kok , melainkan hanya beberapa kb saja jadi aman aman saja hehe.
Oke mungkin hanya cukup sekian lagi mengenai sedikit kekurangan yang dapat saya sampaikan mengenai pemasangan widget keren ini , semoga bermanfaat.

Oke mungkin hanya cukup sekian dari basa basi saya yaitu kelebihan dan kekurangan mengenai Cara Memasang Widget Label Keren di Blog diatas tadi .

Oke dari pada kelamaan , langsung saja kita ke tujuan langkah langkah Cara Memasang Widget Label Keren di Blog di bawah ini , cekidot :

Langkah Awal ( Penerapan CSS ):
Pastikan kalian sudah Login akun Blogger terlebih dahulu lalu -> Template -> Edit HTML -> CTRL+F lalu search tag ( b:skin atau <style> ) -> Salin CSS di bawah ini pada dalam mode tag diatas yang sudah di cari tersebut ( b:skin atau <style> ) :  
 /* CSS Tags Label edited by aldiandreansyah.blogspot.co.id*/

.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:#222;float:left;display:inline-block;position:relative;font-size:11px;font-weight:700;margin-right:4px;color:#fff;text-decoration:none;text-transform:uppercase;line-height:15px;padding:0 6px;border-radius:3px;border:1px solid #111}
.label-tags{background:#fff;color:#222}
.label-info a:hover{background:#30cc91;color:#fff;border-color:inherit;text-decoration:none}
.bottomshare{display:block;padding:0 20px;margin:auto;text-align:center}
Langkah Kedua ( Penerapan HTML )
:
Masih pada bagian Template lagi lalu langsung saja kalian CTRL+F lalu search tag data:post.body atau <div class='post-footer'/> atau tepat nya tag pada bagian sesudah artikel kalian , pasang HTML di bawah ini tepat tag yang sudah di cari di atas : 
 <b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='label-wrap'>
  <span class='label-tags'><i CLASS='fa fa-hashtag' aria-hidden='true'/><i class='fa fa-tags'/> Kategori :</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/> <i class='fa fa-tags'/></a><b:if cond='data:label.isLast != &quot;true&quot;'/>
  </div></b:loop></b:if></div></b:if>
3 . Langkah Terakhir
Langsung saja tanpa basa basi langsung klik simpan/save template dan silahkan cek pada blog kalian apakah sudah terpasang atau belum, saya harapkan yah sudah terpasang yaa , Amin
Oke mungkin hanya cukup sekian saja mengenai artikel dunia Blogger yang berjudul Cara Memasang Widget Label Keren di Blog jelas nya yang terletak di bawah postingan artikel yang dapat saya sampaikan , semoga bermanfaat dan semoga sukses selalu , Aminnnnn
Percakapan Obrolan Berakhir

Artikel Terkait

Seorang Pelajar yang Ingin Berbagi Ilmu Pengalaman yang diketahui nya kepada seluruh Umat Manusia, dan Semoga Ilmu yang ia bagikan tersebut bermanfaat. Amin

================================================================
~ Jika ingin men Copy Paste harap masuk kan sumber link artikel saya di postingan sobat
~Dilarang Berkomentar link aktif , jika ada yang memasuk kan link aktif maka kami akan Hapus dan kami anggap Spam
~ Komentar lah dengan Bahasa yang Baik dan Relevan dengan sesuai artikel terkait tersebut . Terimakasih
================================================================
EmoticonEmoticon