Friday, April 25, 2014

Membuat Artikel Terkait di Bawah Postingan Blog Yg Keren


Membuat Artikel Terkait di Bawah Postingan Blog Yg Keren
Karena Artikel Terkait ini di lengkapin dengan sedikit gambar, scroll, dan warna yang keren, bagi sobat yang ingin mengunakan dan membuatnya bisa mengikuti tutorialnya di bawah ini

  • Login ke blogger
  • Pilih menu''Template''
  • Klik ''Edit HTML''
  • Cari kode </head> dan taruhlah kode dibawah ini di atas kode </head>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related_posts h4{background:#BDBDBD; color:#FFF; font:bold 11px Arial,Tahoma,Verdana; margin:0; padding:5px 7px 4px 10px; text-shadow:1px 1px #000; text-transform:uppercase}
#relpost_img_sum{height:308px; overflow:auto; margin:0; padding:5px; line-height:16px}
#relpost_img_sum:hover{background:none}
#relpost_img_sum ul{list-style-type:none; background:none; margin:0; padding:0}
#relpost_img_sum li{border-top:1px solid #fff; outline:1px solid #DDD5CD; background:#FAFAFA; overflow:hidden; margin:0; padding:5px; height:64px; list-style:none}
#relpost_img_sum li:hover{background-color:#F2F2F2}
#relpost_img_sum .news-title a{color:#2C6BA8}
#relpost_img_sum .news-title{font-family:Arial,Serif; font-weight:bold !important; display:block; margin-bottom:4px}
#relpost_img_sum .news-text{display:block; text-align:left; font-weight:normal; text-transform:none; color:#333}
#relpost_img_sum img{float:left; margin-right:14px; padding:4px; background:#fafafa; border:1px solid #ddd; width:55px !important; height:55px !important}
</style>
<script type='text/javascript'>
var relnojudul = 0;
var relmaxtampil = 10;
var numchars = 200;
var morelink = &quot;baca selengkapnya&quot;;
</script>
<script src='http://reader-download.googlecode.com/svn/trunk/atdeskripsi.js' type='text/javascript'/>
</b:if>


  • Setelah itu cari kode div class='post-footer-line post-footer-line-1 dan taruhlah kode dibawah ini di atas kode div class='post-footer-line post-footer-line-1
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related_posts'>
<h4>Artikel Terkait</h4>
<b:loop values='data:post.labels' var='label'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=relpostimgcuplik&amp;max-results=50&quot;' type='text/javascript'/>
</b:loop>
<ul id='relpost_img_sum'>
<script type='text/javascript'>artikelterkait();</script>
</ul>
</div>
</b:if>

NOTE : Kode yang ke dua bisa di taruhkan di atas <data.post:body> , kalau sobat sudah mengunakan readmore sobat maka kode yang kedua di simpan di <data.post:body> yang ke dua
  •  kalau tidak terjadi error, maka sekarang klik simpan template

Merubah Tulisan Poskan Komentar Dengan Gambar


Tampilan Tentu harus diperhatikan oleh kita untuk menarik minat pengunjung, salah satunya di sekitar di kotak komentar, pastinya setiap dalam sekitar kotak komentar terdapat tulisan ''Poskan Komentar'' bagi sobat yang ingin merubah tampilan lebih menarik bisa mengunakan gambar yang khusus untuk ini, ikutilah tutorialnya dibawah ini :

  • Pertama sobat harus masuk ke dasbor blogger
  • Klik Menu ''Template''
  • Pilih ''Edit HTML''
  • Cari kode <h4 id='comment-post-message'><data:postCommentMsg/></h4> (CTRL + F Untuk pencarian ), Setelah ketemu kodenya hapus kode tersebut dan ganti dengan salah satu gambar di bawah ini , Pilih Salah Satu ! 
Comment 1



<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizy6HqbvxO_ulDdqecwuR4Qjh4Kc9vFON9_cOYOMFwFrpBypsN4hY0X2JY1K2UdljL8SkO_RS6iqxvOIAlWInXedCiShdcEysWCrh6h8-POr6RpD8e8zHzAMYEOCFSQozrFTqzxDNf5Z0/s200/3.png" />

Comment 2



<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifeiU3Qghzj96pH5DO5wsVnDBEJytdaCSTUUqyaVgdVYk3Pls_NXiSop__cchtbnFSvmWZsi6MzyQrcU6OBG4lxH0bbPmb78EavIA1BM_ljNzcY4_trbs-A21NxHdFE_0OtqAzEOEiCFE/s200/2.png" />

Comment 3



<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOX9KhEUaQs-7cCPNuLAUcDSJDJnR6HjvuPfFCWx-ckjKCqA4kvHsw8By6RUN6sIsTgMfTO7KP6hZlUu9I1EG0zDLIm-Q-wH3lfoZu4SL9qCvmAlkyPmKO0F3BHrmKksDsSPBZzgsPbmI/s200/4.png" />

Comment 4



<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbyHTuPGyOlDdRIhAjPwOvatJdtqZLR0PSv5shpdDrmVFB2NftNtuQnRD0lm_as2Ga-ddy2AV-XtPvXmMsBoFYo1wVZleCpGSz3YfTLwP857h-rXDMoKv1okkIlzL-SusD6HHAah6m/s320/Tinggalkan_Komentar.png" />

Comment 5




<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXUOFW8bLxmDnRoDizhcxHdITp-I43jLd0E8OWcu6Y67t1jv2D5Zo7YJYpy8SwYSPey4JQ7rVQkVehtCPXK5AcPZIQsFzgQ2oUXY0opjPNkRF-eiAiPy_yfbGmOIqgvidBZwWfCXyGTs4/s1600/5.png" />

Comment 6







<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2irK8a2fUj5VWPSfhMiNOJIufgXi398GSE-5bxMdt_uMyYZYXS2-vEwwhFTeu8NS4TpgO3StHHReZfPY0CTTv5CYZO3huyWRA2HCvTiWai4plXOtRZOJNVc8z-LGx6CdLLnPuLJ9ds4k/s200/please-leave-comment3.jpg" />

  • Sobat bisa menganti gambarnya seterah sobat, ganti tulisan yang berwarna merah dengan url gambar punya sobat
  • Setelah sudah diganti, sekarang Tinggal klik Simpan Template

Widget Subsribe Dengan Sosial Media Biru


Widget

Subsribe box atau kotak berlanganan pastinya sangat di butuhkan untuk seorang blogger untuk kemajuan blognya, sama dengan widget ini di lengkapin dengan sosial media bisa menghemat tempat dan waktu hehehe, Jangan terlalu lama berbicang, pastinya sobat sudah mengertikan ? langsung saja kita coba mengunakan widget ini yang pastinnya mudah diterapin dan sangat elegan seperti dibawah ini :

Widget Subsribe Dengan Sosial Media Biru Untuk Blogger
--------------------------------------------------------------
  • Login ke blogger
  • Masuk kemenu ''Tata Letak''
  • Klik ''Tambah Gadget''
  • Pilih Gadget ''HTML/JavaScript
  • Copy kode dibawah di simpan di kotak yang disediakan
<style>
#sidebar-subscribe-box{width:300px;border:1px solid #aaa;border-radius:3px;padding:3px 0}
.sidebar-subscribe-box-wrapper{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn2FR8ze2ZukWFDbAnyzx_dNgADReUpMiAuGFa_5QxP65ELB_n9gJe6Me02S-QC8Ix73ntjyuPVmPezoa93c6SelazXxLvJcRhNGj0QKAqoFCQPce7bc-X_Uf543mNtQXuBxX0nkkhZks/s1600/background.png) repeat scroll 0 0 #f7f7f7;color:#111;font-size:14px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:uppercase}
.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0}form.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto}
.sidebar-subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5lgSpzBM5CMaoJjsWiIo575B9YYZhXebqlwam6ZiuKcZ6Cl1Fbft1Qioo6Z-Xg7K63KDNDTg3U5bU6AjILO5ozw1WCVuSx8pkZ2Tzvw0aA85UwmT59kXsn3ALtq8bGZ2geRXzvj0xqW4/s1600/icons.png) no-repeat 0 -27px;border:1px solid #ccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 40px;width:68%}
.sidebar-subscribe-box-email-button{background:#09f;border:1px solid #007fff;box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent;color:#fff;cursor:pointer;font-family:verdana;font-weight:700;padding:10px;text-shadow:1px 1px 0 rgba(0,0,0,.4);text-transform:uppercase;width:100%}
.sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#1ca4ff}
.sidebar-subscribe-box-email-button:active{-moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;outline:0}iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);background:#FFF;border:1px solid #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4px 4px 4px}
#footer-section{border-top:1px solid #aaa;box-shadow:inset 0 4px 6px -3px #aaa;font-family:cambria;font-size:14px;height:100px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%}
a.social-icons{margin-right: 5px;height:45px;width:45px;}
a.social-icons:hover { opacity: .7; filter:alpha(opacity=70);}
</style>

