Home » Blogger Widget » Buat Widget Social Share Counter di Blogger

Buat Widget Social Share Counter di Blogger

Kali ini Blog Gado Gado akan menampilkan artikel berjudul Buat Widget Social Share Counter di Blogger. Dengan artikel Buat Widget Social Share Counter di Blogger ini kami berharap dapat menjadi sebuah rujukan dan bahan penambah wawasan kita terkait dengan judul tersebut. Artikel ini adalah hasil pencarian di google dengan kata kunci Buat Widget Social Share Counter di Blogger kemudian saya kumpulkan dan saya sajikan buat anda di Blog Gado Gado ini. Semoga kehadiran artikel ini bermanfaat bagi kita semua.anda juga dapat melihat artikel sebelumnya atau artikel berikutnya. Ok, langsung saja berikut adalah artikel Buat Widget Social Share Counter di Blogger selengkapnya:

D-Copy Blog | Tombol share sosial benar-benar sangat menarik untuk menciptakan tetapi terutama jika Anda menambahkan tombol berbagi sosial yang menarik maka cara terbaik untuk mendapatkan pelanggan yang lebih banyak. Dalam topik ini telah menciptakan sebuah gambar dengan beberapa efek avatar dengan menggunakan Photoshop dan juga menambahkan beberapa efek css untuk widget ini.

Social Share Counter

Langkah :
  1. Buka Akun Blogger Anda
  2. Masuk ke Menu Edit HTML, jangan lupa centang Expand Template Widget
  3. Cari kode dibawah ini :
]]></b:skin>
     4.  Pastekan kode dibawah ini, diatas pada kode diatas :
*------DCopy Social Share-------*
#DC-social-layout{
    min-width:200px;
    border:5px solid #E2E2E2;
}
#DC-social-layout h3 {
    font-family:Georgia, "Times New Roman", Times, serif !important;
    background: none repeat scroll 0 0 #DBDBDB;
    border: 1px solid #CCCCCC;
    color: #666666;
    font-weight: normal;
    line-height: 1.8em !important;
    margin: 0 auto;
    text-align:center;
}
a.subscribeSidebarBox {
    border: medium none;
    cursor: pointer;
    display: block;
    height: 55px;
    position: relative;
    min-width: 200px;
}
#sidebarSubscribe .sds_snc_icon {
    background-image: url(http://3.bp.blogspot.com/-4rlLPMFze5I/UBYM4WuhmrI/AAAAAAAACT0/Aasm68clEu4/s1600/social_icon_column_user.png);
    background-repeat:no-repeat scroll 0 0 transparent;
    height: 50px;
    width: 50px;
}
#sidebarSubscribe span {
    color: #6E6E6E;
    display: block;
    padding: 1px;
    position: absolute;
    text-shadow: 1px 1px 0 white;
}
#sidebarSubscribe .title {
    font-family:Helvetica, sans-serif;
    font-size: 10px; font-weight:bold;
    left: 65px;
    top: 8px;
}
#sidebarSubscribe .sds_snc_count {
    font-size: 20px;
    font-weight: bold;
    left: 65px;
    top: 23px;
}
#subscriberRSS .sds_snc_icon { background-position: -300px 0px; }
#sidebarFaceBook .sds_snc_icon { background-position: 0px 0px; }
#followTwitter .sds_snc_icon { background-position: -250px 0; }
#flickerPhoto .sds_snc_icon { background-position: -50px 0; }
#youtubeSubscribers .sds_snc_icon { background-position: -100px 0; }
#vimoVideos .sds_snc_icon { background-position: -150px 0; }
#subscribeEmail .sds_snc_icon { background-position: -200px 0; }
#githubSubscribe .sds_snc_icon { background-position: -600px 0; }
.dc_snc_compact {
    font-family:Georgia, "Times New Roman", Times, serif !important;
    min-width:200px;
    border:1px solid #CCCCCC;
    text-align:center;
}
.dc_snc_compact h3 {
    background: none repeat scroll 0 0 #DBDBDB;
    border: 1px solid #CCCCCC;
    color: #444444; font-weight: normal; line-height: 1.8em !important;
    margin: 0; padding: 0 0 0 7px;
    text-align:center;
}
.dc_snc_compact ul.sds_snc_compact_ul {
    list-style: none outside none !important;
    margin:0; padding:0;
    min-width:inherit;
    text-align:center;
    line-height:15px !important;
}
.dc_snc_compact ul.sds_snc_compact_ul li {
    float:left;
    list-style: none outside none !important;
    margin:0 0 5px 0px !important;
    padding:0 0 5px 3px !important;
    text-align: center;
    font-size:10px;
    width:90px !important;
    border:0px solid #CCC;
    height:80px !important;
}

