Tutorial Membuat Widget Sosial Media Dengan Efek Memutar Di Blog

Tutorial Membuat Widget Sosial Media Dengan Efek Memutar Di Blog | Ghiyats Blogs -Halo Salam untuk Sobat semua...  Pada artikel ini akan saya bagikan untuk sobat semua, Sebuah widget Sosial media Dengan Efek Memutar di blog.

Widget Ini Memiliki keunggulan yang tidak akan keren, dengan widget sosial media yang pernah saya bagikan, Keuggulannya ketika panah layar di arahkan ke salah satu sosial media, sosial media itu akan memutar 360 derajat dan kembali lagi ke bentuk semula, Kalau Sobat Tertarik pada Widget sosial media ini Tutorial seperti ini :

• Pertam Login ke blogger.com, dan masuk dengan akun anda
• Setelah itu, pergi ke menu ''Tata Letak'' >> Tambah Gadget 
• Terus cari Gadget yang bertuliskan ''HTML/JavaScript'' setelah ketemu klik dan masukan kode dibawah ini ke dalam gadget tersebut.

 style>

    #social img {
    -moz-transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    -ms-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
    }
    #social img:hover {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
    }
    .comments .comments-content .icon.blog-author{position:absolute;top:-1px;right:-12px;margin:0;background-image: url(http://cdn2.iconfinder.com/data/icons/crystalproject/16x16/apps/keditbookmarks.png);width:36px;height:36px}
    .CSS_LIGHTBOX_BG_MASK
    {
    background-color:#990000 !important;opacity: 0.8 !important;
    }
    .post img {max-width:95% !important;}

    </style>

    <br />
    <center>
    <div id="social">
    <a href="http://feeds.feedburner.com/feedburnerurl" target="_blank" title="Grab Our Rss Feed"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvw5Vc-RtxNO9gxhlKZNqXqIUAFX5eDiZdiHD9naqk5PtkkVkRh64GJwmrMHl7pAWlb0OeH5WeWMEwt_zd0-BiMd_7UJA-_fxR7KSjvG-DXHfROSwKXo0N_OYpPczge11lQWYkgcpee-uF/s1600/RSS-48x48.png" style="margin-right: 1px;" /></a><a href="Url Sosial Media anda" rel="nofollow" target="_blank" title="Get Free Updates Via Email"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfdxKrb_3Ch6sQ7pKKgHAahh5xnDYw_u0h8QNXNiKQgCJGu-ftZg06vfIL5c55GWT0p0fHBuukbh6lJCnqGQYxRZ__NoOwlBv_NnYCMQa5u4EeqfFg-xyF6gWnjZTFg5Cz28uSruK5w6o0/s1600/RSS-EMAIL-48x48.png" style="margin-right: 1px;" /></a><a href="Url Sosial Media anda" rel="nofollow" target="_blank" title="Like Our Facebook Page"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy1WyYLIvKhTyttzMkfUi5Ajyb3mCkdbbrgs7G_AEUtX-WqD9Lh6n4ho9V5C_q76KeayyXD3v3eHszinCR9V_CXvdVp10QRT4F5d4g6mW0uthBJITLGi1o4WHYpjHdt485RJmgnqoZtO7K/s1600/FACEBOOK-48x48.png" style="margin-right: 1px;" /></a><a href="Url Sosial Media anda" rel="nofollow" target="_blank" title="Follow Our Updates On Twitter"><img alt="Icon" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjdtBdVFE7S39XWVDavw7JYcJOtrFs__ZAVHs3kHdXWHEYLV1JRL0oXlUCYM10wGK4-AOlZOXLvrjyoh2PIp4fPLnvku-IVApAyPNSNvN5YFGhehsflzTuszxZFdup5IzL0qatBmF1GBrE/s1600/TWITTER-48x48.png" style="margin-right: 1px;" /></a><a href="Url Sosial Media anda" rel="nofollow" target="_blank" title="Follow Us On Google+"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjz3hlVM6T1tkF8G9UQzTPIXIDDiwhzyr8HElJlBOIWyGYrX2970JfZnlkma-V7a1tdxd-1Fl13ccC1IclrMCI8bd9XNTwR9FDk4l7nmEkW96OGcSzsccB4gBqTcmJUByDvh9WWQ27DJBP/s1600/GOOGLE-PLUS-48x48.png" style="margin-right: 1px;" /></a><a href="Url Sosial Media anda" rel="nofollow" target="_blank" title="Follow Our Pins"><img alt="Follow Me on Pinterest" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXBhIsaXVHOxlHb4EjCRZjVPGHfW8fG2AaSyPYPFCdiazhDmW85enw25jX-5JP1e88SrZShPfPXEAX06ex7AHQ3acI2xJxrrdGAL_5CM6malDgBywL_QYspdDKLcfvfO0p5cSb2_fIOZyK/s1600/PINTEREST-48x48.png" style="margin-right: 1px;" /></a></div>
    </center>

• Ganti Url Sosial Media anda dengan url sosial media sesuai kode
• Setelah Di ganti, Baru sekarang klik Simpan
• Dan Widget anda sudah, Tampil

Demikianlah artikel yang baru saya bagikan semoga bermanfaat dan mudah untuk dipratekkan, Silakan berii pendapat tentang artikel ini di kolom komentar di bawah ini, Terima Kasih..

Via : All-bloggertricks