<div id="sidebar-subscribe-box">
<div class="sidebar-subscribe-box-wrapper">
<br/>
<a class="social-icons" href="https://facebook.com/USERNAME ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvC1TWJq07IEuO5KdY3SbODwospGlvHpW8NrLSpjeSTjJS8pjjgluZlNSOx2Fz2cCiBBDUbO4zHin9dtMzufIvxug1JTymRO34C8yjW4Yza1YwgOyMZrW-BfQLkDq8XHMD310TvkVITrMM/s1600/Bloggertrix-facebook.png" /></a>
<a class="social-icons" href="https://twitter.com/USERNAME ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKcHBYZDX9oDe-_n0-HcbE4xOlpR01J1MGkotc3p_R6g4XxAk2jSZHsz53Dy6CQ7AUlEdXFEmm84tjUAD87yzD3ClmiZohTbmS2YWp81CR8D9F7u07bmalThgMagWCf2NOcm8uTURSmBXI/s1600/bloggertrix-twitter.png" /></a>
<a class="social-icons" href="https://plus.google.com/ID GOOGLE+ ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOl2PYsdQ9XAbKl_tYRQsHp61merkMbRnuHOGZkNlUQH_OwVmhyphenhyphengZJK71LdwHDcIlKSrbHbwCyyi7zRD5itaNJQz8hU32A9v8NhdIGLh5xhq1DlMNOkrIPqv23qjwQhvBSEBjcFiefxZae/s1600/Bloggertrix-Googleplus.png" /></a>
<a class="social-icons" href="http://www.feedburner.com/USERNAME ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjP221IUwrUrfUNDIK-shTXOjxyDaAMMTln_jMkfqRSNTgARIK_UCNCEE9jGbQSONh4MEJbzE8BCnn2OrRIK1P4jp8LzUwTHvuI8vRrh5MC7N-D10xq17u1dwMIvKRZxXP7wNl3Ogmsb1Fu/s1600/Bloggertrix-Rss.png" /></a>
<p>Subscribe To Our Email Newsletter & Receive Updates Free</p>
<div class="sidebar-subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=USERNAME ANDA', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="USERNAME ANDA" />
<input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Enter your email address here"/>
<input class="sidebar-subscribe-box-email-button" title="" type="submit" value="Subscribe Now !" /></form>
</div></div></div>
  • USERNAME ANDA Ganti dengan UserName Facebook Anda
  • USERNAME ANDA Ganti dengan UserName Twitter Anda
  • ID GOOGLE+ANDA Ganti dengan ID Google+ Anda
  • USERNAME ANDA Ganti dengan ID FeedBurner Anda
  • Setelah di ubah sekarang, Klik Simpan

Widget Sosial Media Icon Dengan Search Box Untuk Blogger


Widget
Widget Sosial Media Icon Dengan Search Box Untuk Blogger
  • Login Ke Blogger
  • Pilih Menu ''Tata letak'' >> Klik ''Tambah Gadget''
  • Klik Gadget ''HTML/JavaScript
  • Taruhlah kode di bwah ini di dalamnya
<style>
#btrixwidget{width:307px;
padding:0 0 5px 0;
border:1px solid black;}

#btrix-searchbox {
border-radius: 5px;
background: URL(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWneljbaE7xRbZALWMNkujlOGmAfnq4P95bsH7L84w7idtnpUt803lkp0PRsEd3u0zdFBxrvg4mdLbK_mu5ba6Ps4RyJaFVwCQGJTTxWZ7lMCoAksXzGVBOLHuawZ7NO__PCzMxu9juMjX/s1600/blue.png) no-repeat scroll center center transparent;
width: 307px;
height: 50px;
disaply: block;
}

form#btrix-searchform {
display: block;
padding: 9px 16px;
margin: 0;
}

form#btrix-searchform #s {
padding-left: 24px !important;
padding: 7.5px;
margin: 0;
width: 198px;
font-size: 16px;
font-family: georgia;
font-style: italic;
color: #666666;
vertical-align: top;
border: none;
background: transparent;
}

form#btrix-searchform
#sbutton {
margin: 0;
padding: 0;
height: 40px;
width: 74px;
vertical-align: top;
border: none;
background: transparent;
}
</style>

<div id="btrixwidget"><center>
<a href="http://twitter.com/USERNAME" target="_blank" wrc_done="true"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhue9s3UwJOUj3RLXPnc_sNhL-AkX_u4Sk8tPwFH5MnIi5TTAHdHA_r4rXKsviQetXBd38By2ijq9mAAJr_24uScsWlZ-dyAVYqA6LI00zqqm6nTjRuIQwqfrzVL9jiFsScbGC-3_48UIs/s1600/btrix-twitter.png" alt="" title="twitter" width="62" height="78" class="alignnone size-full wp-image-6249"></a>

<a href="http://www.facebook.com/USERNAME" target="_blank" wrc_done="true"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYddxI_rI8TjJr6IGoBB3TDjFRclRAohUlguYzDxWtTyu9crSNzxFdU74BHhTPCnOTON0fyaMB25ykWS8Rr-jIjgd3Id9S8OUxjo7P7FBRf5cPOx8mzStVLK6lv8OGyD9T3xJEbsfIjXc/s1600/btrix-facebook.png" alt="" title="facebook" width="62" height="78" class="alignnone size-full wp-image-6248"></a>

<a href="http://feeds.feedburner.com/ID Anda" target="_blank" wrc_done="true"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_j6BzEVdJdeQk3U77BFfwu_RwWYZOXxzLp8xFE1aDKwlU-CFI2jLVXROU8OH_iyD_S7-sxwvknhmWB11V9Ht0_r7qqx68f06FgmH3G6PeyJwySssm0YaqHXNJo4D0m8dBIbV9Rw8DZCY/s1600/btrix-rss.png" alt="" title="rss" width="62" height="78" class="alignnone size-full wp-image-6251"></a>

<a href="http://au.linkedin.com/username" target="_blank" wrc_done="true"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-DmF3-te82eFxehquZ-T3i9m5ZduZa6eAUk-nr9gvJB4hwx7ndlThWjp8dEqfaUMh93KsfokNAcZk4hExXfMCrBmMP_98eNvDzFBzeCH5MYwTulJHEKDEOcz4Roe3o1orbo8_Txa9a18/s1600/btrix-linkedin.png" alt="" title="linkedin" width="62" height="78" class="alignnone size-full wp-image-6250"></a>

<div id="btrix-searchbox">
<form id="btrix-searchform" action="/search" method="get">
<input type="text" id="s" name="q" value="Search..." onfocus='if (this.value == "Search...") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Search...";}' />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>
</center>
</div>
  • USERNAME Ganti dengan username twitter anda
  • USERNAME Ganti dengan usename facebook anda
  • ID Anda Ganti dengan ID FeedBurner anda
  • USERNAME Ganti dengan username linkedin anda
  • Setelah di Edit, Sekarang Klik Simpan 

Dan Demikianlah artikel yang berjudul Widget Sosial Media Icon Dengan Search Box Untuk Blogger semoga artikel ini bermanfaat bagi sobat dan kalau ada yang masih binggung bisa berkomentar di bawah ini

Widget Subsribe Dan Sosial Media Super Keren


widget super keren
  • Login ke Dasbor Blogger
  • Pilih Menu ''Tata Letak''
  • Klik ''Tambah Gadget''
  • Pilih Gadget 'HTML/JavaScript
  • Setelah itu, taruhlah kode di bawah ini dalamnya