.dc_snc_compact ul.sds_snc_compact_ul li a.compact_a:hover
{
    background: none repeat scroll 0 0 !important;  text-decoration:none !important;
}
.dc_snc_compact ul.sds_snc_compact_ul li .sds_snc_icon {
    display:block;
    background-image: url(http://3.bp.blogspot.com/-4rlLPMFze5I/UBYM4WuhmrI/AAAAAAAACT0/Aasm68clEu4/s1600/social_icon_column_user.png);
    background-repeat:no-repeat scroll 0 0 transparent;
    height: 50px;
    width: 48px;
    cursor:pointer;
    margin-left:20px;
}
.dc_snc_compact a.compact_a .sds_snc_count {
    font-family:Arial, Helvetica, sans-serif; color:#666666;
    display:block;
}
.dc_snc_compact a.compact_a .sds_snc_count:hover
{
    color:#FF0000; cursor:pointer; font-size:11px;
}
*------End DCopy Social Share-------*
    5.  Save Template Anda
    6.  Masuk ke Menu Layout > Add Gadget > HTML/Javascript
    7. Pastekan kode dibawah ini :

<div id="DC-social-layout"><div class="sidebarContainer" id="sidebarSubscribe"><a href="http://www.facebook.com/pages/ID Facebook Anda" target="_blank" class="subscribeSidebarBox" id="sidebarFaceBook">
                        <span class="sds_snc_icon"></span>
                        <span class="title">Fans On Facebook</span>
                        <span class="sds_snc_count">49</span>
                    </a><a href="http://twitter.com/ID Twitter Anda" target="_blank" class="subscribeSidebarBox" id="followTwitter">
                        <span class="sds_snc_icon"></span>
                        <span class="title">Twitter Followers</span>
                        <span class="sds_snc_count">28</span>
                    </a><a href="http://feeds.feedburner.com/ID Feedburner Anda" target="_blank" class="subscribeSidebarBox" id="subscriberRSS">
                        <span class="sds_snc_icon"></span>
                        <span class="title">Rss Subscribers</span>
                        <span class="sds_snc_count">90</span>
                    </a><a href="http://www.youtube.com/ID Youtube Anda" target="_blank" class="subscribeSidebarBox" id="youtubeSubscribers">
                        <span class="sds_snc_icon"></span>
                        <span class="title">Youtube  Subscribers</span>
                        <span class="sds_snc_count">2</span>
                    </a><a target="_blank" href="http://feedburner.google.com/fb/a/mailverify?uri=ID Feed Burner Anda&amp;loc=en_US" class="subscribeSidebarBox" id="subscribeEmail">
                        <span class="sds_snc_icon"></span>
                        <span class="title">Subscribe For Updates</span>
                        <span class="sds_snc_count">Email</span>
                    </a> <div class="clear"></div>
                </div>
            </div>
     8.  Ganti ID Anda pada kode-kode yang diwarnai biru diatas.
     9.  Save Template Anda.


Nah, sobat Blog Gado Gado.. Anda telah membaca seluruh artikel berjudul Buat Widget Social Share Counter di Blogger dengan keword yang masuk Blogger Widget . Anda dapat memberikan komentar ditempat yang telah tersedia. Terima kasih kunjungan Anda.

0 komentar:

Poskan Komentar