Template Simple Dan Cukup Ringan

SHADOWS || Hadeuhh... mata belum ngantuk sob, iseng lihat lihat blog tetangga ehh.. ada yang bisa di share nih. Ya sudah langsung saja saya share sob buat nambah nambahin postingan saja sih lumayankan sob. Ini dia sob Sebuah Template Simple Dan Cukup Rimgan, hasil buah karya dari MASKOLIS homepagenya manis sob cieeee.. gula xxxx.... hehehee... Ok lihat sob screenshot di bawah ini.

Template Simple Dan Cukup Ringan

Nah mantapkan sob bentuk homepage template Johny Ganteng Banget ini, pada Bentuk Sebuah Template Simple Dan Cukup Ringan dalam katagorie Cool ( ini menurut saya loh ). Pada template ini tidak banyak fitur yang bisa di ulas tetapi sobat hanya ada dua fitur yang harus diperhatikan.

1. Reply Comment
Untuk mengaktifkan fungsi reply pada komantar pada template ini, ganti Blog ID pada template ini pada Edit HTML (jangan lupa centang expand widget template) : 149656394876047094 setelah ketemu ganti dengan blog ID anda.


2. Recent Post
   Terdapat pada sidebar kanan paling atas, cara pasanganya, masuk ke Layout kemudian pilih
   HTML/Javascript kemudian masukkan kode berikut ini ke dalamnya :


 

NB:
UNTUK PARA SOBAT YANG INGIN TERAPKAN ATAU MEMAKAI TEMPLATE INI DI PERSILAHKAN, TETAPI SOBAT HARUS INGAT...!!! JANGAN HILANGKAN KREDIT LINK DI BAWAH SEBELAH KANAN, HARGAILAH HASIL KARYA SESEORANG, JIKA SOBAT INGIN DI HARGAI, SEBELUMNYA BELAJARLAH HARGAI ORANG LAIN DAHULU TERIMAKSAIH....Sumber article original : http://www.mastemplate.com/2012/08/johny-ganteng-banget.html

Template Cara Gampang Modifikasi

SHADOWS || Nah.. kita bertemu lagi nie sob di pagi hari hehehe... bagaimana sudah ngopi apa belum..?? Paling enak buka blog sambil ngopi sob, mantap banget sambil baca/liat" blog agan xixixixi...weee.. apa yang mau di share nie ngoceh mulu.. wkwkwk.. iya nie saya akan shere hasil modifikasi sahabatnya MASKOLIS yaitu mas AA SHOLAH beliau telah memodifikasi template JOHNY WUZZ hasil karya dari MASKOLIS itu.. jrenngg.. hasilnya cukup cantik dan sangat pas untuk template berita sob sungguh muantapp...Nama template yang telah beliau share itu adalah CARA GAMPANG MANGAZINE. Mau lihat ok sob saya akan share ya nie lihat dibawah ini:

Template Cara Gampang Modifikasi


Nah itu sob Bagaimana Template Cara Gampang Modifikasi beliau keren bukan..!!

