Membuat Widget Social Media 3 in 1 Melayang di Blog

Membuat Widget Social Media 3 in 1 Melayang di BlogTULISKAN.com - Jika mungkin anda sudah pernah menyimak postingan-postingan sebelumnya mengenai social media, tentu anda sudah tahu bukan seberapa besar peran social media dalam menyukseskan sebuah blog, khususnya dalam hal trafik, namun saya akan menjelaskanya lagi secara singkat. Pada hakikatnya, semua orang butuh berinteraksi, namun karena tuntutan perkembangan zaman, mungkin kini berinteraksi tidak lagi sama seperti dahulu kala yang mengandalkan peralatan manual, karena sudah hadir berbagai layanan yang merubah dunia komunikasi secara keseluruhan, seperti internet dan jaringan telfon.

Namun, dari dua hal diatas, ada satu sarana berinteraksi yang secara tidak langsung dapat kita jadikan sebagai media promosi atau marketing blog, yakni Social Media, karena di era yang semakin efisien ini, orang kebanyakan menyukai layanan-layanan yang berbau masal dan sedang "trend" di khalayak luas, untuk memaksimalkan social media, kita dapat membantu memperkenalkan akun kita kepada para pengunjung, agar mereka makin mudah untuk mereferensikan ataupun membagikan konten-konten blog kita kepada rekan-rekan atau kerabat mereka, jadi jangkauan pengunjungnya juga akan lebih luas.

Membuat Widget Social Media 3 in 1 Melayang di Blog

1. Login ke Blogger.

2. Masuk Dashboard.

3. Pilih "Add gadget".

4. Pilih "HTML/JavaScript".

5. Lalu sobat letakkan kode di bawah ini ke dalam box "konten".

<style type="text/css">
.barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoYS1-mJcCWZCY4-0lEBL5zoFGt8WywJ_fGWytP_MnY5Cv9ayrPygjIhPO1QAZp5ysToHZvx7Ms8P8tTgeiogWUo6C8sNiwmY0Ea-CSJPsEkAmvvS4bCtXnG7KRfBoZYwDlIiEtvAg65jX/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:50px; z-index:1000;}
.barrightbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHIUGsZhgYizMXx0Fw1yaXexGDA23qv0QaeiwhD4HKnrsdPpNceEjXZze4qO9-_OmCvZ-hwnkeUuNTHM9WHeXbc7Az-3as5fgMo8aO2ibM6bCADqeSWYvywkmRwSWadasJFH63IHMXMgx_/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:50px; z-index:1100;}
.barconteblogger{margin:5px 0 0 47px}
.barrighttwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioiyIJcIlGuaIa_FAThdeNgXyHwvv6uhdnNnl0Q6AOk7bkgq9G7AXQNs9QqAklegXvCvY_T47hX41tAyGmgsPq1K-Eh7gE0GUhVK8wxYxiD884Wq5A0WD_vmaf4PvNXFAKL3mdhUxNY0qt/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:210px;z-index:1000;}
.barrighttwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEI2aUeEvdz9nGLeOqBLql27qDCnxHKNCpIH923boZ0KTrGoVkOkroYIaQMVWZdhLUI5-04qh7nioYyj-Lw25Ob6F03-2nRXRkh4-Z9DmkQIS7Fcc0y5u6zrqYfS_BlrCK3aVv4ahCU35n/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:120px; z-index:1100;}
.barcontetwitter{margin:5px 0 0 47px}
.barrightfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6dblnzlFqhqYq2_3wX_OQWtd2-EmuWsZWwUKgUJEHdeK5JpsDQVOmrz6VQeGIHZlxU6Xl7lchfTBoLMcQlwkwYNjn80Bo7VHKjK7Fu4-mZLl0M9uDdp1aWu7i0TKquwsegf4K246ZVAIZ/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:370px; z-index:1000;}
.barrightfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4XO1KdECktY69he81m51R8KoHfz57-y3F9ZVlY-S6eE-VxZzlj7oMTT3aW3h6F6LpwhvieoInL2GwNiSot4QZ1Jk2Usk8NeFZ9cTLheOvon0mQF9H4ajxibT1RXHMD4MtYVscVZX2XqWr/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:185px; z-index:1100;}
.barcontefacebook{margin:5px 0 0 47px}
</style>
<div class="barrightblogger" onmouseover="this.className='barrightbloggerc'" onmouseout="this.className='barrightblogger'">
<div class="barconteblogger">
Script Blogger Here
</div>
</div>
<div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'">
<div class="barcontetwitter">
Script Twitter Here
</div>
</div>
<div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">
<div class="barcontefacebook">
Script Facebook Here
</div>
</div>

Keterangan:
  • Kode yang berwarna ungu adalah lebar dan tinggi dari widget blogger
  • Kode yang berwarna pink adalah lebar dan tinggi dari widget twitter
  • Kode yang berwarna hijau adalah lebar dan tinggi dari widget facebook
  • Ganti kode yang berwarna oranye dengan script widget follower blog
  • Ganti kode yang berwarna biru muda dengan script widget twitter
  • Ganti kode yang berwarna biru tua dengan script widget facebook

6. Klik "Save/Simpan", dan selesai.

Semoga bermanfaat dan selamat mencoba, Demikian informasi terbaru seputar tutorial dan tips trik blogging tentang Membuat Widget Social Media 3 in 1 Melayang di Blog

Postingan terkait:

— —