October 30, 2015

Cara Pasang Widget Akun Media Sosial di Sidebar Blog

October 30, 2015

Cara Memasang Widget Akun Media Sosial di Sidebar Blog

MEMASANG widget sosial media di blog/website merupakan salah satu cara untuk meningkatkan follower, pengikut, fans, atau jaringan pertemanan. (Lihat Demo)

Berikut ini salah satu jenis widget media sosial di sidebar blog yang cukup menarik, atraktif, simple, dan tentu saja keren. Berikut ini penampakannya:

Widget Akun Media Sosial di Sidebar Blog

CARA PASANG
Cara memasangnya sebagai berikut:
  1. Layout > Add a Gadget > HTML/Javascript
  2. Isi Judul dengan "Join us" atau Kosongkan
  3. Copas kode berikut ini di kolom "Content"
    <style type="text/css">
    .cb_socialwidget { width: 300px; }
    .cb_socialwidget ul { border: 1px solid #CCCCCC; margin: 0; padding: 0; }
    .cb_socialwidget ul li { list-style:none; padding: 0; text-transform: none; border-bottom: 1px solid #CCCCCC; border-top: 1px solid #FFFFFF; }
    .cb_socialwidget ul li:first-child { border-top: 0 none; }
    .cb_socialwidget ul li:last-child { border-bottom: 0 none; }
    .cb_socialwidget ul li a { background-color: #F2F2F2 !important; color: #404040; display:block; }
    .cb_socialwidget ul li a:hover { background-color: #949494 !important;color: #0d0354; }
    .cb_socialwidget ul li .rss { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFJih2hSnKfwUDWXZ_cK3rAx9d94scTuAgfuR7dikre2q3EPfbLdhCdDmeC4ezDVA3rIiD3m8UlQC2yaOEhXq9u_MzvwQFCjQyEpN7aA7_ezZc8DIi1n3KUsZDm-A-Xg9DDYmpyJFBINA/s1600/bt-RSS.png") no-repeat scroll 10px center #F87E12; padding: 17.5px 60px; }
    .cb_socialwidget ul li .twitter { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwRDF_-aEMYsV_fKWxoTfnjoUA2qw1HY3oDydAbfJDjtszdZwHV4hUOto8WEzzqVcZwLvxiy2hQpiZ3kt74AS1wUWmcTIfrSEmU_rnRA5_ztkVm6y2EsQjOnWW9PRRDSx-Tu8KAj_eNXw/s1600/bt-Twitter.png") no-repeat scroll 10px center #4CACEE; padding: 17.5px 60px;}
    .cb_socialwidget ul li .facebook { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLD9w-AmKeBI1drjterQLkaPiOeGI5yE7dnsWaw_yvRPjmxgKUEBHnepS1moGNjHh6truGA56AbnWFZLFUf3dvMOTGyfRp9x5n2l9cGKL01op4pwOoc82ud0KAZHzJAVSea_fwHzLJ51c/s1600/bt-Facebook.png") no-repeat scroll 10px center #3B5998; padding: 17.5px 60px; }
    .cb_socialwidget ul li .google { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpMh9Rd3T_9U3dKFTC25wGqoTDV_K5NHdiB9Qfz0iV7gIMy2K__aA-nU2AVjazxC9dp0QPdMF8Ttz0CL5pKG__zzMuhCToKXLq_XXoD7YfQzGb0ZbV9eC115eu7Cm2H7EFcw3frzS6IC4/s1600/bt-google.png") no-repeat scroll 10px center #D44937; padding: 17.5px 60px; }
    .cb_socialwidget ul li .linkedin { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLBIeZZ2IKQjC8xF-MNEA275_nAeexSNZPHO0dwtvU-RxLBM7U54OvwsTelfmBTbmCRmFSseaXBjpda-glHrLV6a0RdiKKPxV3HU6BzqPi0u1JCWJZONMTA6u8SvNju_u8578Z1TLOz2w/s1600/bt-LinkedIn.png") no-repeat scroll 10px center #3692C3; padding: 17.5px 60px; }
    .cb_socialwidget ul li .youtube { background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMAx0b_pxLG16rQgdjzIBFazZ5zjVqsAUdbpK_PXV9R74p7fph6XjxvtyaUcxsc4xIIrxp5tgunF-Di03c7VFsx5Mx_zNO-2Gfa4OgbSGUIBaMX4Ba1b5qdnGDMRBQpKDQSR0py0spQCU/s1600/bt-Youtube.png") no-repeat scroll 10px center #C6312B; padding: 17.5px 60px; }
    .social-about { display: none; }
    </style>
    <div class="cb_socialwidget">
    <ul>
    <li><a class="rss" href="https://feedburner.google.com/fb/a/mailverify?uri=contohblog&amp;loc=en_US" target="popupwindow">Subscribe to CB Blogger</a></li>
    <li><a class="twitter" href="http://twitter.com/contohblog/">Follow us on Twitter</a></li>
    <li><a class="facebook" href="http://facebook.com/cbblogger/">Find us on Facebook</a></li>
    <li><a class="google" href="https://plus.google.com/106869251529186655236/" rel="author">Join us on Google+</a></li>
    <li><a class="linkedin" href="https://www.linkedin.com/in/cbblogger/">Connect on LinkedIn</a></li>
    <li><a class="youtube" href="https://www.youtube.com/c/CBBlogger/">Watch us on YouTube</a></li>
    </ul>
    </div>

    Ganti ID Medsos warna merah dengan kepunyaan Anda.

    Demikian Cara Pasang Widget Akun Media Sosial di Sidebar Blog. Lihat: Gaya & Jenis Widget Media Sosial Lainnya. Good luck and Happy Blogging! (http://www.contohblog.com).*

    Previous
    « Prev Post
    Author Image

    CB Blogger

    Recommended Posts

    Related Posts

    Show comments
    Hide comments

    No comments on Cara Pasang Widget Akun Media Sosial di Sidebar Blog

    Post a Comment

    Contact Form

    Name

    Email *

    Message *