PERTAMAX!! - Responsive HTML5 Blogger Template

Subhanallah, tidak terasa sudah ± 1 Minggu saya tidak membuat posting/berbagi ilmu dengan temen2 blogger. tapi jangan kecewa dulu sob, 1 minggu kemarin saya di sibukan dengan membuat template blog agar 100% responsive, dan alhamdulillah akhirnya karya "PERTAMA" saya lahir juga.

Mengapa saya beri nama template ini "PERTAMAX!!"?

hehe, karena ini memang karya pertama saya dalam membuat "Template Blogger Responsive - Valid HTML5" ..

Mungkin sebelumnya, ada yang ingin saya sampaikan untuk template ini. yaitu beberapa Point Plus-plus / Fitur pada template ini :

Responsive & FLAT Design Check Disini
SEO Friendly [ 100% ] Check Disini
Valid HTML5 [ Homepage ] Check Disini
Valid HTML5 [ Postingan ] Check Disini
List Grid Mode [ Postingan ] Lihat
Back To Top [ Widget] Lihat
Threaded Comment V3 [ Plugin ]
Emoticon Kaskus pada Komentar [ Plugin ]
Responsive Tooltip [ Plugin ]
Font Icon Awesome [ Plugin ]
Sticky [ Widget]
Quotes Footer [ Widget]
Recent Comment [ Widget - Visitor Friendly ]
dan masih banyak lagi ..

PERTAMAX!! - Responsive HTML5 Blogger Template

Lihat Demo Download Template

Template ini saya bagikan Gratiiis!!!. Sobat bisa menghilangkan Credit pada footer, dengan membayar Rp. 50.000,- melalui Paypal "kangrian14@gmail.com" / Transfer Bank.
(This template is absolutely free, you may remove credit link by sending me $5 USD through PayPal "kangrian14@gmail.com" / Transfer Bank ).

Donatur Pertamax!

Special thanks to Hady Eka Saputra

Instalasi Template :

Untuk pemasangan Template mengikuti Dummy yang ada berikut akan saya jelaskan di bawah ini :

Panduan Instalasi :

1. Install/Upload Template yang ada pada direktori /Themes/ di dalam file (.RAR) ke dalam Blog sobat.

2. Masuk ke menu/halaman Tata Letak, lalu edit semua widget yang ada dengan code / settingan yang sudah saya siapkan di bawah ini :

► Setting Widget Popular Post seperti screenshot di bawah ini :

► Setting Widget Sosial Media ( Sticky ) dengan menambahkan kode di bawah ini :

<div class="g-person" data-width="250" data-href="//plus.google.com/u/0/108034059941947835351" data-layout="landscape" data-rel="author"></div>
<a href="https://twitter.com/KangRian14" class="twitter-follow-button" data-show-count="true" data-lang="id">Follow @KangRian14</a>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fkangriandotcom&amp;width&amp;height=62&amp;colorscheme=light&amp;show_faces=false&amp;header=false&amp;stream=false&amp;show_border=false&amp;appId=169828266520120" style="border:0px!important; overflow:hidden; height:62px;width:100%;"></iframe>
<script>
//<![CDATA[
// Twitter Load
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
//]]>
</script>
<!-- Plaats deze tag na de laatste widget-tag. -->
<script type="text/javascript">
  window.___gcfg = {lang: 'id'};
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/platform.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>
<div class='clear'></div>

Konfigurasi Kode Sosial Media :
→ Ganti URL //plus.google.com/u/0/108034059941947835351 dengan URL Google Plus sobat.
→ Ganti Semua Text @KangRian14 dengan Username Twitter sobat.
→ Ganti Text kangriandotcom dengan Username Fanpage Facebook sobat.

► Setting widget Komentar Terbaru dengan menambahkan kode di bawah ini :

<script type="text/javascript">
//<![CDATA[
    var
 numComments  = 100,
 showAvatar  = true,
 avatarSize  = 40,
 roundAvatar = true,
 characters  = 45,
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
 hideCredits = true;
 maxfeeds=500,
 adminBlog='YOUR NAME';
//]]>
</script>
<script type="text/javascript" src="https://googledrive.com/host/0B7H_GQEvKCj1cUVkYy1jbXpqZW8/recent-comments.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=kangrian_recent_comment&amp;&amp;max-results=100">
</script>

Konfigurasi kode "Komentar Terbaru" :
→ Rubah text YOUR NAME dengan nama sobat agar tidak muncul pada widget komentar terbaru.

► Setting/Edit widget Kategori menjadi seperti screenshot di bawah ini :

dan yang terakhir,
► Setting/Edit widget Kutipan, dengan menambahkan kode di bawah ini :

<div class='kutipan'>
<blockquote>Saya pikir semua orang harus belajar coding,
Karena coding mengajarkan anda berpikir.<br/>
<cite>&ndash; Steve Jobs, pendiri Apple.</cite></blockquote>
<blockquote>Kebijaksanaan di Facebook adalah meng-hire coder berkualitas sebanyak mungkin. Tapi pasar saat ini tidak menyediakan stock yang cukup..<br/>
<cite>&ndash; Mark Zuckerberg, pendiri Facebook.</cite></blockquote>
<blockquote>Anda tidak harus menjadi jenius untuk bisa coding. Pertambahan, pengurangan... itu sudah cukup!.<br/>
<cite>&ndash; Bill Gates, pendiri Microsoft.</cite></blockquote>
<blockquote>Coders yang hebat adalah rock star masa kini! Titik!.<br/>
<cite>&ndash; Will.i.am, anggota Black Eyed Peas.</cite></blockquote>
</div>

Untuk membuat blog agar tetap valid HTML5, pastikan setiap menambahkan widget baru, langsung hapus kode di bawah ini pada Template -> Edit HTML

<b:include name='quickedit'/>

Semoga template ini bermanfaat untuk semua Blogger yang ingin memiliki Blog valid HTML5 dan Responsive Design tentunya, dan saya sangat berharap masukan untuk template ini, silahkan curahkan pada kotak komentar di bawah ini. Terima kasih.

Silahkan untuk sahabat yang ingin membagikan ulang template ini, jika template ini bermanfaat dan jangan sungkan2 untuk berbagi.

Salam Blogger,
A.K.A Kang Rian ®

REVIEW: QWORDS DOT COM - Penjual Domain & Hosting terbaik di Indonesia!