Ingin pasang iklan di slide 3

hubungi 0812 98765 212 / Admin - Ron1st.blogspot.com

Ingin pasang iklan di slide 4

hubungi 0812 98765 212 / Admin - Ron1st.blogspot.com

Ingin pasang iklan di slide 5

hubungi 0812 98765 212 / Admin - Ron1st.blogspot.com

Sunday, February 2, 2014

Membuat Artikel Terkait di Bawah Postingan Blog Yg Keren

11:00 AM    


  • 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
Read More

Widget Kotak Berlangganan Keren Di Blog

10:59 AM    

  • Masuk ke Blogger dengan akun anda
  • Pilih Menu ''Tata Letak''
  • Klik ''Tambah Gadget''
  • Pilih Widget ''HTML/JavaScript''
  • Copy kode dibawah ini di simpan di kotak yang tersedia 
<style type="text/css"> /*<![CDATA[*/
 #esgfollowSubscribe {background-color: #464646;width: 220px;color: #fff;position: fixed;z-index: 999999;right: 10px;bottom: 0;}
 .followOpened {-webkit-border-radius: 2px 0 0;-moz-border-radius: 2px 0 0;border-radius: 2px 0 0;-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);}
 .esgfollowButton {background: #464646;color: #CCC !important;font-size: 13px;line-height: 28px;padding: 0 10px;text-decoration: none;position: absolute;top: -28px;right: 0;display: block;-webkit-box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);-webkit-border-radius: 2px 2px 0 0;-moz-border-radius: 2px 2px 0 0;border-radius: 2px 2px 0 0;height: 28px;}
 .esgfollowButton span {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9s0KcJSReZryrW9wWLDXlyAG8r0KTSV0aL3Um9sgBIlrx0zgXSUn8LXjaeXH7D8QcnNNQ3jkjch38w_XopCxpfFDPtKrE9KRv6tcA9seOGQ6avWAdD31t6amWAj3-ZHE7orgxc46K1BA/s1600/follow-bloggertrix.png") no-repeat scroll 0 3px transparent;padding-left: 15px;}
 .esgfollowButton:hover,.followActive {color: #fff !important;}
 .esgfollowButton:hover span,.followActive span {background-position: 0 -37px !important;}
 .followactive {background-color: #333;}
 .esgfollowForm {padding: 15px;}
 .esgfollowForm h3 {font-size: 18px;margin: 0 0 10px;font-weight: normal;}
 .esgfollowForm p {margin: 0 0 10px;}
 .esgfollowForm .emailInput {width: 95%;padding: 2px 4px;margin: 0 auto;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;font-size: 15px;border: 1px solid #444;color: #888;display: block;clear: both;}
 .esgfollowForm form {text-align: center;}
 .esgfollowForm .emailInput:focus {color: #000;border-color: #000;}
 .esgfollowForm .emailSubmit {cursor:pointer;padding: 2px 20px;background: #333;background: -webkit-linear-gradient(top, #333 0%, #111 100%);background: -moz-linear-gradient(top, #333 0%, #111 100%);background: -o-linear-gradient(top, #333 0%, #111 100%);background: -ms-linear-gradient(top, #333 0%, #111 100%);background: linear-gradient(top, #333 0%, #111 100%);color: #ccc;text-shadow: 0 1px 0 #000;border: 1px solid #282828;-webkit-border-radius: 11px;-moz-border-radius: 11px;border-radius: 11px;-webkit-box-shadow: inset 0 1px 0 #444;-moz-box-shadow: inset 0 1px 0 #444;box-shadow: inset 0 1px 0 #444;text-decoration: none;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;-ms-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;margin: 1em 0 1em 0;}
 .emailSubmit:hover {background: #222;background: -webkit-linear-gradient(top, #333 0%, #222 100%);background: -moz-linear-gradient(top, #333 0%, #222 100%);background: -o-linear-gradient(top, #333 0%, #222 100%);background: -ms-linear-gradient(top, #333 0%, #222 100%);background: linear-gradient(top, #333 0%, #222 100%);color: #fff;-webkit-box-shadow: inset 0 1px 0 #4f4f4f;-moz-box-shadow: inset 0 1px 0 #4f4f4f;box-shadow: inset 0 1px 0 #4f4f4f;text-decoration: none;}
 .emailSubmit:active {background: #111;background: -webkit-linear-gradient(top, #111 0%, #222 100%);background: -moz-linear-gradient(top, #111 0%, #222 100%);background: -o-linear-gradient(top, #111 0%, #222 100%);background: -ms-linear-gradient(top, #111 0%, #222 100%);background: linear-gradient(top, #111 0%, #222 100%);color: #aaa;-webkit-box-shadow: inset 0 -1px 0 #333;-moz-box-shadow: inset 0 -1px 0 #333;box-shadow: inset 0 -1px 0 #333;text-decoration: none;}
 .esgFollowFooter {text-align: center;font: normal 11px "Helvetica Neue", sans-serif;padding: 7px 0;margin: 0 0 -15px !important;border-top: 1px solid #3c3c3c;}
 .esgFollowFooter a {color: #aaa;text-shadow: 0 1px 0 #262626;background: none;text-decoration: none;}
 .esgFollowFooter a:hover {color: #fff;background: none;} /*]]>*/ </style> <script type="text/javascript"> /*<![CDATA[*/ ;(function(esg){esg(document).ready(function(){esg.extend(esg.easing,{easeOutCubic:function(x,t,b,c,d){return c*((t=t/d-1)*t*t+1)+b}});var followBox=esg("#esgfollowSubscribe");var followHeight="-"+followBox.outerHeight()+"px";followBox.hide().css({bottom:"-500px"});setTimeout(function(){followBox.show().animate({bottom:followHeight})},500);esg(".esgfollowButton").click(function(e){if(followBox.hasClass("followOpened")){esg(this).removeClass("followActive");followBox.removeClass("followOpened").stop().animate({bottom:followHeight},{duration:300,easing:"easeOutCubic"})}else{esg(this).addClass("followActive");followBox.addClass("followOpened").stop().animate({bottom:"0"},{duration:500,easing:"easeOutCubic"})}e.preventDefault()})})})(jQuery); /*]]>*/ </script> <div id="esgfollowSubscribe" style="bottom: -971px;"> <div class="esgfollowForm"> <a class="esgfollowButton" href="#" title="Follow"><b>+ Follow</b></a> <center> <h3>Follow This Blog</h3>
Get Free Email Updates to your Inbox </center> <form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=e-GhiyatsBlogs', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"> <input class="emailInput" name="email" placeholder="Enter Your Email..." type="text">
   <input name="uri" value="GhiyatsBlogs" type="hidden">
   <input name="loc" value="en_US" type="hidden">
   <input class="emailSubmit" value="Subscribe" type="submit">
  </form> <div class="esgFollowFooter">
  </div> </div> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

  • Ganti tulisan yang berwarna kuning, dengan kata kata terserah anda
  • Ganti GhiyatsBlogs dengan id Feedburner punya kalian
  • script yang berwarna merah adalah jQuery, bagi sobat yang sudah ada kode jQuery tinggal hapus kode jQuery yang ini !
Read More

Cloud Label Warna Ungu Untuk Blogger

10:58 AM    


  • Login Ke Blogger
  • Pilih Menu ''Template'' >> klik ''Edit HTML''
  • Cari kode ]]></b:skin> (Tekan Tombol CTRL+F ) setelah ketemu, copy kode dibawah dan simpan di atas kode tersebut

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

#Label1 a{
outline:1px dotted #FEB380;border: 1px rgba(0,0,0,0.2) solid;padding: 6px 8px 6px 14px;text-decoration:none;
color:black;white-space: nowrap;
font-family: arial,serif;text-transform:capitalize;
font-size: 12px;font-weight: bold;
position: relative !important;background: #aa00ff;
-moz-opacity:0.75;
-khtml-opacity:0.75;opacity:0.75;
filter:alpha(opacity:75%);
float:left;padding: 4px 3px;
margin: 0 5px 5px 0;
border-radius:4px 4px; -moz-border-radius:8px 4px 4px 4px; -khtml-border-radius:4px 4px 4px 4px; -webkit-border-radius:4px 4px 4px 4px; border-radius:4px 4px 4px 4px;
}
#Label1 a:hover {
-moz-opacity:1;
-khtml-opacity:1;
opacity:1;
background:#A55A27;color:white;
-webkit-transition:all ease-in-out .5s;
-moz-transition:all ease-in-out .5s;
-o-transition:all ease-in-out .5s;
transition:all ease-in-out .5s;
}
#Label1 a:active {
background:#B24700;color:#80FFFE;
-webkit-transition:all linear .5s;
-moz-transition:all linear .5s;
-o-transition:all linear .5s;transition:all linear .5s;
}


  •  Setelah selesai , Klik Simpan Template
NOTE!! : Kode di atas bisa berkerjakalau labelpada 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
Read More

Widget Subsribe Dengan Sosial Media Biru Untuk Blogger

10:57 AM    


  • 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/AVvXsEg2OP2igvwhH23zz1KtGvPbCR443JhQ4XqVbkTOid0JbATKWkwTCYV43jCpuWRQOba8RYj1EEAQrwwu76o-aH2MFFsVGPrIIvW9q-t-Fx5QMZX7Y9lnaRqKzsORTj0omZXJpp240qyhMT0/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/AVvXsEhN0sPOmHgb_6qfxOqgzkafcks8-Q7V0JQLDvXt6vI677z0zhTl3xTK7pyoCOhr9iRBxV5aOj_p_Zy9VY_-qYcMfeibzA89JhasmLxIekZGr-Rfdl4j3KYLEVeRPwSANgmqNSMhtrQOnh4/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/AVvXsEgtP-VCzpEvPgXHsH79ZS5S2H4_YfVkl76qVAMXykQdtSAME6fEe77MQjSl2SxftE07yYVj_LmNgR0ow9_4H1RGKMZFuMuw6F1UPdlUDVm47d_DdXpT6jR9lKGSCOF4B1M5vIX8jtwmi9Am/s1600/Bloggertrix-facebook.png" /></a> <a class="social-icons" href="https://twitter.com/USERNAME ANDA"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3ZhlSxq3COiB7MGiOX4IucCX3KC3qXKx0p4riHmMqTiCBR68kL4wYxuojGpkqQkNSfpSqiyuw1ZpKNjaZUBqKHz7C0mLmgHhhHCgE7wvl-LoE9fxKUR2IH_5i_7mugnKRvGptNSTv5Ho1/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/AVvXsEgGV-QqfVC1hpU6emJEg2C_FKVfKVQmR8Y-CHvyz6TD1VKs7bivHz2WlbHcyIjPaBTfnAV6NZtPYGAl5kR5Ki3ikrxWIaiY8IMaYKpbAdm2ET-T7U9D6I33A1eXW_qDt-JN_8KeBzizNUFA/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/AVvXsEjpteIjPWQcPJ9wi2QHSQ7kkJkOzUA14uvWZV0ut44BxF8v0bCmA5vL_1kaoZtuxxBrFLku2Yd9QixDCRU79GqCB9IgjNFkxb6Evuitoch-AQMWASVaJPii57NqcN9Xo39CbcZWJCT-NRLG/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
Read More

Widget Sosial Media Icon Dengan Search Box Untuk Blogger

10:57 AM    

  • 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/AVvXsEgvi6zmllONcsyPtPr3D346FvoH4p3saCdVn3ZX2IAfcMlepfoSBAt-QwYIi-lHcUO6RST3gc44HMUNEc0C9uwP8Az8sZ02-41qag-1mJx8JI2LUJ8h8AVJEVjYd4CHEMLGX0PXcnSB8EHU/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/AVvXsEiKdRmISNDDHBAlEGFtUWjKo5FWK75cDV3ExbdboK-45dsUUP1BOmmLqVohi68LoM0PBgT-h9JKtncvi6MFlMQgQaBZghdPkYwJnlUU_yods9dVA7vOKDyDdPh9Q75o9zxSasp7Q5mGicM/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/AVvXsEjcf2yd4zaSLVvsZLB5BnQQtLxwpgLie63ufClNiEDY94WjQrG0p3x3FgCrWJ-gIq-healiCqpZFS_2skbcEC2AAr8HMqfbNvSYGZ9Ie8Tw19M5gZgfrUBc32QIU6twfuZZCfC32I6Q_4Y/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/AVvXsEh_11gQlwqMtUqHzERjIVccdgDGFV39D6jLwDpDfv30fPAedJmMo-QgsnjMUe6FvbDg0aCodd5DEiu6RpirfrNWct7cqrx94hsXjU5osSMoBnbtpHKJFkXInoR5ZdiQ_4jWlCyQIaDBWJ0/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/AVvXsEj7LrqloFs8Dyeq27C_ipBaGTVnqeXjwECdsYjnDJUx938Mb3Ejq_VD19-VVbDihImaWbY7859edpHuKCR0xhiC2gtsAq_FU7OV9uIDc1hRxqHp045sIhwsWrHi4rmRFjF5wo39PqKnx3Y/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
Read More

Widget Subsribe Dan Sosial Media Super Keren

10:54 AM    


  • 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/AVvXsEgxiQLSS1JOC4j75DdtNqIvSOzJppEeqrQAKLYH3E0yTMfMN6Tf6J2MlV6KBh_HhqVFs267LUP_nN4QDfeVaH8AIDZpDaI-QKAvunW4IuUDerW9rY4l4DhrEn3LE2qtqTD8fx3sxMo5xGc/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/AVvXsEjCdrW617nXHNW7N-po87zRifyK4KRSc6oWfwAI7K69AaRJCC8uIvd6zXhtEYAc94yQ2-mZiy6ki2QQZ97QowLc-wIv7gHxZdsaYDCP0-a-spIwbp2BvsMBj5dMBHHRvLF1tA3yEvxRhTo/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/AVvXsEiTHq0Hbm_-AqOSKJYb0WQBhwoP4ffeRvPZPGcFg2Yu2jWu5-_WjCOpW9n1ZmL343SLeYrKeyJIY0ak-k1jOOBBwRtZ2xbWKlzhw0QqFQw7mlan0vrarJEClWElNX7NYn50jeXNg-dprEE/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/AVvXsEi82RwVVOQqv1sEk2n86w2b4ao1XNGP7zcpWO0UBh2r4hxeE4POyiu9yuIP5i5K0kx4RMo_io5SRmZ-uKCuBuXS9oMd7CZSWbQMbSa7kNpd7CEQj-9JJekwGkJJsbLNtLhXCtRPPO3fizM/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/AVvXsEiMDmJfa2p3ONa6y-HdyCSPiTziI7Oczk3tN4Ei6TcP_ghTdrR48I6PymrCf0tQgDFfigwS8ATlCtZ5MpRSVFi7dT_7JQSbAZJGp5RwpI8uM5a4uXBIK3e7LI79RrrjYG28qrYx7lItqR8/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
Read More

Membuat Cloud Label Warna Hijau Untuk Blogger

10:53 AM    

  • 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
Read More

Membuat Widget Sosial Media Dengan Effect Hover

10:52 AM    


  • 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/AVvXsEjWsbxpTp0X62dOD-C0AF9sA63-1nGF_oeYdTwYvzXRHGrt2ksEcsUEIbl45QRNDAL53bjegYG4qc7DVAQ2H2DTaJiTeUQDySlIc-0LkS-0Makg8Vl2Maq3W8SVHppDX96GvBLbibLE-dQ/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/AVvXsEgcUuPmKLGkSo8_jgcC5_ks8TZQczVSJObX8AE68-6_7q3UWDFqmAe02fLBexID8wcuZomntL-QGxCMCwYq9Iumpk61EKN_j585RqS0dukbMrtimD07zQjS7ST2plzNcX59_D4T4H0DKNk/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/AVvXsEjS1Nv4TUt6IMzR41YdeBK_k_Boek7HA7kxS4YcJWnc1Cg1Zba-nDJNgsrI78yqEULHvc7FZ4c8HWssufEvraOCDtkRgjR7EItd_ariK5UYLPq2jVmDZPmqFvIJuqS1d8fqje4sUjMpERE/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/AVvXsEjcKUv9adlG8_h4y-Ec19jS9obdqYSJEqzAHQQj5HGM5N-BwvAAmCmks0H0ELXtY40a9aeKnbtmNwwlQkXjsZ7bNx-DqzTwIXMyyJKjQyy0aC620QDpZCTqAGIFIMGbd78teFu9YvbPE7U/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
Read More

Membuat Cloud Label Warna Hitam Untuk Blogspot

10:51 AM    
  • 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
Read More

Membuat Widget Populer Post Warna Warni Untuk Blog

10:50 AM    

  • Masuk menggunkan akun google ke blogger.com
  • Setelah itu, Pilih Menu ''Template'' >> Edit HTML
  • Taruhlah code dibawah ini di atas atau sebelum kode ]]></b:skin>

#PopularPosts1 ul li a:hover{color:#fff;text-decoration:none} #PopularPosts1 ul li a {-webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px;  color: #333333; display: block; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 18px; margin: 0px 40px 0px 0px; min-height: 30px; orphans: 2; padding: 0px; text-align: -webkit-auto; text-decoration: none !important; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;} #PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:51px;height:51px} #PopularPosts1 ul li:first-child:after, #PopularPosts1 ul li:first-child + li:after, #PopularPosts1 ul li:first-child + li + li:after, #PopularPosts1 ul li:first-child + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li {background:#DF01D7;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#B041FF;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li +li{background:#F52887;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{content:"10"} #PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"} #PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"} #PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"} #PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:90%} #PopularPosts1 ul li:first-child + li + li + li:after{content:"4"} #PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:90%} #PopularPosts1 ul li:first-child + li + li:after{content:"3"} #PopularPosts1 ul li:first-child + li{background:#ff764c; width:90%} #PopularPosts1 ul li:first-child + li:after{content:"2"} #PopularPosts1 ul li:first-child{background:#ff4c54 ;width:90%} #PopularPosts1 ul li:first-child:after{content:"1"} #PopularPosts1 ul{margin:0;padding:0px 0;list-style-type:none} #PopularPosts1 ul li{position:relative;margin:6px 0;border-radius:25px 0px 25px 0px;border:2px solid #f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px 3px #000;padding:10px}


  • Setelah selesai, Sekarang simpan template sobat
 Selanjutnya :


  • Pergi ke ''Tata Letak''
  • Klik ''Tambah Gadget''
  • Pilih Gadget ''Entri Populer''
  • Pada settingan di sana, pada ''Tampilan'' Jangan Ceklis ''Thumbnail Gambar'' dan ''Cuplikan''
  • Dan pada setting jumlahnya sampai  5 ENTRI, saja
Read More