Untuk pengisian slider sobat bisa menggantinya dengan cara:
Layout/Tata Letak, klik Add a Gadget >> HTML/Javascript : Lihat kolom yang berada diatas Blog Post, nah klik edit lihat bawah ini :
<div class='lof-main-wapper' id='slider'>
<div class='slider-main-outer'>
<ul class='slider-main-wapper'>
<script>                   
document.write("<script src=\"/feeds/posts/default/-/Article?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
</script>
</ul>
</div>
<div class='slider-navigator-outer'>
<ul class='slider-navigator'>
<script>                   
document.write("<script src=\"/feeds/posts/default/-/Article?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script>
</ul>
</div>
</div>
<script type='text/javascript'>
jQuery(document).ready(function($){   
    $('#slider').lofJSidernews({
        interval:6000,
        duration:800,
        mainWidth: 405,
        navigatorWidth: 200,
        maxItemDisplay:5,
        easing:'easeInOutQuad',
        auto:true,
        isPreloaded: false
    });
});   
</script>




Keterangan :
Tulisan warna merah (Article) adalah label yang saya masukkan pada slider. Silahkan diganti dengan label yang ingin ditampilkan.

Untuk memaasang Slider Carousel tinggal cari kode

label1 = "News";

Ganti "News" dengan kategori atau label yg ingin ditampilkan

Lalu save template, selesai sudah Untuk Bagaimana Template Cara Gampang Modifikasi yang saya share di pagi ini semoga bermanfaat bagi sobat semua... happy blogging.

NB:
UNTUK PARA SOBAT YANG INGIN TERAPKAN ATAU MEMAKAI TEMPLATE INI DI PERSILAHKAN, TETAPI SOBAT HARUS INGAT...!!! JANGAN HILANGKAN KREDIT LINK DI BAWAH SEBELAH KANAN, HARGAILAH HASIL KARYA SESEORANG, JIKA SOBAT INGIN DI HARGAI, SEBELUMNYA BELAJARLAH HARGAI ORANG LAIN DAHULU TERIMAKSAIH....

Sumber article original : http://www.maskolis.com/2013/02/cara-gampang-modifikasi-template.html

Template Hitam Yang Menawan

SHADOWS || Malam ini menuju pagi mata belum juga mengantuk, dari pada bengong mendingan posting heheehe.... Nah saya share lagi nie, lagi lagi sebuah template tetapi Template Hitam Yang Menawan ini berbeda sob, kenapa saya bisa bilang berbeda...!!! ya itu ini template di khususkan untuk koleksi film atau video. Mau tau Bagaimana Template Hitam Yang Menawan yang saya share di pagi ini. Oh ya template ini ada namanya sob yaitu Johny Movie Prett antik juga namanya ya sob, nah ini hasil karya dari seorang pembuat template yang tidak asing lagi yaitu MASKOLIS. Yang bagi saya beliau adalah guru yang budiman. ok ke TKP sob.

Template Hitam Yang Menawan


Template ini hasil penggabungan dua template yaitu johny tampan dan johny jijay, ini keterangan dari beliau ( bukan saya lho ). Yang di buat khusus untuk koleksi film.

Cara pasang slider:

Untuk mengaktifkan slider yang ada di homepage pada template ini, masukkan kode berikut pada kolom kosong paanjang di bawah header. Masuk ke Layout/Tata Letak >> Add a Gadget pilih HTML/Javascript :

<div class='lof-main-wapper' id='slider'>
<div class='slider-main-outer'>
<ul class='slider-main-wapper'>
<script>                  
document.write("<script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
</script>
</ul>
</div>
<div class='slider-navigator-outer'>
<ul class='slider-navigator'>
<script>                  
document.write("<script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts0\"><\/script>");
</script>
</ul>
</div>
</div>
Cara pasanag widget tab kategori :

Pertama, untuk merubah judul tab (Adventure, Action, Bike Game dan seterusnya) cari kode berikut ini di Edit HTML:

Title1="Adventure";Title2="Action";Title3="Bike Game";Title4="Dress-Up";Title5="Strategy";Title6="Sport Game"


Setelah ketemu ganti tulisan warna biru diatas dengan judul yang ingin Anda tampilkan pada tab view widget kategori.

Kedua, untuk mengisi widget tab view dengan label yang ingin Anda pasang disitu, cari kode berikut pada Edit HTML (jangan lupa centang expand widget templates) :

<div class='tab-wrapper'>
<div class='tabber' id='tab1'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/comedy?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab2'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/jazz?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab3'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/comedy?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab4'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/jazz?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab5'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/comedy?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab6'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/jazz?max-results=&quot;+numposts2+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts1\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='clear'/>
</div></div>
Ganti semua tulisan warna merah pada kode diatas, dengan label yang ingin Anda tampilkan.

Nah lalu save template.


NB:
UNTUK PARA SOBAT YANG INGIN TERAPKAN ATAU MEMAKAI TEMPLATE INI DI PERSILAHKAN, TETAPI SOBAT HARUS INGAT...!!! JANGAN HILANGKAN KREDIT LINK DI BAWAH SEBELAH KANAN, HARGAILAH HASIL KARYA SESEORANG, JIKA SOBAT INGIN DI HARGAI, SEBELUMNYA BELAJARLAH HARGAI ORANG LAIN DAHULU TERIMAKSAIH....


Sumber artikel original : http://www.maskolis.com/2013/03/artikel-lanjutan-yang-kemarin.html

Template Dua kolom Dengan Slider

SHADOWS || Pagi sob..... Kali ini saya akan share sebuah template yang saya lihat cukup simple tetapi menawan. Template Dua Kolom Dengan Slider, saya rasa para sobat tentunya banyak memakai templet 2 kolom tetapi coba perhatikan ini ada perbedaan sedikit di bawah slider ada sample page untuk para sobat gunakan. Kadangkala sample page ini berguna jika kita mempunya beberapa template.
Nah marilah kita lihat demonya dari Bukan johny template disini.


Template Dua kolom Dengan Slider

Slider 
Masukkan kode berikut pada kolom kosong di bawah header. Masuk ke Layout/Tata Letak >> Add a Gadget pilih HTML/Javascript :

<div class='lof-main-wapper' id='slider'>
<div class='slider-main-outer'>
<ul class='slider-main-wapper'>
<script>                   
document.write("<script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
</script>
</ul>
</div>
<div class='slider-navigator-outer'>
<ul class='slider-navigator'>
<script>                   
document.write("<script src=\"/feeds/posts/default?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script>
</ul>
</div>
</div>

Kode diatas bekerja berdasarkan postingan terbaru.

Widget Komentar
Masukkan kode di bawah ini pada widget sidebar :

<style type="text/css">
ul.tb_recent_comments{list-style:none;margin:0;padding:0;}
.tb_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.tb_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
numComments  = 5,
showAvatar  = true,
avatarSize  = 30,
characters  = 60,
hideCredits = true;
//]]>
</script>

Ganti URL warna merah http://shadows-k.blogspot.com dengan URL blog Anda.

Widget random post

<script type="text/javascript">
    var randarray = new Array();var l=0;var flag;
    var numofpost=7;function randomposts(json){
    var total = parseInt(json.feed.openSearch$totalResults.$t,10);
    for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
    if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
    for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
    for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
    document.write(item);}}
    }document.write('</ul>');}
    </script>
    <script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

 Angka 7 pada kode diatas adalah jumlah random post yang ditampilkan, silahkan ganti sesuai keinginan.

Nah itulah Cara Template Dua Kolom Dengan Slider yang telah sobat lihat berikut tutorial yang ada di template, semoga bermanfaat bagi sobat semua.

NB:
UNTUK PARA SOBAT YANG INGIN TERAPKAN ATAU MEMAKAI TEMPLATE INI DI PERSILAHKAN, TETAPI SOBAT HARUS INGAT...!!! JANGAN HILANGKAN KREDIT LINK DI BAWAH SEBELAH KANAN, HARGAILAH HASIL KARYA SESEORANG, JIKA SOBAT INGIN DI HARGAI, SEBELUMNYA BELAJARLAH HARGAI ORANG LAIN DAHULU TERIMAKSAIH....


Sumber artikel original : http://www.maskolis.com/2013/02/inilah-template-blogger-super-jelek.html

Template SEO Friendly Dan Kriteria Cepat

SHADOWS || Tampaknya pagi ini cerah ya sob, moga saja sampai siang nanti gak panas. Sob ini saya akan share satu template yang kriteria cepat, Template SEO Friendly Valid HTML 5 Dan Kriteria Cepat.
Tetapi sangat sederhana yang sudah saya terapkan di blog ini, sobat tinggal edit di beberapa tempat sesuka hati sobat. Agar lebih tampak keren tentunya ya gak sob, ngomong terus dari tadi kapan sharenya heheheehe..!! ok de coba sobat lihat dan test di demo yang sobat lihat, nah cek loadnya bagaimana?? Tenang sobat jangan risau sobat tinggal masuk ke homepage blog ini lihat di menu bar... pasti wusss loadingnya, namanya saja sudah JOHNY WUSS, mantapkan sob..!! Ini demonya ok wusss liaht bawah.

Template SEO Friendly Dan Kriteria Cepat


FITUR:

           1. Simple template blogger with elegant look
           2. Auto readmore without javascript
           3. Fast loading
           4. Stylish threaded comment
           5. SEO friendly and visitor friendly
           6. Sidebar toggle hide and show
           7. Navigation menu dropdown
           8. Ads ready and many more

Untuk mengganti Feedburner yang ada di bawah setiap postingan, cari kode ini di Edit HTML (jangan lupa centang Expand Widget Templates) :

<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=JohnyTemplate&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='JohnyTemplate'/>
<input name='loc' type='hidden' value='en_US'/>
<input id='botsub' 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 id='botsubbutton' type='submit' value='Submit'/><br/>
<small>Your information will not be shared. Ever.</small><br/>
</form>

Tulisan warna merah diatas adalah ID feedburner dari demo template, silahkan Anda ganti dengan ID feeburner blog Anda.

Itu tadi artikel Tentang Template SEO Friendly Dan Kriteria Cepat yang saya bagikan pada pagi ini, jika Anda berminat silahkan dipakai dan jika ada yang kurang jelas silahkan masuk KESINI


Bukti Template ini SEO:



Lihat hasil pencarian di google search untuk blog ini yang memakai JOHNY WUSSS.

1. Pada kotak merah bagian atas memang page/ halaman yang ke 2, tetapi sobat lihat lagi total hasil pencarian ada berapa..?? yupzz.. senilai 77.100.000 per 18 detik hasil pencarian google, nilai itu kita bersaing dengan perbandingan 1 : 77.100.00, sakti bukan blog ini hehehe...

2. Pada kotak merah yang bawah itu adalah blog saya yang sekarang sobat gunakan, ini adalah suatu bukti bahwa si pembuat template itu sungguh sakti. beliau adalah bernama MASKOLIS, sebetulnya saya sendiripun merasa kaget dan terkejut tidak habis pikir. Untuk nama blog saya rasa tidak unik atau terkesan aneh di mata google, kenapa saya bisa bilang begitu. lha wong yang memakai nama SHADOWS-K 77 juta mau bagaimana unik atau aneh. Jadi saya mengambil kesimpulan jatuh pada templatenya ini yang bisa mendongkrak untuk mencapai senilai itu.

3. Masih ada satu lagi yang belum lengkap di blog ini lihat saja di bagian menu masih banyak yang belum terisi hehehe... maklum jarang posting sih.. tapi sudah dapat kenaikan kelas wkwkwk.... nah sobat boleh cek juga blog ini, blog ini bersaing dengan ID berbayar misal, COM, NET, ORG, yang saya sudah cek sampai 25 halaman dan nama web papan atas semua cek saja agar lebih yakinkan sobat. ( maksud saya yang memakai blogspot hanya saya seorang ibarat saya nyempil sendirian sama orang orang kaya wkwkwkw )

4. Ini tambahan kali ya, pada page/halaman ke 9 itu postingan saya ada hadir di page/halaman 9  sebanyak 7 postingan.

NB:
UNTUK PARA SOBAT YANG INGIN TERAPKAN ATAU MEMAKAI TEMPLATE INI DI PERSILAHKAN, TETAPI SOBAT HARUS INGAT...!!! JANGAN HILANGKAN KREDIT LINK DI BAWAH SEBELAH KANAN, HARGAILAH HASIL KARYA SESEORANG, JIKA SOBAT INGIN DI HARGAI, SEBELUMNYA BELAJARLAH HARGAI ORANG LAIN DAHULU TERIMAKSAIH....


Sumber artikel original: http://www.maskolis.com/2013/01/inilah-template-johny-seo-dan-cepat.html

Template Responsive Dan Bukan Responsive

SHADOWS || Selamat siang sobat blogger bagaimana siang ini semoga lancar ya sob.. Nah saya akan share 2 Template Responsive Dan Bukan Responsive untuk sobat ketahui atau untuk di gunakan ke blog sobat secara gratis. Karena si pembuat template ini orangnya sangat dermawan sekali, jika kita katagorikan template hasil karya beliau sudah mencapai tingkat premium atau berbayar. Tetapi beliau bagikan secara gratis mau tahu siapa beliau itu, nah beliau bernama MASKOLIS .Nota bene saya sudah banyak belajar apa arti dari sebuah template dan cara cara mengedit template yang sudah kita terapkan di blog kita, biarpun kadangkala menemui kendala beliau secara spontan akan menyelesaikan kendala kita. Disinilah letak kedermawanan beliau, lha jadi mengenang saat baru ngeblog sampai bisa ngeblog dan sedikit dikit edit kapan sharenya ya.. xixixixi... Ok sobat kita menuju TKP, Bagaimana Template Responsive Dan Bukan Responsive ini

Template responsive:


Template Responsive Dan Bukan Responsive

Template Responsive Dan Bukan Responsive 1

Template bukan responsive :



Untuk edit feedburner perhatikan code dibawah ini: di edit HTML (jangan lupa centang Expand Widget Templates) :

<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=JohnyTemplate&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='JohnyTemplate'/>
<input name='loc' type='hidden' value='en_US'/>
<input id='botsub' 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 id='botsubbutton' type='submit' value='Submit'/><br/>
<small>Your information will not be shared. Ever.</small><br/>
</form>

Tulisan warna merah diatas adalah ID feedburner dari demo template, silahkan Anda ganti dengan ID feeburner blog Anda.

Untuk memasukan label kedalam slider, masuk ke setting >> tata letak >> cari html/javascript yg berada tepat di atas post edit >> lalu klik edit.



<div class='lof-main-wapper' id='slider'>

<div class='slider-main-outer'>

<ul class='slider-main-wapper'>

<script>                    

document.write("<script src=\"/feeds/posts/default/-/misteri?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");

</script>

</ul>

</div>
<div class='slider-navigator-outer'>
<ul class='slider-navigator'>
<script>                    
document.write("<script src=\"/feeds/posts/default/-/misteri?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script>
</ul>
</div>
</div>
<script type='text/javascript'>
jQuery(document).ready(function($){    
    $('#slider').lofJSidernews({
        interval:6000,
        duration:800,
        mainWidth: 405,
        navigatorWidth: 200,
        maxItemDisplay:5,
        easing:'easeInOutQuad',
        auto:true,
        isPreloaded: false
    });
});    
</script>

Keterangan :
Tulisan warna merah (misteri) adalah label yang saya masukkan pada slider. Silahkan diganti dengan label yang ingin ditampilkan.

Terakhir save template


Penting untuk diperhatikan :
Bagi pengguna template responsif, jika ingin tampil maksimal perhatikan point-pont berikut ini :

1. Upload sendiri gambar waktu buat postingan, jangan disimpan di host selain blogger apalagi copy URL   gambar dari blog lain.
2. Hapus kode merah di gambar pada posisi HTML (bukan compose), contohnya seperti ini :
<a href="http://3.bp.blogspot.com/-bAQdx6nQnzw/URvWyTPiuYI/AAAAAAAAJ6A/qOLgDGkrnZI/s1600/Johny+Darkmag.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/-bAQdx6nQnzw/URvWyTPiuYI/AAAAAAAAJ6A/qOLgDGkrnZI/s1600/Johny+Darkmag.jpg" /></a>

NB: Hanya pesan saya untuk para sobat tolong jangan hilangkan kredit link yg berada di sebelah kanan paling bawah, hargailah hasil karya seseorang.

Nah sudah selesai Template Responsive Dan Bukan Responsive yang saya share ini untuk para sobat.. happy blogging.

Sumber artikel : http://www.maskolis.com/2013/02/template-responsif-dan-bukan-responsif.html