arieadie 20

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVy0u5_SlYJKPl_IUofBcbiTJSTwwFhSbRCCFFbSWAy28CZPrdUpViahOAzuo5IbegPdHXPRMb0EoyZishoCbg9Gw8a4G2CcXbppvxvleWxjv8HTb-0EGkmCRnrS0oILdsXK-8YdxgxDBS/s1600/Screenshot_10.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVy0u5_SlYJKPl_IUofBcbiTJSTwwFhSbRCCFFbSWAy28CZPrdUpViahOAzuo5IbegPdHXPRMb0EoyZishoCbg9Gw8a4G2CcXbppvxvleWxjv8HTb-0EGkmCRnrS0oILdsXK-8YdxgxDBS/s1600/Screenshot_10.jpg" width="233" /></a></div>
Setelah Anda melihat demo di atas, untuk menambahkan widget ini ke blog Anda ikuti langkah di bawah ini. 
 
Untuk menambahkan kode widget ini pergi ke Blogger → Tata Letak → Tambah
 Widget → HTML / JavaScript dan paste kode HTML/JavaScript dibawah ini.
 
<pre class="prettyprint linenums prettyprinted" data-codetype="HTML"><ol class="linenums">
<li class="L0"><link rel="stylesheet" type="text/css" href="http://blogger-json-experiment.googlecode.com/svn/resources/blogger-feed-rotator-plugin/default-style.min.css"/></li>
<li class="L1"><div id="slider-rotator" class="slider-rotator loading"></div></li>
<li class="L2"><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script></li>
<li class="L3"><script type="text/javascript" src="http://blogger-json-experiment.googlecode.com/svn/resources/blogger-feed-rotator-plugin/blogger-feed-rotator.min.js"></script></li>
<li class="L4"><script type="text/javascript"></li>
<li class="L5">makeSlider({url: "<strike>http://the-anarchyta.blogspot.com</strike>" // URL blog });</li>
<li class="L6"></script></li>
</ol>
</pre>
<div style="text-align: justify;">
<div class="anarchyta announce">
Catatan</div>
Ganti URL <strike>http://the-anarchyta.blogspot.com</strike> dengan URL yang Anda inginkan. 
Kemudian "Save" 
 
Sekian tutorial singkat ini, semoga menambah wawasan sobat lagi dan dapat berguna di kehidupan sobat. 
<h3>
Good Luck !!</h3>
</div>

Recent Posts Slider With Navigation

Setelah Anda melihat demo di atas, untuk menambahkan widget ini ke blog Anda ikuti langkah di bawah ini. Untuk menambahkan kode widget i...

Baca selengkapnya »

<div style="text-align: center;">
<img alt="Recent Comment Blogger Valid HTML5" src="http://1.bp.blogspot.com/-spJAI3C7i74/Ut_Bm-9EUYI/AAAAAAAAAZo/R3acSLMrofA/s1600/recent-comments-valid-html5.png" title="Recent Comment Blogger Valid HTML5" /></div>
 
Recent Comment Valid HTML5 - Kali ini kita akan membuat Widget Recent 
Comment, ini sudah saya kembangkan sehingga bisa menjadi valid html5, 
jadi jika sobat ingin memasang widget recent comment yang valid html5, 
artikel ini pas sekali untuk sobat blogger membacanya. 
Widget recent comment ini selain valid html5 juga dilengkapi dengan 
clickable area sehingga bukan hanya nama komentator saja yang bisa 
diklik, tetapi disekitar avatar, nama, dan isi komentar juga bisa 
diklik. 
Dibawah ini kode widget recent comment valid HTML5, dan jika anda 
tertarik memasangnya silahkan pasang di blog sobat masing-masing. :) 
 
Berikut kodenya : 
<pre class="prettyprint linenums prettyprinted" data-codetype="CSS"><ol class="linenums">
<li class="L0"><style type="text/css"></li>
<li class="L1">ul.anarchyta_recent {</li>
<li class="L2"> list-style: none;</li>
<li class="L3"> margin: 0;</li>
<li class="L4"> padding: 0;</li>
<li class="L5"> width: 310px;</li>
<li class="L6"> border-radius: 0 0 5px 5px;</li>
<li class="L7">}</li>
<li class="L8">.anarchyta_recent li {</li>
<li class="L9"> background: none !important;</li>
<li class="L0"> margin: 0 0 6px !important;</li>
<li class="L1"> padding: 3px !important;</li>
<li class="L2"> display: block;</li>
<li class="L3"> clear: both;</li>
<li class="L4"> overflow: hidden;</li>
<li class="L5"> list-style: none;</li>
<li class="L6"> border: 1px solid transparent;</li>
<li class="L7"> border-radius: 9px;</li>
<li class="L8"> max-height: 100px;</li>
<li class="L9">}</li>
<li class="L0">.anarchyta_recent li:hover {</li>
<li class="L1"> border: 1px solid #ddd;</li>
<li class="L2">}</li>
<li class="L3">.anarchyta_recent a {</li>
<li class="L4"> text-decoration: none;</li>
<li class="L5">}</li>
<li class="L6">.avatarImage {</li>
<li class="L7"> padding: 3px;</li>
<li class="L8"> background: #2c3e50;</li>
<li class="L9"> float: left;</li>
<li class="L0"> margin: 0 6px 0 0;</li>
<li class="L1"> position: relative;</li>
<li class="L2"> overflow: hidden;</li>
<li class="L3">}</li>
<li class="L4">.avatarRound {</li>
<li class="L5"> border-radius: 5px;</li>
<li class="L6"> width: 35px;</li>
<li class="L7"> height: 35px;</li>
<li class="L8">}</li>
<li class="L9">.anarchyta_recent li span {</li>
<li class="L0"> margin-top: 4px;</li>
<li class="L1"> display: block;</li>
<li class="L2"> font-size: 12px;</li>
<li class="L3"> line-height: 1.4;</li>
<li class="L4">}</li>
<li class="L5"></style></li>
</ol>
</pre>
<pre class="prettyprint linenums prettyprinted" data-codetype="JavaScript"><ol class="linenums">
<li class="L0"><script type="text/javascript"></li>
<li class="L1">//<![CDATA[</li>
<li class="L2"> var</li>
<li class="L3"> numComments = 5,</li>
<li class="L4"> showAvatar = true,</li>
<li class="L5"> avatarSize = 35,</li>
<li class="L6"> roundAvatar = true,</li>
<li class="L7"> characters = 40,</li>
<li class="L8"> defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",</li>
<li class="L9"> hideCredits = true;</li>
<li class="L0"> maxfeeds=50,</li>
<li class="L1"> adminBlog='Dian Anarchyta';</li>
<li class="L2">//]]></li>
<li class="L3"></script></li>
<li class="L4"><script type="text/javascript" src="http://yourjavascript.com/15353210224/dian-anarchyta-recent-comments.js"></script></li>
<li class="L5"><script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=anarchyta_recent&amp;&amp;max-results=50"></li>
<li class="L6"></script></li>
</ol>
</pre>
Copy semua kodenya, 
1. Login Ke Blogger Sobat 
2. Ke Tata Letak 
3. Tambah Gadget  (HTML/Javascript) 
4. Save 
Oke done! Dan lihat blogger sobat, Recent Comment Blogger Valid HTML5 
sobat sudah terpasang. Sekian dulu ya sobat, Jika ada kesalahan atau 
saran... Silahkan berkomentar dibawah artikel ini...

Recent Comment Blogger Valid HTML5

Recent Comment Valid HTML5 - Kali ini kita akan membuat Widget Recent Comment, ini sudah saya kembangkan sehingga bisa menjadi valid htm...

Baca selengkapnya »