Trik Membuat Blog Lebih Keren : Cara Memodifikasi Widget Profil Blogger - Feel in Bali

Tuesday, July 2, 2013

Trik Membuat Blog Lebih Keren : Cara Memodifikasi Widget Profil Blogger

Dalam kesempatan kali ini saya akan berbagi informasi dengan kawan-kawan semua tentang cara memodifikasi tampilan profil blogger di blog kawan-kawan. bagi para blogger, disamping memperhatikan jumlah visitor, juga tetap untuk memperhatikan kualitas tampilan blog kawan-kawan ,,,





cara membuat modifikasi widget profil blogger di blog
1. Setelah login ke akun anda.
2. Pada dasbor >> masuk menu tata letak >> klik tambah gadget >> HTML/JavaScript
3. Pada kolom title beri nama sesuai keinginan, selanjutnya copy dan tempelkan kode HTML berikut pada kolom kontent

<style>
#profileEndra{
border:2px solid #888; margin:2px 5px 0px 0px; padding:2px;
}
#profileEndra:hover {
border:2px solid #ccc;
cursor:pointer;
}
.opacity  {
opacity: 0.5;
margin-left: 50px;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
-ms-transform: rotate(7deg);
transform: rotate(7deg);
filter: progid:DXImageTransform.Microsoft.Matrix(
                    M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');
zoom: 1;
}
.opacity:hover  {
opacity: 1;
margin-left: 0px;
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
filter: progid:DXImageTransform.Microsoft.Matrix(
                    M11=1, M12=0, M21=0, M22=1, sizingMethod='auto expand');
zoom: 1;
-moz-box-shadow: 1px 1px 4px #000;
-webkit-box-shadow: 1px 1px 4px #000;
box-shadow: 1px 1px 4px #000;
}
</style>
   <!--[endif]---->

<img align="left" class="opacity" id="#profileEndra" src="URL YOUR IMAGE PROFIL" />About YOU<a href="YOUR LINK BLOGGER PROFIL" style="color: #888888;">...Read More</a><!--![endif]---->

<div class="clear">
</div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="http://www.blogger.com/blogID=5143343840607190550&amp;widgetType=Profile&amp;widgetId=Profile1&amp;action=editWidget&amp;sectionId=lowerbar1" onclick="return _WidgetManager._PopupConfig(document.getElementById(&quot;HTML1&quot;));" target="configHTML1" title="Edit">
</a>
</span>
</span>
<br />
<div class="clear">
</div>


Ganti profilEndra dengan nama profil anda,
perhatikan tulisan tebal berwarna diatas, ganti dan sesuaikan dengan keinginan anda
ganti blog ID dengan ID blog anda
silahkan jika ingin menambahkan CSS untuk modifikasi sesuai keinginan.

4. Simpan dan klik simpan lagi. Lihat hasilnya diblog anda

VISIT TO BALI