<style>
.subscribebtrix {
border: 2px solid #000000;
padding: 8px;
width: 310px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.subscribebtrix:hover {
-moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
}
.tbimailbox {
border: 1px solid #D3D3D3;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 160px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.tbimailbox:hover {
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.btrixsubmit {
font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #ffffff;
background: #ff5714;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #222222;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 8px 15px;
cursor: pointer;
margin: 0 auto;
}
.btrixsubmit:active {
cursor: pointer;
position: relative;
top: 2px;
}
.btrixsubmit::-moz-focus-inner {
border: 0;
padding: 0;
margin: 0;
}
</style>


<br />
<div class="subscribebtrix">
<div style="color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;">
Free Updates to your Inbox</div>
<div style="margin: 10px 0 0 6px;">
<form action="http://feedburner.google.com/fb/a/mailverify" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ID ANDA', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="ID ANDA" />
<input name="loc" type="hidden" value="en_US" />
<input class="tbimailbox" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" type="text" value="Enter your email..." />
<input alt="" class="btrixsubmit" title="" type="submit" value="Subscribe" />
</form>
</div>
<div style="border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;">
Follow us:</div>
<div style="margin: -32px 0 0 120px;">
<a href="http://www.facebook.com/USERNAME" target="_blank" title="Join us on Facebook"><img alt="facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD6LO2ZfMHzdtZy1Yohhy7RkK8grew6aksSLGj3wQOCV2kfiWkyYmqG-N9D26k80dW4faAzLK9qsVyei5EeToRQbEPx7NL1GJHYNPInT80sBOIZH0bBGCfrI_LJOhKtdIAlbj9hBwAC_w/s1600/facebook_btrix.png" /></a>
<a href="http://www.twitter.com/USERNAME" rel="nofollow" target="_blank" title="Follow us on Twitter"><img alt="twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIF53kimh7NIqkw0VWLEsMh0S0cFcoPCloqlPGvoOYtm75FVFViaJnViclxH5uksYLYepwBUqxIINqDThYGzaoMKICd1D5rPoqXc1930R9NtGR9Ba2fyfxHUbT1EvwN49gF9RHCKpfyo4/s1600/twitter_btrix.png" /></a>
<a href="https://plus.google.com/ID ANDA" rel="nofollow" target="_blank" title="Follow us on Google+"><img alt="gplus" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheN0zjiklcfzaoLTZ5IxBgUuP_TkSc474n1t4o6dFN9jAjD7Nt7fV_PVT1xPbj5piihBzCCDLiytOUyMI2JIuPVGcV2xveecHaZrUZ-J_2IeceyQQ-6TVwALC59RlmD_uM34XdCJmSVjA/s1600/googleplus_btrix.png" /></a>
<a href="http://www.pinterest.com/USERNAME" rel="nofollow" target="_blank" title="Follow us on Pinterest"><img alt="pinterest" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9w3MlbjzOmXKyZ9zKIu4PN-KlyVs_5Q-clVU9_6jLYeRjZyxrQ5yCYxwCKON3jm45dl_CO58kJ792T8R42-HdVifi1k7fTys4xblx-K_UoYfHsWVvwyYWFCbzXp6cJktqhgQglTTcYbI/s1600/pinterest_btrix.png" /></a>
<a href="http://feeds2.feedburner.com/ID ANDA" rel="nofollow" target="_blank" title="Subscribe to RSS"><img alt="rss" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu-xIO1VrqGxEutAwj7jUKMUEpB5kKQHteowx97GA4vDsT4ol6hoTalR7Om00QXqPql_19rdYfWL4oIisKCqRoQuwGdhkhzNe9DrJi_l-K-9IuLpFMXymeT1Y0q49c6WxDSgGFe8UZSiY/s1600/rss_btrix.png" /></a>
</div>
<div align="center">
<a href="http://feeds.feedburner.com/ID ANDA"><img alt="" height="26" src="http://feeds.feedburner.com/~fc/ID ANDA?bg=FF9900&amp;fg=444444&amp;anim=1" style="border: 0;" width="88" /></a></div>
</div>
  • USERNAME Ganti dengan Uusername facebook anda
  • USERNAME Ganti dengan Username twitter anda
  • USERNAME Ganti dengan Username Pinterest anda
  • ID ANDA Ganti dengan Id Profile Google Plus Anda
  • ID ANDA Ganti dengan Id Feedburner anda

Membuat Cloud Label Warna Hijau Untuk Blogger


cloud label untuk blogger| Salah satu widget yang bisa dipercantik di blog, yaitu Widget Label Daftar Label / Kategori yang sudah kita publish, kita akan Membuat Cloud Label yang berwarna hijau, tidak begitu sulit menerapinnya dan tidak juga memberatkan blog kita, kita akan coba membuatnya di artikel ini teruslah ikutilah artikel ini sampai selesai, sudah melihat hasilnya mari kita membuatnya seperti dibawah ini :


  • Masuk ke blogger, dengan akun anda
  • Sekarang, pergi ke menu ''Template''
  • Klik ''Edit HTML''
  • Setelah itu cari kode ]]></b:skin (mengunakan CTRL+F), setelah ketemu simpan kode dibawah ini diatas kode tersebut
