Pada kesempatan kali ini saya akan memposting tentang Cara Membuat Widget Social Media yang Berwarna dan Keren di Blog. Kurang lengkap rasanya jika kita tidak menambahkan daftar sosial media kita di blog kita sendiri. Widget ini terlihat simpel tapi keren karena banyak variasi warna dan tentunya terdapat Font Awesome. Widget ini diletakkan di sidebar blog (seperti blog ini) dengan isi sosial media Fans Page Facebook, Facebook, Twitter, Instagram, Youtube, dan untuk mengikuti blog kita.
Langsung saja ke caranya.
- Masuk ke Blogger.
- Masuk ke Template.
- Lalu pilih Edit HTML.
- Jika tidak ada code ini, silahkan copy kode di bawah ini dan paste di bawah kode <head>
- Simpan lalu lanjut ke tutorial selanjutnya.
<script src="https://use.fontawesome.com/0b1db492d2.js"></script>
- Pergi ke Blogger.
- Pilih menu Tata Letak.
- Tambah Widget lalu pilih HMTL/JavaScript.
- Masukkan kode dibawah ini.
- Langkah selanjutnya adalah
<div style="background:#3B5998;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="https://www.facebook.com/PasuruanCommunityBlog/" target="_blank" title="Like us on Facebook"><span style="color:#fff"><i class="fa fa-facebook-official" aria-hidden="true"></i> Like me on Facebook</span></a></div>
<div style="background:#483D8B;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="http://www.facebook.com/WildanJuwieWiarta" target="_blank" title="Like us on Facebook"><span style="color:#fff"><i class="fa fa-facebook-official" aria-hidden="true"></i> Follow me on Facebook</span></a></div>
<div style="background:#1da1f2;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="http://www.twitter.com/wildanwiarta" target="_blank" title="Like us on Facebook"><span style="color:#fff"><i class="fa fa-twitter-square" aria-hidden="true"></i> Follow me on Twitter</span></a></div>
<div style="background:#895a4d;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="http://www.instagram.com/wildanjw" target="_blank" title="Like us on Facebook"><span style="color:#fff"><i class="fa fa-instagram" aria-hidden="true"></i> Follow me on Instagram</span></a></div>
<div style="background:#FF8C00;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="https://www.youtube.com/channel/UCyUcsrDpezMKN__g-v6hg9Q" target="_blank" title="Like us on Facebook"><span style="color:#fff"><i class="fa fa-youtube" aria-hidden="true"></i> Find me on Youtube</span></a></div>
<div style="background:#f3ac13;color:#fff;font-weight:bold;font-size:100%;text-align:center;padding:10px 0;">
<a href="http://www.blogger.com/follow-blog.g?blogID=8985882049425470152" target="_blank" title="Like us on Facebook"><span style="color:#fff"><i class="fa fa-user-plus" aria-hidden="true"></i> Follow this blog</span></a></div> - Ganti https://www.facebook.com/PasuruanCommunityBlog/ dengan alamat Fans Page Facebook kalian.
- Ganti http://www.facebook.com/WildanJuwieWiarta dengan alamat Facebook kalian.
- Ganti http://www.twitter.com/wildanwiarta dengan alamat Twitter kalian.
- Ganti http://www.instagram.com/wildanjw dengan alamat Instagram kalian.
- Ganti https://www.youtube.com/channel/UCyUcsrDpezMKN__g-v6hg9Q dengan alamat Youtube kalian.
- Ganti 8985882049425470152 dengan ID Blog kalian.
Simpan template.
Itulah cara menambahkan widget sosial media berwarna dan keren di blog. Terima kasih sudah berkunjung ke blog ini.
EmoticonEmoticon