Cara Memasang Social Media di Sidebar blog

Kali ini WTE akan berbagi tips bagaimana  Cara Memasang Social Media di Sidebar blog, Ingin memasang beberapa social media pada sidebar blog? Okey, semoga saja sobat tertarik dengan tutorial ini. Untuk memasang social media Bahan dasarnya adalah sebuah kode HTML dan Gambar, disarankan agar menggunakan gambar berformat .png atau .gif agar supaya loading blog tidak terlalu berat. Jika sobat belum mempunyai gambar social media, seperti logo facebook, twitter, rss dan google+, dibawah ini telah tersedia satu berkas dan tinggal sobat download saja.

Kemudian jika file download-an tadi sudah berada dalam komputer sobat, ekstraklah file tadi. Dan setelah itu tinggal melakukan proses penyimpanan pada website. Link download sudah tersedia dan klik disini untuk memulai mendownloadnya.

Sementara untuk kode HTML-nya, anda hanya cukup copy paste saja kode HTML tersebut. Adapun kode HTML-nya seperti yang tampak dibawah ini:

<center>
<div class="social" style="padding: 5pt 5pt 9pt 20px;">
<table><tbody>
<tr><td></td><td><a href="Alamat URL yang dituju" target="_blank"><img alt="Nama alamat (misal:Facebook)" border="0" src="alamat URL gambar" title="Nama gambar (misal: Facebook)" /> &nbsp; &nbsp; </a></td>
</tr>
</tbody></table>
</div>
</center>

Saya lanjutkan, setelah kedua bahan tersebut terkumpul, langkah selanjutnya adalah melakukan beberapa tahapansimak aja sob:

Tahap pertama: Di dalam dasbor blog, buka Entri baru atau tulisan baru. Setelah terbuka pilihlah mode penulisan pada mode HTML, setelah itu masukkan (ctrl+V) kode HTML diatas.

Tahap ke dua: Masih dalam mode penulisan entri baru, sekarang masukan gambar. Upload gambar di blogger, caranya masih dalam mode entri baru kemudian sobat pilih logo gambar yang terletak di kanan atas layar penulisan. Klik unggah gambar dari komputer , pilih beberapa gambar social media yang hendak sobat pasang dan masukkan atau sisipkan pada tulisan kode HTML tadi. Setelah selesai, kembali sobat rubah mode penulisannya menjadi mode HTML. Maka akan tampak seperti ini:

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-TgLXc0f-kuU/UJir8FUZSiI/AAAAAAAAAq0/swI3AlYs/s1600/you_tube.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/-TgLXc0f-kuU/UJir8FUZSiI/AAAAAAAAAq0/swI3AlYs/s1600/you_tube.png" /></a></div>

URL yang aku beri warna adalah URL yang menunjukkan gambar yang nantinya harus sobat masukkan pada kode HTML pembuat social media, pilih salah satu. Caranya bagai mana? Copy paste tiap masing-masing Url gambar tersebut, dan masukkan pada kode HTML, dan akan menjadi seperti ini

<center>
<div class="social" style="padding: 5pt 5pt 9pt 20px;">
<table><tbody>
<tr><td></td><td><a href="http://www.youtube.com/" target="_blank"><img alt="youtube" border="0" src="http://3.bp.blogspot.com/-TgLXc0f-kuU/UJir8FUZSiI/AAAAAAAAAq0/swI3AlYs/s1600/you_tube.png" title="Youtube" /> &nbsp; &nbsp; </a></td>
</tr>
</tbody></table>
</div>
</center>

Selanjutnya perhatikan kode yang berwarna biru, itu adalah alamat url yang dituju ketika seseorang mengklik gambar, sesuaikanlah dengan masing-masing gambar. Untuk facebook masukkan alamat url facebook, untuk twitter masukkan alamat Url twitter sobat dan seterusnya. Setelah proses memasukkan alamat url masing-masing social media selesai, selanjutnya copy paste dari keseluruhan kode HTML tersebut dan kita masuk pada tahap berikutnya.

Tahap ke tiga: masih dalam dasbor blog, sekarang buka tata letak, pilih menambahkan widget, kemudian pilih HTML/JavaScript, dan masukkan editan kode HTML yang sobat ambil dari entri baru, berilah judul pada widget dan klik simpan.

Setelah itu atur tata letaknya, dibagian sidebar manakah sobat akan menempatkannya, klik simpan perubahan , kemudian lihat hasilnya.