.label-size{display:inline-block;padding:0px 10px;height:29px;line-height:29px;border-radius:5px; font-weight:bold;font-size:12px;text-decoration:none}
.label-size{border:1px solid #769e42;box-shadow:inset 0 1px 0 #c5e59c;background-color:#9ed35a;text-shadow:0px 1px 1px #6ea23b;color:#fff;background-image:linear-gradient(bottom,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-o-linear-gradient(bottom,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-moz-linear-gradient(bottom,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-webkit-linear-gradient(bottom,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-ms-linear-gradient(bottom,rgb(125,196,64) 0%,rgb(157,210,88) 100%)}
.label-size:hover{background-color:#b7fa66;background-image:linear-gradient(top,#b7fa66 0%,#7ec940 100%);background-image:-o-linear-gradient(top,#b7fa66 0%,#7ec940 100%);background-image:-moz-linear-gradient(top,#b7fa66 0%,#7ec940 100%);background-image:-webkit-linear-gradient(top,#b7fa66 0%,#7ec940 100%);background-image:-ms-linear-gradient(top,#b7fa66 0%,#7ec940 100%)}
.label-size:active{background-image:linear-gradient(top,rgb(125,196,64) 0%,rgb(157,210,88) 100%); background-image:-o-linear-gradient(top,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-moz-linear-gradient(top,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-webkit-linear-gradient(top,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-ms-linear-gradient(top,rgb(125,196,64) 0%,rgb(157,210,88) 100%)}
.label-size{display:inline-block;border-radius:5px 0 0 5px;border-right-width:0;position:relative; z-index:5;margin-right:20px;margin-bottom:10px}
.label-size:after{content:"";width:22px;height:22px;line-height:18px;font-size:25px;border-top:1px solid #769e42;border-right:1px solid #769e42;box-shadow:inset 0 1px 0 #c5e59c;background-color:#9ed35a;text-shadow:0px 1px 1px #7eac46;border-radius:3px 7px 3px 0;color:#fff;background-image:linear-gradient(135deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-o-linear-gradient(135deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-moz-linear-gradient(135deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-webkit-linear-gradient(135deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-ms-linear-gradient(135deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%);position:absolute;top:3px;right:-12px; z-index:-3;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);filter:progid:DXImageTransform.Microsoft.Matrix( M11=0.7071067811865476,M12=-0.7071067811865475,M21=0.7071067811865475,M22=0.7071067811865476,sizingMethod='auto expand');zoom:1}
.label-size:hover:after{background-color:#b7fa66;background-image:linear-gradient(-45deg,#b7fa66 0%,#7ec940 100%);background-image:-o-linear-gradient(-45deg,#b7fa66 0%,#7ec940 100%);background-image:-moz-linear-gradient(-45deg,#b7fa66 0%,#7ec940 100%);background-image:-webkit-linear-gradient(-45deg,#b7fa66 0%,#7ec940 100%);background-image:-ms-linear-gradient(-45deg,#b7fa66 0%,#7ec940 100%)}
.label-size:active:after{background-image:linear-gradient(-45deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-o-linear-gradient(-45deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%);background-image:-moz-linear-gradient(-45deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%); background-image:-webkit-linear-gradient(-45deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%); background-image:-ms-linear-gradient(-45deg,rgb(125,196,64) 0%,rgb(157,210,88) 100%)}
.label-size:before{ content:"";height:5px;width:5px;display:block;position:absolute;right:-3px;top:11px;background-color:#fcfdf5;border:1px solid #83ab52;border-radius:5px;box-shadow:0 1px 0 #b2ddd83}
.label-size span{padding:2px 5px;border:1px solid #9e5c26;border-radius:5px;box-shadow:inset 0 1px 0 #f5bf8c;background-color:#ed943f;text-shadow:0px 1px 1px #000;margin-left:10px;background-image:linear-gradient(bottom,rgb(211,95,32) 0%,rgb(223,131,45) 100%);background-image:-o-linear-gradient(bottom,rgb(211,95,32) 0%,rgb(223,131,45) 100%);background-image:-moz-linear-gradient(bottom,rgb(211,95,32) 0%,rgb(223,131,45) 100%);background-image:-webkit-linear-gradient(bottom,rgb(211,95,32) 0%,rgb(223,131,45) 100%);background-image:-ms-linear-gradient(bottom,rgb(211,95,32) 0%,rgb(223,131,45) 100%)}
#Label1{height:210px !important}
  • Setelah selesai klik ''Simpan Template''
NOTE!! : Kode di atas bisa berkerja kalau label pada widget anda dalam fungsi cloud, kalau belum cara seperti
  • Masuk ke ''Tata Letak''
  • Klik ''Tambah Gadget''
  • Pilih Menu ''LABEL''
  • Setelah itu, pada pengaturan ''Tampilan'' pilih ''Cloud'' bukan ''Daftar''
  • Setelah itu, klik simpan
  • Dan lihat di perubahannya di blog sobat
KATA PENUTUP
Dan demikianlah artikel ini semoga artikel di atas bisa menjadi ilmu bagi sobat dan bermanfaat buat kalian semua, kalau seandainya sobat mau kasih pendapat ataupun ingin bertanya silakan berkomentarlah di kolom komentar di bawah ini

3 Template Terkeren


kalau sobat mau ganti template, pas sekali karena postingan ini saya akan berbagi 3 Template pilihan saya untuk sobat semua, tidak usah berlama lama lagi, langsung saja kita lihat koleksinya dibawah ini :

Dazzling Designer Blogger Template
3 Template Terkeren 2013 Untuk Blogspot
E Style Blogger Template
3 Template Terkeren 2013 Untuk Blogspot
MBL Apollo
3 Template Terkeren 2013 Untuk Blogspot

Membuat Widget Sosial Media Dengan Effect Hover


Membuat Widget Sosial Media Dengan Effect Hover
Widget ini kalau keliatannya biasa saja pertamanya, tapi kalau sobat mengarahkan kursor kepada salah satu sosial media akan berubah dan ada warnanya sesuai sosial medianya.. sobat tertarik dengan widget dan ingin menggunakan widgetnya di blog sobat ?

Membuat Widget Sosial Media Dengan Effect Hover
--------------------------------------------------------

  • Login ke Blogger
  • Pergi ke Menu ''Tata Letak''
  • Selanjutnya klik ''Tambah Gadget''
  • Sekarang, pilih Gadget ''HTML/JavaScript
  • Taruhlah code dibawah ini, di kotak yang tersedia


<style>

a.btrix1_twitter
{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcUXkOcSD1jUVeNeWlIBnBLw9KEkLn6DxZ0Dx22EkpAVWjRN6B6CAKqwOX4ftroIL9PpXpTOEDk0MkkGkcoWNEgugb7cOPAV2I2D_Rws8ANgmpvXKyDc4X0nKwZBSXkJWPc5IHb8vxlhc/s1600/btrix_twitter.jpg);
background-position:0 0px;
width:255px;
height:51px;
text-indent:-9999px;
display:block;
background-repeat: no-repeat;
border:0px;
float:left;}
a.btrix1_facebook
{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYqn-LW2nul64fSyaz-0hd2gxtrreNFR7sBRyRV0uuHdROMJ3O7qdCPlvbqlwhMJRSBxunQXdp_nWKDGVe_lpWjiO-2oy-vsQIjlE5N89g3P2DjfVfd9J6WHTs_caV7t_r3EyxNo1xil8/s1600/btrix_facebook.jpg);
background-position:0 0px;
width:255px;
height:51px;
text-indent:-9999px;
display:block;
background-repeat: no-repeat;
border:0px;
float:left;}
a.btrix1_linkedin
{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi28Q6sE0Do6CUTrqOTcBlO8reBKwtwjNngblbWTqtQ3JDgTs9gD3p2eLdpyWBmdwRC2NNo4lExTXG1hxUiY0lrydKMxz5B9qEDZnEKiVpIHyh69OM5cu690edLvZYIQ1uWHDQtYfzL_fg/s1600/btrix_linkedin.jpg);
background-position:0 0px;
width:255px;
height:51px;
text-indent:-9999px;
display:block;
background-repeat: no-repeat;
border:0px;
float:left;
}
a.btrix1_stumbleupon
{ background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLboxAvFs5dRG6iWRXwTyZ3VoPpN_Gt9TqP5ND1MFoo75nbmM6mQzHEy-vBzmU9Xe0jL-oonxOfBzQ-xlXVSZ8LYSF135ukMdZBEBy-zMKJ9usJF_9mZDAJ_6QzUESnoP7yRuvGXEcg7M/s1600/btrix_stumbleupon.jpg);
background-position:0 0px;
width:255px;
height:50px;
text-indent:-9999px;
display:block;
background-repeat: no-repeat;
border:0px;
float:left;
}
.btrix11social a:hover
{
background-position:0 -51px;
}
.btrix11social
{
width:255px;
}
</style>


<br />
<div class="textwidget">
<div class="btrix11social">
<a class="btrix1_linkedin" href="http://in.linkedin.com/Username" target="_blank">linkedin</a>
<a class="btrix1_stumbleupon" href="http://www.stumbleupon.com/Username" target="_blank">stumbleupon</a>
<a class="btrix1_twitter" href="http://twitter.com/Username" target="_blank">twitter</a>
<a class="btrix1_facebook" href="http://www.facebook.com/Username" target="_blank">facebook</a>
</div>
</div>
  • Ganti Username Dengan username linkedin anda
  • Ganti Username Dengan username stumble anda
  • Ganti Username Dengan username Twitter anda
  • Ganti Username Dengan username Facebook anda
  • Kalau sudah di ganti, sekarang klik simpan

Membuat Cloud Label Warna Hitam


Membuat Cloud Label Warna Hitam Untuk Bloggger
--------------------------------------------------------
 

  • Masuk dan login ke Blogger.com
  • Setelah itu, Klik Menu ''Template''
  • Sekarang Cari kode ]]></b:skin Setelah ketemu, sekarang Taruhlah kode dibawah ini di Sebelum/Diatas kode tersebut 


/*-----Custom Labels widget by www.bloggertrix.com----*/



#Label1 a{float:left;
height:18px;
line-height:18px;
position:relative;
font-size:12px;
margin-bottom: 9px;
margin-left:10px;
padding:5px;
background: rgb(69,72,77); /* Old browsers */
background: -moz-linear-gradient(top, rgba(69,72,77,1) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(69,72,77,1)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
color:#fff;
text-decoration:none;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;}
#Label1 a:hover{fbackground: rgb(73,192,240); /* Old browsers */
background: -moz-linear-gradient(top, rgba(73,192,240,1) 0%, rgba(44,175,227,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(73,192,240,1)), color-stop(100%,rgba(44,175,227,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(73,192,240,1) 0%,rgba(44,175,227,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(73,192,240,1) 0%,rgba(44,175,227,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(73,192,240,1) 0%,rgba(44,175,227,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(73,192,240,1) 0%,rgba(44,175,227,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#49c0f0', endColorstr='#2cafe3',GradientType=0 ); /* IE6-9 */}
.label-size{line-height:1.5;align:left;}
.h2head-text {margin:-40px 10px 8px 55px;color:#666666;font-family:arial;font-size:13px;}


#Label1{width:320px;;border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #D8D8D8;}
  • Setelah Itu, Sekarang Simpan Template sobat
NOTE!! : Kode diatas akan berkerja kalau label pada widget anda dalam fungsi cloud, kalau belum cara seperti ini :
  • Masuk ke ''Tata Letak''
  • Klik ''Tambah Gadget''
  • Pilih Menu ''LABEL''
  • Setelah itu, pada pengaturan ''Tampilan'' pilih ''Cloud'' bukan ''Daftar''
  • Setelah itu, klik simpan
  • Dan lihat perubahannya di  blog sobat

Gimana Mudah, bukan ? Semoga artikel ini bermanfaat bagi sobat semua, kalau sobat ada yang masih bingung tentang artikel silakan berkomentar di kolom komentar di bawah ini ! dan saya siap menjawab pertanya sobat semua...

Widget RSS Subscribe Dan Sosial Media Untuk Blog


Widget RSS Subscribe Dan Sosial Media Untuk Blog
Widget RSS Subscribe Dan Sosial Media Untuk Blog | Hai, Pada artikel ini saya ingin berbagi widget Subscribe dan Icon Sosial Media dalam satu widget, sebenaranya widget ini mempunyai latar yang berwarna gelap atau dark, widget Rss Subscribe adalah widget kotak berlangganan email dari blog tersebut dan setiap blog tersebut update artikel dan otomatis dikirim ke email sobat. 

Widget RSS Subscribe Dan Sosial Media Untuk Blog
--------------------------------------------------------------------

  • Login Ke Blogger.com Dengan Akun anda
  • Masuk ke menu ''Tata Letak''
  • Sekarang klik ''Tambah Gadget''
  • Pilih Gadget ''HTML/JavaScript
  • Masukan kode dibawah ini, Dan simpan di gadget tesebut


<style>

#btrix-newsletter{ width:290px;background:#2e3639; color:#fff; padding:20px; font-size:14px; margin-bottom:20px; -moz-box-shadow: 2px 2px 2px #000000;-webkit-box-shadow: 5px 5px 5px #000000;box-shadow: 5px 5px 5px #000000;border:double 5px #000000;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;
border-top-left-radius:5px;border-top-right-radius:5px;border-bottom-left-radius:5px;border-bottom-right-radius:5px;}


#btrix-newsletter .btrix-title { margin-bottom:10px;margin-top:-10px; }
.btrix-title{margin-left: 8px;font-size:25px; font-weight:bold; border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;padding:1px 8px 2px 8px;text-align:center;border:1px solid #151819;color:#fff;background:#222729;display:inline-block;}


#footer-subscribe-btn {width:116px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;
position:relative;left:135px;}
.footer-submit-btn {margin-left:50px;margin-top:-5px;margin-bottom:-50px;border: none;color: #fff;text-transform: uppercase; font-size: 13px;padding: 5px 18px 5px;background: #e93a30;border-radius: 30px;-webkit-border-radius: 30px;
-moz-border-radius: 30px;font-weight: bold;-webkit-transition: background .2s linear;
-moz-transition: background .2s linear;-ms-transition: background .2s linear;-o-transition: background .2s linear;transition: background .2s linear;cursor: pointer;
}
.footer-submit-btn:hover { background:#e51111;}


#fastsearch ,#footer-subscribe-email{background:#62686b;color:#fff;font-size:14px;border:none;
box-sizing:border-box;border-radius:30px;-webkit-border-radius:30px;-moz-border-radius:30px;outline:none;padding:0px 15px; height:30px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
#fastsearch.inactive ,
#footer-subscribe-email.inactive {color:#b5b7b8;}
#footer-subscribe-email {width:100%;}
#sb-nl-members-count { font-size:12px; font-weight:bold;text-align:center;width:150px;margin:0 0 -36px 0 ;display:inline-block;
</style>




<br />
<div id="btrix-newsletter">
<div class="btrix-title">
Get Email Updates</div>
<div class="btrix-nl-text">
<center>
Subscribe to Get Latest Updates Free</center>
</div>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=arieadie', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="inactive footer-text-field" id="footer-subscribe-email" name="EMAIL" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" type="text" value="Your email address" />
<input name="uri" type="hidden" value="arieadie" />
<input name="loc" type="hidden" value="en_US" />
<br />
<div id="sb-nl-members-count">
<table border="0">
<tbody>
<tr>
<td style="padding-right: 4px;"><a href="http://twitter.com/lindamarlina40" target="_blank" title="Follow Me On Twitter">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-XST6hEuRRqUNjplw3xQRWEul7Yei7BFC23CsgRYoMy1s9TvXlqGHXSOhajn-yBH3a-oD_CySbQIvkLyKwFKI-gFvIGBSqkXesp8lYXA_ggPl5n1h86VFnHMSLJOf9yb3Hd8oNK6sUzY/s1600/bloggertrix.com-twitter-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://feeds.feedburner.com/arieadie" target="_blank" title="Subscribe Via RSS">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfwk_z7FQLSwvfttOqNs26tL3NnsDafONEIP3U4XmZNc7gyuOQzv0wriyv97XfinHrQOAsld0o791nAzTH7FElislAm-VgqMIvK0vh5O46UG7KEuChOO-XOO305u1lO4UmwEPupPslVs4/s1600/bloggertrix.com-rss-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://www.facebook.com/USERNAME" target="_blank" title="Find Us On Facebook">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHv528TPYstk_s7_fqI_tqZNFSnkbLlsA-SyAM45ikdLmc5GKhNZ8-fv_uuaW1Op9IxdkfKdWjXjHfl7Df9xBES9Y7mFuJSejq4MwipPfsTW3NQvv55FfJRgxH8G5k6DXX3LvqsUgaAK0/s1600/bloggertrix.com-facebook-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="https://plus.google.com/108021608037797119" target="_blank" title="Add me on Google+">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiITNtreaJpeFtzhJNP53md5HikK5SN-Q_4GBDX4Xkr1ACLkTtAkwZ3w5NWKyN5t6v3zPuZyylbdPskDgmyJZ8EBCsBvUVngL569982n7x6EFUaIwiML2blxRDlqkCTR943s5GSP0G5vOo/s1600/bloggertrix.com-google-icon.png" style="height: 25px; width: 25px;" /></a>
</td>
<td style="padding-right: 4px;"><a href="http://youtube.com/UserId" target="_blank" title="youtubr subscribe">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMXxuhSZF3KnaREUCOZ19u1jlK8ur3dltYjRVYG2LcTl5k0GGtrcoEMefr9DQUdtyT3_tdwydUzw_WOWfoDkoma6a09zLKT9vM8XtWbS_z-vSxX1a6WrHxAedcjAnm9OlWT_ubCX0Df1o/s1600/bloggertrix.com-youtube-icon.png" style="height: 25px; width: 25px;" /></a>
</td></tr>
</tbody></table>
</div>
<input class="footer-submit-btn" id="footer-subscribe-btn" type="submit" value="Subscribe" />


<div class="clr">
</div>
</form>
</div>
  • Ganti arieadie Dengan Id Feedburner anda
  • Ganti lindamarlina40 Dengan username Twitter anda
  • Ganti USERNAME Dengan username Faceook anda
  • Ganti 108021608037797119476 Dengan ID Profile Google+ anda
  • Ganti Userid Dengan username youtobe anda
  • Setelah selesai, simpan widgetnya
Demikianlah artikel diatas semoga artikel ini bermanfaat bagi sobat semua dan berguna sesama, sobat semua boleh bertanya tentang artikel diatas atau masih binggung silakan berkomentar di kolom komentar di bawah ini ! dan saya akan menjawabnya pertanyaan sobat semua...

Membuat Widget Jejaring Sosial ''Touch Me'' Di Blog


Membuat Widget Jejaring Sosial ''Touch Me'' Di Blog

Pada Kesempatan kali ini saya ingin berbagi sebuat widget sosial media untuk sobat, gunanya widget ini adalah untuk membantu pengunjung untuk bisa bersosial dan berkomunikasi sama pemilik blog tersebut.
Widget ini cukup keren karena karena kalau kursor bergerak kesalah satu icon jejaring sosial akan berubah menjadi berwarna tergantung warna sosial media, Dan untuk membuat membuat widget ini seperti ini :
Membuat Widget Jejaring Sosial ''Touch Me'' Di Blog
------------------------------------------------------

  • Login ke Blogger.com, Dengan akun anda
  • Klik ''Tata Letak''
  • Setelah itu ''Klik ''Tambah Gadget''
  • Pilih Gadget ''HTML/JavaScript''
  • Copy kode Di Bawah ini di dalam gadget tersebut

<style>
/*--------Touch Me Sharing Widget ------*/
.touchme a {
display:block;
height:50px;
width:50px;
padding:0 4px;
float:left;
background:transparent url(http://mybloggertricks.googlecode.com/files/Sharing%20Touch%20Me.png) no-repeat;
-webkit-transition: ease-in 0.2s all;
-moz-transition: ease-in 0.2s all;
-o-transition: ease-in 0.2s all;
-ms-transition: ease-in 0.2s all;
transition: ease-in 0.2s all;
cursor:pointer;
}

.touchme a.googleplus {
background-position: 0px -58px;
}
.touchme a.googleplus:hover {
background-position: 0px 0px;
}

.touchme a.twitter {
background-position: 0px -290px;
}
.touchme a.twitter:hover {
background-position: 0px -232px;
}
.touchme a.facebook {
background-position: 0px -406px;
}
.touchme a.facebook:hover {
background-position: 0px -348px;
}

.touchme a.rss {
background-position: 0px -174px;
}
.touchme a.rss:hover {
background-position: 0px -116px;
}

</style>

<div class='touchme'>
<!--RSS-->
<a class='rss' href="YOUR RSS LINK" rel='external nofollow' target='_blank'></a>
<!--Google Plus-->
<a class='googleplus' href="YOUR GOOGLE PROFILE LINK" rel='external nofollow' target='_blank'></a>
<!--Facebook-->
<a class='facebook' href="YOUR FACEBOOK LINK" rel='external nofollow' target='_blank'></a>
<!-- Twitter -->
<a class='twitter' href="YOUR TWITTER LINK" rel='external nofollow' target='_blank' ></a>

</div>
  • Ganti YOUR RSS LINK Ganti dengan ID Feedburner Anda
  • Ganti YOUR GOOGLE PROFILE LINK Ganti Dengan ID Profile Google+ anda
  • Ganti YOUR FACEBOOK LINK Ganti Dengan Username Facebook anda
  • Ganti YOUR TWITTER LINK Ganti Dengan Username Twitter anda
  • Setelah Semua Selesai diganti sesuai keinginan sobat, Sekarang Klik ''Simpan''
Demikianlah artikel ini semoga artikel ini bermanfaat bagi sobat semua, maaf kalau ada salah kata dan terlalu singkat membahas artikel ini, dan sobat boleh memberi pendapat tentang artikel ini atas masih bingung silakan berkomentar di kolom komentar di bawah ini... Terima Kasih...

Cara Membuat Widget RSS Subscribe Keren Untuk Blog


Langsung saja kita coba membuat widget ini dan untuk tutorialnya dan perbuatannya seperti di bawah ini
  • Login ke Blogger, Dengan akun anda
  • Pergi ke ''Tata Letak''
  • Klik ''Tambah Gadget''
  • Pilih gadget ''HTML/JavaScript''
  • Terus, Masukan kode dibawah ini di dalam widget tersebut


<style>

.btrixsocial_box-email{
background:Fff no-repeat 0px 12px ; width:270px;float:center;font-size:1.4em;font-weight:bold;margin:2px 20px 0px 10px;color:#686B6C;
}
.btrixsocial_box-emailsubmit{
background:#0084CE;cursor:pointer; color:#fff; border:none;padding:3px;margin:0 0 0px 0;text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25);
-moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; font:12px sans-serif;
}
.btrixsocial_box-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px; margin:0px 2px 0px 2px; background:#f9f9f9; border:1px solid #ccc; resize:none; box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); -webkit-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); font-size:13px; width:200px; height:20px;color:#666;}
#socialboxbt
{
text-align:center;font-weight:bold;padding:5px;border:1px solid black;width:300px;
-moz-box-shadow: 0px 0px 8px #000000;-webkit-box-shadow: 0px 0px 8px #000000;box-shadow: 0px 0px 8px #000000;}
</style>
<br />
<div id="socialboxbt">
<a href="http://feeds.feedburner.com/arieadie" imageanchor="1" rel="nofollow" style="float: center; margin-left: .5em; margin-right: 1em;" target="blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFVunY8NSiOzBYEA-cCmmaEOqCvqj5ZHKbXjYsK-4iVVAmdE1PYIuj63FUO4YytdxQoUJedfhXpT1D_dd0Afc4cvPakGJS_W97ojScMrAfV3aeBYMp7b7upMpzP4-qD7IPjGkGHVq5yyfZ/s1600/rss.png" /></a>
Submit your Email Address to Get Free latest Articles Directly to your Inbox
<br />
<div class="btrixsocial_box-email">
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=arieadie', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="textarea" gtbfieldid="3" name="email" onblur="if undefinedthis.value == &quot;&quot;) {this.value = &quot;Enter email address here&quot;;}" onfocus="if undefinedthis.value == &quot;Enter email address here&quot;) {this.value = &quot;&quot;;}" type="text" value="Enter email address here..." />
<input name="uri" type="hidden" value="GhiyatsBlogs" /><input name="loc" type="hidden" value="en_US" />
<input class="btrixsocial_box-emailsubmit" type="submit" value="Submit" />
</form>
</div>
<style class="text/css">
table
{border-bottom: 0px solid #E6E6E6;float: center;width: 300px;margin:-8px 0 0 0px;}
.subicons
{border-right: 0px solid #E6E6E6;}
.Fadeout {filter:alphaundefinedopacity=100);opacity: 1.0;border:0;
}
.Fadeout:hover{filter:alphaundefinedopacity=80);opacity: 0.8;border:0;
}
</style>
<br /><div class="table"><table>
<tbody><tr>
<td><div class="subicons">
<a class="Fadeout" href="http://www.facebook.com/Username" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6BJ33Vpc-SvQAT8_cMf9CHRS0czvCWxKFTvkhLX6kPXZWS18JogMGTKkbIMQ3elq2_Dx7nF5iGxbdERZhuoYBOCnaoH84Niz7TvTsSxsqfxm7z0KnTw0zM8Zo8s3Ieod1ED2UPdPvGLs/s1600/btrix-facebook-icon.png" /></a></div>
</td><td><div class="subicons">
<a class="Fadeout" href="http://twitter.com/lindamarlina40" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsEQ5_3BtrygZ5ljFrc9nmmlIoOt6CZITmNi69B1nvqIag1WbD4Zvm3b27muiswuZ0U7wsxNWb3oZkZMPfPx2FdbHG6_In4x-fqnEzhZhqS5GNTagEV1IS9ErLtwQ-F68mGxwSB9_xHLY/s1600/btrix-twitter-icon.png" /></a></div>
</td>
<td><div class="subicons">
<a class="Fadeout" href="http://feeds.feedburner.com/arieadie" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg64x9g7hYyqIGBCr9iaemjSErEehy6PqANbOwBQql_yBjd8WLJnTFiQRYPkvXhml1zq3UjDGw5isP9RyWcveAabBTOuMyuP37fa5_nOhBdNrqR30D8LhqLKeWOqWpO_KaPP0DLxEARLHw/s1600/btrix-rss-icon.png" /></a></div>
</td>
<td><a class="Fadeout" href="https://pinterest.com/Username" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg98GGw85Qz2YVJoSwDEFLoxixCZV2NmCF03gh3AfvxPxRV31NG1oHCK0WxWiq9OH3izkZU-jkdUZxsJRqU5hXuCMEeofutU29uN3ztANsWeOAb8wvFuYjSP2GMV9VVoVv_octFERvRFp4/s1600/btrix-Pinterest-icon.png" /></a></td>
</tr></tbody></table></div></div>
  • Ganti arieadie Dengan Id FeedBurner Anda
  • Ganti Username Dengan Username Facebook anda
  • Ganti lindamarlina40 Dengan Username Twitter anda
  • Ganti Username Dengan Username Pinterest anda
  • Setelah Semua, Di Ganti, Sekarang Klik Simpan

Dan demikianlah artikel ini semoga artikel ini bermanfaat bagi sobat semua dan mudah untuk dipratekan dengan mudah dan sobat silakan memberi pendapat tentang artikel ini atau yang masih binggung silakan berkomentar di kolom komentar di bawah ini, Terima Kasih......

Membuat Widget Sosial Media Hover Keren Untuk Blog


Widget ini menggunakan CSS, dan sangat mudah di gunakan dan saya yakin widget ini tidak begitu menambah loading blog sobat, sampai di sini penjelasannya langsung saja kita coba berlajar membuatnya dan mempratekan seperti tutorialnya seperti di bawah ini..
Membuat Widget Sosial Media Hover Keren Untuk Blog
----------------------------------------------------------------

  • Pertama masuk ke Blogger.com, dengan akun anda
  • Terus, Klik ''Tata letak''
  • Klik ''Tambah Gadget''
  • Pilih Gadget ''HTML/JavaScript'' dan masukkan kode dibawah ini di dalam gadget tersebut

<style>

.StarsBloggingSocialButtonsBorder {
margin:0 auto;
padding:5px;
width:auto;
border-radius:5px;
border: 1px #BBBBBB solid;
}
#bloggertrix-SexySocialButtons{
list-style:none;
text-decoration:none;
font-size:0.9em;
font-family:trebuchet ms,sans-serif;
}
#bloggertrix-SexySocialButtons a{
text-decoration:none;
font-family:trebuchet ms,sans-serif;
}
#bloggertrix-SexySocialButtons li{
position:relative;
height:38px;
cursor:pointer;
padding: 0 !important;
}
#bloggertrix-SexySocialButtons .facebook, .googleplus, .YouTube, .rss, .twitter{
position:relative;
z-index:5;
display:block;
float:none;
margin:5px 0 0;
width:210px;
height:38px;
border-radius:5px; background:url(http://1.bp.blogspot.com/-JKq0eFFwx34/UGx39fhHO_I/AAAAAAAABE4/56i9phAS2do/s1600/NBT+Sprites+Social+Icons.png) no-repeat;
background-color:rgba(217,30,118,.42);
-webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
-moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
box-shadow:rgba(0,0,0,.28) 0 2px 3px;
color:#141414;
text-align:left;
text-indent:50px;
text-shadow:#333 0 1px 0;
white-space:nowrap;
line-height:32px;
-webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-moz-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-ms-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-o-transition:width .25s ease-in-out,background-color .25s ease-in-out;
transition:width .25s ease-in-out,background-color .25s ease-in-out;
-o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
}
#bloggertrix-SexySocialButtons li:after{
position:absolute;
top:0;
left:50px;
z-index:2;
display:block;
height:38px; color:#ffffff;
content:attr(data-alt);
line-height:32px;
}
#bloggertrix-SexySocialButtons .icon{
overflow:hidden;
color:#fafafa;
}
#bloggertrix-SexySocialButtons .facebook{
width:32px;
height:32px;
background-color:rgba(59,89,152,0.42);
background-position:0 0;
}
#bloggertrix-SexySocialButtons .twitter{
width:32px;
height:32px;
background-color:rgba(64,153,255,0.42);
background-position:0 -33px;
}
#bloggertrix-SexySocialButtons .googleplus{
width:32px;
height:32px;
background-color:rgba(228,69,36,0.42);
background-position:-3px -66px;
}
#bloggertrix-SexySocialButtons .YouTube{
width:32px;
height:32px;
background-color:rgba(174,45,39,0.42);
background-position:-2px -95px;
}
#bloggertrix-SexySocialButtons .rss{
width:32px;
height:32px;
background-color:rgba(255,102,0,0.42);
background-position:-3px -126px;
}
#bloggertrix-SexySocialButtons li:hover .icon,
.touch #bloggertrix-SexySocialButtons li .icon{
width:210px;
}
.touch #bloggertrix-SexySocialButtons li .facebook, #bloggertrix-SexySocialButtons li:hover .facebook{
background-color:rgba(59,89,152,1);
}
.touch #bloggertrix-SexySocialButtons li .twitter, #bloggertrix-SexySocialButtons li:hover .twitter{
background-color:rgba(64,153,255,1);
}
.touch #bloggertrix-SexySocialButtons li .googleplus, #bloggertrix-SexySocialButtons li:hover .googleplus{
background-color:rgba(228,69,36,1);
}
.touch #bloggertrix-SexySocialButtons li .YouTube, #bloggertrix-SexySocialButtons li:hover .YouTube{
background-color:rgba(174,45,39,1);
}
.touch #bloggertrix-SexySocialButtons li .rss, #bloggertrix-SexySocialButtons li:hover .rss{
background-color:rgba(255,102,0,1);
}
</style>
<div class="bloggertrixSocialButtonsBorder">
<ul id="bloggertrix-SexySocialButtons">
<li data-alt="Follow us on Facebook"><a class="icon facebook" href="https://www.facebook.com/Username">Follow us on Facebook</a></li>
<li data-alt="Follow us on Twitter"><a class="icon twitter" href="https://twitter.com/lindamarlina40">Follow us on Twitter</a></li>
<li data-alt="Follow us on Google+"><a class="icon googleplus" href="https://plus.google.com/108021608037797119">Follow us on Google+</a></li>
<li data-alt="Subscribe us on YouTube"><a class="icon YouTube" href="https://youtube.com/Username">Subscribe us on YouTube</a></li>
<li data-alt="Subscribe with RSS"><a class="icon rss" href="http://feeds.feedburner.com/arieadie">Subscribe with RSS</a></li></ul></div>
  • Ganti Username dengan username facebook anda
  • Ganti linda dengan username Twitter anda
  • Ganti 108021608037797119 dengan id profile Google+ anda
  • Ganti Username dengan dengan username youtobe anda
  • Ganti arie dengan Id Feedburner anda
  • Setelah semua diganti sesuai keinginan sobat, Sekarang klik ''Simpan''

