Cara Menerapkan Social Icon Responsive dan Keren di Blogger

Masarif.xyz. Assalamualaikum.. Teman - teman kembali lagi mengunjungi artikel saya yang kini membahas cara memasang social icon di blogger, sebelumnya saya membagikan cara menghilangkan plusone js yang mampu meringankan blog

Baca Juga : Free Share Backlink Paling Jos High DA (Domain Authority)


Jika kamu belum baca bisa kamu klik disini, oke teman - teman langsung saja ya kita langsung saja menerapkannya untuk melengkapi widget blog atau situs sobat, agar terlihat pro.

Baca Juga : Backlink Gratis Jos Dengan Spek DA 93

untuk sobat semuanya silahkan ambil kode CSSnya dulu dibawah ini.



/* SOCIAL ICON */
ul.nav-social {
list-style: none;
margin: 0;
padding: 0;
}
ul.nav-social li {
display: inline-block;
padding: 0px 15px;
margin: 0;
}
ul.nav-social li a {
color: #999999;
}
ul.nav-social li a:hover {
color:#555;
}
ul.nav-social li a.fcb:hover {
color:#3B5A9B;
}
ul.nav-social li a.gpl:hover {
color:#DD4B39;
}
ul.nav-social li a.twt:hover {
color:#1BB2E9;
}
ul.nav-social li a.ytb:hover {
color:#ED3F41;
}
ul.nav-social li a.lkdn:hover {
color:#007fb2;
}
ul.nav-social li a.igicon:hover {
color:#527fa4;
}
Perlu diingat pemasangan code css ini harus disalin di atas </style>. Ok sobat jika sudah ambil codeo cssnya , dan sudah menerapkannya ke template kesayangan sobat, selanjutnya sobat ambil code html social iconnya dibawah ini.
Baca Juga : Inilah Destinasi Wisata Travel Halal Untuk Semua Umat


<!-- social media button start -->
<ul class='nav-social'>
  <li><a class='fcb' href='https://www.facebook.com/nama' rel='nofollow'><i class='fa fa-facebook-square fa-2x'/></i></a>
  </li>
  <li><a class='igicon' href='https://www.instagram.com/nama' rel='nofollow'><i class='fa fa-instagram fa-2x'/></i></a>
  </li>
  <li><a class='gpl' href='https://plus.google.com/101145413077488990994' rel='nofollow'><i class='fa fa-google-plus-square fa-2x'/></i></a>
  </li>
  <li><a class='twt' href='https://twitter.com/nama' rel='nofollow'><i class='fa fa-twitter-square fa-2x'/></i></a>
  </li>
          <li><a class='ytb' href='https://www.youtube.com/channel/url' rel='nofollow'><i class='fa fa-youtube fa-2x'/></i></a>
  </li>
</ul>
<!-- social media button end -->
Untuk catatan SILAHKAN SOBAT GANTI YANG BERWARNA MERAH DENGAN LINK SOCIAL MEDIA SOBAT.

Akhir Kata

OK sobat silahkan mencoba, dan terserah sobat mau di pasang dimana, mau di FOOTER , DI HEADER. Pokoknya terserah sobat nyamannya di pasang dimana.
Mungkin dari saya sekian dulu ya, nantikan post selanjutnya dari saya.
Buka Komentar

0 Response to "Cara Menerapkan Social Icon Responsive dan Keren di Blogger"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel