 |
| Cara Menambahkan Widget Social Media Pada Sidebar Blog |
おはよう、皆！☺
今日は０４月０５日ですね。じゃ、今日はまたテゥートリアルのブログのことがあげますよ。😊
AFP - Holla sobat bloggers! Bagaimana kabar kalian? Semoga sehat-sehat saja ya. Sebenarnya, mulai minggu ini hingga minggu depan, mimin sedang UTS. Kita sama-sama sedang berjuang ya anak-anak SMA yang sedang UN. 😭 Sudah-sudah jangan baper, hari ini seperti biasa mimin akan berbagi informasi mengenai Tutorial Blogging, dan pada kali ini kita akan belajar Cara Menambahkan Widget Social Media Pada Sidebar Blog.
Widget ini berfungsi untuk menghubungkan pembaca langsung dengan beberapa akun milik kalian pada situs lainnya. Pada widget ini, hanya empat yang disediakan dan siap terhubung, yaitu, Facebook, Twitter, Google+, dan RSS Feed. Namun sebelum menggunakan widget ini, pertam-tama pastikan terlebih dahulu bahwa kalian memiliki tiga akun di atas ya. hahaha. Tampilan widget ini nantinya seperti yang dapat kalian lihat pada gambar di atas.
Berikut langkah-langkah yang harus kalian lakukan :
1. Buka Dashboard blog milik kalian.
2. Pilih Tata Letak.
 |
| Cara Menambahkan Widget Social Media Pada Sidebar Blog |
3. Pilih + Tambahkan Gadget, pilih HTML/Javascript, klik tanda +.
 |