Demikianlah artikel tentang widget sosial media, semoga artikel ini bermanfaat dan mudah untuk dipratekkan sama sobat semua, sobat boleh memberi pendapat tentang artikel ini atau sobat masih ada yang masih binggung silakan berkomentar di kolom komentar dibawah ini, Terima Kasih......

Membuat Sosial Media Seperti Kayu Keren Di Blog


Widget ini bisa menambah lebih menarik di blog kita dan lebih keren tentunya, Langsung saja kita akan belajar mencoba membuat widget sosial media dan tutorialnya seperti di Bawah ini :
Membuat Sosial Media Seperti Kayu Keren Di Blog
------------------------------------------------------
  • Login Ke Blogger.com, dan login dengan akun anda
  • Setelah di Dasbor Blogger, Masuk ke Menu ''Tata Letak''
  • Terus, Klik ''Tambah Gadget''
  • Pilih Gadget ''HTML/JavaScript''
  • Masukan Kode di bawah ini, di dalam Gadget tersebut

<style>

/* Social Icons
----------------------------------------------- */


a.social-icons {
margin-right: 5px; /*Adjust This Value As Needed*/
height:45px;
width:45px;
}


a.social-icons:hover {
opacity: .7;
filter:alpha(opacity=70); /* For IE8 and earlier */
} height:45px;
width:45px;
</style>


<a class="social-icons" href="https://facebook.com/username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihQLX5YPypbtnNquzLZ_Y8JLWxUrTju5T5WKiAOdnBGWvIbyFhoXFuI9u2DWczQpOTK6Mcb0WCb7S4WTdH5OgEKF4D3y317DQBcvvFxjqXHuYc5063aZg0qRag8DsL8JqAjAofA37rgCU/s1600/btrix_facebook-icon.png" /></a>
<a class="social-icons" href="https://twitter.com/lindamarlina40"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYg_A_54nU9oqia1kTd1a6td6m946CwhRYIlqNFsSs4CupV_TypjicVBoy57xGKGcV_ovUhxG7hwAHYpc1i5UrRBGdWrAiAEQ4NWQeW4qUoOMLg9_NZTUn2vdEpV3OZ-QYcUUv4KLxbAU/s1600/btrix_twitter-icon.png" /></a>
<a class="social-icons" href="https://digg.com/userId"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzdbNYs1u8XeMb6GwV_NtzdvuOMFKFGiBzzlJFsvKEN0vZA7HUrwYrsaIMd9ZeR0yRqm_dqen7jOk0f8k-dDwPLmNP3sgvwB8Q_LN0NGPSyVpvmooQQxhx-3uO_NLmBc-PNRRf5tpyObQ/s1600/btrix_digg-icon.png" /></a>
<a class="social-icons" href="http://www.feedburner.com/arie"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_HU2yOjDPUE0CdPsryFYliv7dEsWxj-81mkVRm7fkL1OnPdXEjGb91NLrB_1UVYKaeXkD3Iv3ebS8gWRerJOEqcDFFw4Y_ScWmN7AW_1zvLVDaL-DbqM-ntiO8Bk34wbDD6OTnME3Gjs/s1600/btrix_rss-icon.png" /></a>

<a class="social-icons" href="http://stumbleupon.com/username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmCbi4yzvVkm-L3kWxkl1OVtvYimcshnyEWRvoZApbDZ3s22WtOXPT3blY3r_H1BS8BwUqTBZPUDukhbbhkNphrHcHJcuOblmTnAFMGfeGdesVl9M2ZNIGdEYVP5_f0lPhUnffm37sR9A/s1600/btrix_stumble-icon.png" /></a>
  • Ganti username Dengan username Facebook anda
  • Ganti linda Dengan username Twitter anda
  • Ganti userid Dengan id Digg anda
  • Ganti arie Dengan id Feedburner anda
  • Ganti username Dengan username Stumbleupon anda
  • Setelah semua di ganti, Sekarang Klik ''Simpan''
Demikianlah artikel ini yang berjudul ''Membuat Sosial Media Seperti Kayu Keren Di Blog'' Semoga artikel ini bermanfaat dan mudah untuk dipratekkan sama sobat semua, untuk sobat yang ingin bertanya tentang artikel ini atau ada yang masih binggung silakan berkomentar di kolom komentar di bawah ini, Terima Kasih...

Widget Sosial Media Metro Style


salam buat Sobat Semua... Pada artikel yang akan saya akan bagikan ini, saya akan berbagi sebuah widget Sosial Media, Sosial Media ini berbeda pada Widget sosial media lainnya, Kalau kursor bergerak ke salah satu Sosial media, sosial tersebut akan membesar sendiri, Widget ini bisa menambah Menarik dan Elegan untuk Blog Kita, Langsung Saja Kalau sobat ingin membuatnya Untuk Tutorialnya Seperti ini.
Membuat Widget Sosial Media Metro Style Di Blog
---------------------------------------------------------

  • Pertama, Kita Harus Login Ke Blogger, Dengan Akun Anda
  • Klik Menu ''Template'' Di Dasbor Blogger
  • Terus, Klik ''Edit HTML''
  • Cari kode ]]></b:skin, Setelah ketemu Copy Kode diBawah ini di Atasnya
/* Code */
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 40px; /* width of each image.*/
height: 40px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
  • Setelah Selesai, Klik ''Simpan''
Cara Pemasangannya :
  • Pergi Ke Menu ''Tata Letak''
  • Klik ''Tambah Gadget''
  • Pilih Gadget ''HTML/JavaScript''
  • Terus, Copy Kode dibawah ini Di dalamnya