| Cara Menambahkan Widget Social Media Pada Sidebar Blog |
4. Copy kode script dibawah ini.
<style>
.fixedmenu {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsCmogkFs3F3YLazVqSUbLesS7vS3Yd6SD9B_i8MDuVOj0L-C77G98ndjJUA7_Q0KKGBY63Ewj2pqrJ6VD0Uh5f8mjuyzp8TRStxTYuvxcuNC3voc31NnEgQePjJpZ5KiEi104UBdOSkk/s1600/facebook.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:160px;
z-index:1000;
}
.fixedmenu1 {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2JeRkMyRYYIzpOMcvBX0AlZ5SaJg3QdZADDxDBO4Gd3RQlBlGqJohh-baLMMCOLQfhADBz0Kwhu2-6cHExl_j9kztTJMZzvOYV79_raASfLsneMyHMyxRQD0LlyvAUbxGnBHUFs2NXSg/s1600/facebook-hover.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:160px;
z-index:1100;
}
.fixedmenu_1 {
margin:0px 0 0 43px
}
.fixedmenutw {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipZCBZQ1Gyyn2mNGVjGHUVbLESrupISO7SsBkl9ufQLxvn1tG6o9GztCA5qXPmhhIvvJIYpaBJgJq8olp5oBxHRCUsM2omY8WOqR2RLjv5Po6Bwwe6y0yMd1yXzAl2mI3jnihh9bGM_yA/s1600/twitter.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:205px;
z-index:1000;
}
.fixedmenutw1 {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVVutCRPwNHSfZvDlqxSgEZTyOp3SlkOH58L8UcLJh2eM0VmiLHaqu6OkyOdqbqVxPhyNCxcPsPdwL5DuMLCaOEKHwWSUQ1WgMe6z8qShqLr_Eoe3yaZH1BIR2eJmNtOaxG-siJfi_6kw/s1600/twitter_hover.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:205px;
z-index:1100;
}
.fixedmenutw_1 {
margin:0px 0 0 43px
}
.fixedmenufb {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEtIjl-KsazHdrokt7mjGMK6LHHU-VD3l06DG5AchXahOG7jdboLNzG_TCiinn50E-UZ7l5jn_uDtQl5XRWbT7rgRoGZTFAFc_fMcFsH16kXFiJqR9uaDVBUa5wQnrGLa7dd3oG5urEAI/s1600/Gplus.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:250px;
z-index:1000;
}
.fixedmenufb1 {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnhJMKgy3FMIcCrYOuNYN86qFmbg4c6plu17PDB2dIOaZXmjgWmt32B_QhdNs3jzuGoYTV8TLSn9omVMsJbgtcwYfpHNhCT03msX_89cyW76H1iHS379orxKo-5sN3U9L5DGP3MaXMl98/s1600/Gplus_hover.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:250px;
z-index:1100;
}
.fixedmenufb_1 {
margin:0px 0 0 43px
}
.fixedmenurss {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghTPDmcL7ScEjWjvzByrSx3IV123jEZpp10n7rkrvj6KQVXHT9mYS9-Lkm732qGAH_4iQlHNA3DLnAdclVHJEzPajaPD4uWCg4VIc8GXVjwPLxvtLwZBgtH84gfTFU2k3MMPW-b3rZ2YU/s1600/rss.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:295px;
z-index:1000;
}
.fixedmenurss1 {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtg59N3l5hLgyLIKXhBRLQKnPl8al5YU1uVwxLFeSXqJUi2mP-i3LRAo6R9EhQARoPyFn1sqQ_aD-nh8nw4vZBIFI6V9ytWQzkN-1-1vgMVol3cEsBG7IprgsZxdCv-lQqYyHGSes8xV0/s1600/RSS-hover.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:295px;
z-index:1100;
}
.fixedmenurss_1 {
margin:0px 0 0 43px
}
</style>
<div class='fixedmenu' onmouseout='this.className='fixedmenu'' onmouseover='this.className='fixedmenu1''>
<div class='fixedmenu_1'>
<a href='https://www.facebook.com/AFPluviophile7/?ref=settings' target='_blank'>
<img alt='Like us on Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjn4YjcqD3D5F-FXlB4LcP7D1gEvqh4LmuMgo6fm5dNZ0xt1GcsEPJ9SiKl8KCkX1c_bZLb6f-vmSDVrMH__0syYaPbdKu_ecUnrBF3GQqV-8IWGp9d4IDc_2Kz_Thv7tcA9wc8MWQGVco/s1600/facebook-hover1.png' title='Like us on Facebook' />
</a>
<br/>
</div>
</div>
<div class='fixedmenutw' onmouseout='this.className='fixedmenutw'' onmouseover='this.className='fixedmenutw1''>
<div class='fixedmenutw_1'>
<a href='https://twitter.com/aditfajarp?lang=en' target='_blank'>
<img alt='Follow us on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpFHsfLD45CdNwNjI1CwdULxAtAe5Hgu0Fy4mQYhK0CpUP9qUXjmhNbIxcQ0W19LTkF6Z0iAvgbyGK9DOsfjig-s-fLQGGpRdq8Y6tWggNEO3mKnlahvlEvrXuTdmZp30jaXTHKXabhFA/s1600/twitter_hover1.png' title='Follow us on Twitter' />
</a>
<br/>
</div>
</div>
<div class='fixedmenufb' onmouseout='this.className='fixedmenufb'' onmouseover='this.className='fixedmenufb1''>
<div class='fixedmenufb_1'>
<a href='https://plus.google.com/+AditiyaFajarPamungkasAFP' target='_blank'>
<img alt='Recommend us on Google Plus' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaNRYIxjBMGqYMx3pCPufo1uQQgpu-jqo5JLPNOx1DKtVZ12yHNF0c2hVZqpwEJgqEpsZPlj6i7D-eeFYBTe7_DT7h18rmGEpuQtX2P1avDzqgIw3tnkID8R_hKd_KMUMcnyUsCLXau_w/s1600/Gplus_hover1.png' title='Recommend us on Google Plus' />
</a>
<br/>
</div>
</div>
<div class='fixedmenurss' onmouseout='this.className='fixedmenurss'' onmouseover='this.className='fixedmenurss1''>
<div class='fixedmenurss_1'>
<a href='http://feeds.feedburner.com/' target=' _blank '><img alt='Subscribe me on RSS ' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7u4-YQGGVsuQf3iaTT8NvV5BDhpFs9QcDELdUNTYcVXSeHq0U3QRXadyTttZvHTtHmzMCwM3OQGMaP68E_bnE-gTzGbQuVAQ3wsQPK26-FyR_SK26Od6BAPr0QFZl-6eLozFZMaUKWNA/s1600/RSS-hover1.png ' title='Subscribe me '/></a><br/>
</div></div>
5. Paste pada kolom konten. Kemudian pilih Simpan.
 |
| Cara Menambahkan Widget Social Media Pada Sidebar Blog |
6. Dan Selesai.
Catatan :
Tulisan yang berwarna biru, adalah alamat masing-masing akun.
Rubah https://www.facebook.com/AFPluviophile7/?ref=settings menjadi alamat Facebook kalian.
Rubah https://twitter.com/aditfajarp?lang=en menjadi alamat Twitter kalian.
Rubah https://plus.google.com/+AditiyaFajarPamungkasAFP menjadi alamat Google+ kalian.
Rubah http://feeds.feedburner.com/ menjadi alamat Feed Burner kalian (jika mempunyai).
Kalian dapat memindahkan letak HTML/Javascript pada pengaturan dashboard kalian, tetapi posisi widget ini tidak akan berubah pada tampilan blog kalian. Posisi widget akan tetap berada di sidebar kanan pada blog milik kalian.
Nah, sekian postingan kali ini. Setelah ini kalian dapat mencobanya pada blog milik kalian. Feel Free untuk bertanya lebih lanjut di kolom komentar atau Contact. Semoga bermanfaat. Kita bertemu kembali pada postingan selanjutnya yaa. Salam hangat dari mimin. じゃ、またね！😉
Sumber :
Pribadi