<ul class="bubblewrap">
<li><a href="https://plus.google.com/1080216080377971194"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjqk0gP0M9jMR0Wn_4DkpkZis8H-o6d_EXAZHJFWoXmNiXNi7_A4y9MVtI7Fd5Id8FB_FN38MC49_dvb4-FUwmb0XGDVZbfN-NGTtUa1ABOV_WhqIEkeeDVXuDnrIf_Chbcb55tsXBF3Y/s1600/bloggertrix.com-google-icon.png" title="Google pus" /></a></li>
<li><a href="https://www.facebook.com/arieadie30"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhMmxf0TRZZ7j_sixUwnpHVOQJefqktXbai_9N4rMmDyPa6cLrv1iQvCFhS5OSbHT45RdShLH_nnvfFMgp9rBjUTfiTiZxHFmEC9fmc6K5QZrh8py9aauDac0sv3zfIZU7seXWPA7ZpWc/s1600/bloggertrix.com-facebook-icon.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.digg.com/Username"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUmlu8B9aOYClpV8h6va-KL8kdR8ms3B3iJuwgc4jbWJ9aXR2WC-rQ3r8JeOJY1v4QLWHU3Y4ICdjC7aT3TmDhP2tpfKaEiGC5OBgVZQ2RS51TngcqQy3wi302WjgGyDAYnQ_lXyzQ2-w/s1600/bloggertrix.com-digg-icon.png" title="Add to Digg" /></a></li>
<li><a href="http://www.twitter.com/lindamarlina40"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjd1L47nSQjkzbyDdRdpJ_Vyhr0ILOxBUMyRoYUrXfn03HlyCHUxH6TsWceo4m6q8lZHItpPAmo0wWRgqN8s7WTOswjOpY_D0xHQ_89wygsz0TSRPmbP-AeaJ0Q7kvhJlSrGDGRdFBZYFw/s1600/bloggertrix.com-twitter-icon.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds.feedburner.com/arieadie"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLZHbQ3jwUK6ykJ4xucgpUzmh_zK2dJiiRJ6KBn6kAYlYM71pvyEms3fnYCecYUIbbWmxTvel-PWUbR-VsoRS3uGNeKtlruzJ59uIHXH0qh-LaSpez6CBxaY3fp-w0AJ3atCe_BAFHJ0k/s1600/bloggertrix.com-rss-icon.png" title="Add RSS Feed" /></a></li>
</ul>
  • Ganti 108021608037797119 Dengan Id Google+ anda
  • Ganti arieadie30 Dengan username Facebook anda
  • Ganti lindamarlina40 Dengan username Twitter anda
  • Ganti Username Dengan username digg anda
  • Ganti arieadie Dengan ID feedburner anda
  • Setelah semua di ganti, Sekarang Klik ''Simpan''
Demikianlah Artikel ini Semoga artikel yang Saya bagikan ini bermanfaat dan Mudah Untuk Di Pratekkan, Silkan Beri Pendapat Tentang artikel atau ada yang kurang dimegerti Silakan Berkomentar Di Kolom Komentar Di Bawah ini, Terima Kasih..

Membuat Widget Sosial Media Dengan Kotak RSS Subscribe


Akan Saya Bagikan Sebuah Artikel yg Berhubungan dengan Widget Sosial Media dan Kotak Berlanganan, Sudah Banyak Widget Yang Berhubungan Sosial Media + Email Berlanganan, Widget Bisa Menghemat Tempat Karena Widget Ini Berguna Untuk Sosial Media Dan Email berlanganan Dalam Satu Widget, Begitu lah, Widget ini juga Bisa Menambah Menarik dan Membuat Blog kita Menjadi Lebih ELegan, Tentunya, Langsung Saja Kalau Sobat Tertarik Untuk Membuat, Kita Akan Coba Membuat Widget ini Seperti ini Tutorialnya dan Cara Pembuatannya Seperti ini.


Membuat Widget Sosial Media Dengan Kotak RSS Subscribe


  • Login Ke Blogger, Dengan Akun Anda
  • Klik ''Tata Letak'' Pada Dasbor Blogger
  • Klik ''Tambah Gadget''
  • Pilih Gadget ''HTML/JavaScript'' Dan Masukan Kode Di bawah ini, Di dalamnya Gadget Tersebut
<style>
#socialnbtrix{
width:244px;
padding:10px 10px 0px 9px;
background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9WoHp6cuY_fPhyq2W8SZx90X3YvFyClmWG7TxOkI10XakSj6q_eKksO0M_lWsxIBo5rCNQNXweB4LvgLSm9e5ti_crBKuFe2NiFSUa_zPjy41T9dnqVirTwdF3m_gikiB8czjul-X0E4/s1600/HP-Laptop-Luster.png)no-repeat top left;
box-shadow:5px 7px 5px #ddd;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:20px;}
p#socialnbtrixp 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;
padding-right:10px;}
p#socialnbtrixp img:hover {
-moz-transform: rotate(420deg);
-webkit-transform: rotate(420deg);
-o-transform: rotate(420deg);
-ms-transform: rotate(420deg);
transform: rotate(420deg);}
bloggertrixform.emailout{
margin:20px;
display:block;
clear:both;
padding:50px;
float:right;
}
.bloggertrixtxt{
font-size:16px;
color:#666;
font-weight:bold;
font-family:Georgia,Times New Roman,Trebuchet MS;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
width:240px;
height:30px;
}
.bloggertrixbtn{
color:#666;
font-weight:bold;
text-decoration:none;
padding:10px 20px;
border:4px solid #D3D3D3;
cursor: pointer;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-goog-ms-border-radius: 4px;
border-radius: 20px;
background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}
</style>
<br />
<div id="socialnbtrix">
<center><p id="socialnbtrixp">
<a href="feeds.feedburner.com/arieadie">
<img border="0" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhk-SAcvXcR_sPDV9UqpB42oM31YHCJ_R3z5A7ly0GwxUbFYXIqU-ehVhj9SC9jlsrSK2Mtx0gweau6DM7O04hgPdTyaZEqV4noYd6huYSik4dXXQ8tbfurK820AnYP3PBMm8xuNmLCD9Q4/s1600/RSS-48x48.png " /></a>
<a href="https://plus.google.com/108021608037797119446">
<img border="0" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjs4Klq4mORc9-7Pd4uXXCAtdEfEnH2h1vgnu3Jo9LsNuCRa_YJiwlsJ_pSMRdQAuvWtUYtxhyKlGO2L7l5M6107VWsiGU7mGcNaPLDcUOcmbA5orvm4a2ERtmulp7z4qmfann0ZUElF7o/s1600/TNT.png " /></a>
<a href="www.twitter.com/GhiyatsBlogs">
<img border="0" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrclxcqBFhAGq_TIqw-ZLUMt5Zw3OhgezzL6jtr-MIXt7gFw1BYK_ypFHiUoeB3TL7ngIpZyPyxmG-M0CBHCtUFUUhbJ7HWR8Mm3oyqIJBNywYr3um3vTiqwVrw0NsMglFhUha5-OFFIQ/s1600/TNT.png " /></a>
<a href="www.facebook.com/arieadie30">
<img border="0" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEpBFitpwaJPzBosyEEdlYWAgX1q_Xwz8gAPC7fY11MdH0BiJcI_QaKFWakBzESjpd9RrTs-VNB3Cszv_mLzOhdddwF9lkheOeuNjThipRyDyqvMTUli5NldlPuR0rCvImGmu8Qqt0G-0/s1600/TNT.png " /></a></p></center>
<p style='color:#666;
font-weight:bold;
font-family:Georgia,Times New Roman,Trebuchet MS;'>Get Quality Updates Into Your Inbox FREE !!</p>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailout' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=feeds.feedburner.com/arieadie&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=550&apos;);return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='feeds.feedburner.com/arieadie'/>
<center><input name='loc' type='hidden' value='en_US'/>
<input class='bloggertrixtxt' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your Email&quot;;}' onfocus='if (this.value == &quot;Enter your Email&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your Email'/>
<input alt='' class='bloggertrixbtn' title='' type='submit' value='Submit'/>
</form><center>
</div>
  • Ganti arieadie Dengan Id Feedburner anda
  • Ganti lindamarlina40 Dengan username twitter anda
  • Ganti arieadie30 Dengan username Facebook anda
  • Ganti 1080216080377971194 Dengan ID google+ anda
  • Setelah Semua Di Ganti, Sekarang Klik Simpan
Demikianlah Artikel ini yang berhubungan dengan Sosial Media dan RSS Subscribe, Semoga Artikel yang Saya Bagikan ini Bermanfaat dan Mudah Untuk Di Pratekkan, Silakn Ber Pendapat Tentang Artikel ini dan Kalau sobat Butuh Bantuan Tentang Artikel ini, Silakn berkomentar Di Kolom Komentar Di bawah ini, Pasti Saya Bantu, Terima Kasih...