Tampilkan postingan dengan label Tutorial Blogspot. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial Blogspot. Tampilkan semua postingan

08/07/13

Cara Membuat Random Post di Blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

assaalamualaikum.wr.wb. kali ini saya akan share tentang cara membuat random post. Keggunaan random post adalah menampilkan post secara acak baik posting baru atau posting lama. Keuntungan dari random post posting lama kita akan ditampilkan di tempat widget random post itu berada jadi posting lama kita tidak akan basi. Berikut cara memasang random post diblog :
1. Seperti biasa, anda login akun blog anda
2. Klik  tata letak > Tambahkan Gadget > Pilih HTML/Java Script
3. Copy Script dibawah ini
<script type="text/javascript">
var randarray = new Array();var l=0;var flag;
var numofpost=10;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><div style="text-align: center;"><span style="font-size: 0px;"><span style="font-family: &quot;Trebuchet MS&quot;,sans-serif;">Supported???<a href="http://www.thecyberbatik.blogspot.com/" target="_blank">CyberBatIQ</a></span></span></div>
4. Simpan widget dan simpan template blog anda
NB : tulisan warna merah adalah jumlah post yang ditampilkan jadi anda bisa mengubah sesuka kalian

Seikian post tentang Cara Membuat Random Post di Blog semoga bermanfaat
[ Baca Selengkapnya...]

04/07/13

Cara Membuat Scroll Di Komentar Blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

assalamualaikum.wr.wb setelah kemarin saya share tentang 2 Cara Mengetahui Harga Jual Blog kali ini saya akan share artikel tentang Cara Membuat Scroll Di Komentar Blog. Kelebihan dari Scroll komentar adalah dapat menghemat tempat dan dapat mempercepat loading blog :D langsung aja  tanpa basa-basi lagi cara nya dibawah ini :
1. Login Blog anda
2. Kemudian klik template
3. Lalu klik edit html
4. Cari kode berikut, untuk mempermudah pencarian gunakan CTRL+F/F3
#comments-block{
jika kodenya sudah berhasil ditemukan hapus kode tersebuat lalu ganti kode dibawah ini :
#comments-block{max-height:300px;border:1px solid#F7D77;overflow:auto;width:569px;margin:1em 0 1.5em;line-height:1.6em}
lalu simpan.

NB: 300px adalah ukuran tinggi scroll yg akan digunakan, angak tersebuat bisa anda ganti dengan yang anda inginkan

Sekian post yg saya berikan terima kasih :)
[ Baca Selengkapnya...]

01/07/13

2 Cara mengetahui harga jual blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Assalamualaikum.wr.wb. setelah kemarin saya membuat artikel Cara mengubah scroll pada blog kali ini saya akan membuat artikel tentang 2 cara mengetahui harga jual blog. Tahukah anda bahwa blog atau website  anda mempunyai harga jual. Meskipun tidak ada yg mau mebeli blog anda atau anda tidak menjual nya tetapi apa salah nya jika anda mengetahui harga jual blog anda. langsung aja tanpa basa basi ikuti petunjuk dibawah ini :

1. Cara Mengetahui Harga Jual Blog

  • Buka situs ini Disini
  • Masukan url yg ingin anda ketahui harga jualnya
  • Lalu klik calculate

2. Cara Mengetahui Harga Jual Blog
  • Buka situs ini Disini
  • Masukan URL sobat
  • Lalu klik Check
Cara ini selain menampilkan harga blog, anda juga bisa melihat SEO score dari blog yg anda lihat. ya sekian saja posting hari ini semoga bermanfaat untuk anda :D
[ Baca Selengkapnya...]

30/06/13

Cara mengubah scroll pada blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

pada posting kali ini saya akan trik mempercantik blog dengan cara mengubah scroll pada blog. berikut triknya dibawah ini cekidot :

1. Login Blogger
2. Kemudian pilih template
3. Klik edit HTML
4. cari kode berikut ]]><b:skin>, untuk mempermudah pencarian gunakan CTRL+F atau F3
5. Jika sudah ketemu copy kode dibawah ini dan letakan tepat diatas kode ]]><b:skin>

::-webkit-scrollbar {
height:12px;
width: 12px;
background: #000000;
}
::-webkit-scrollbar-thumb {
background-color: #dae209;
-moz-border-radius: 10px; 
border-radius: 10px;
NB: kode #000000 adalah kode warna background nya
       kode #dae209 adalah warna scrollnya
       kode #000000 dan #dae209 dapat diganti sesuai keinginan anda
       jika ingin melihat kode warna Disini

sekian post saya tentang cara mengubah scroll pada blog semoga bermanfaat
[ Baca Selengkapnya...]

26/06/13

Cara membuat link new tab otomatis diblog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

assalamualaikum.wr.wb kali ini saya ingin berbagi trick cara membuat link new tab otomatis, manfaat trik ini adalah
  • mengurangi adanya/datangnya Bounce Rate
  • Menambah pageview dan visitor
  • SEO
  • dapat merampingkan alexa
Berikut caranya dibawah ini :
  1. Masuk ketemplate blog sobat
  2. Edit HTML
  3. Cari kode </head> untuk memudah kan pencarian anda tekan CTRL+F
  4. letakkan kode dibawah ini diatas kode </head>
  5. Simpan
<base target ="_blank "/>

Semoga bermanfaat

[ Baca Selengkapnya...]

24/06/13

3 Situs cek kecepatan loading blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Kali ini kita akan berbicara mengenai kecepatan/performa suatu blog, yah karena performa blog sangat menentukan trafik dari blog tersebut. Sebelum melakukan optimasi terhadap performa blog kita tentu kita harus mengetahui terlebih dahulu berapa besarkah performa kecepatan loading blog kita. Nah sekarang ayo kita cek dengan tiga buah situs yang sering saya gunakan untuk mengecek kecepatan loading blog agar mudah untuk dioptimasi.

Mungkin 3 Situs ini sudah sangat familiar bagi para webmaster

1. PageSpeed Insight From Google










Link : Disini

Ini adalah tool besutan google yang dapat mengukur seberapa besar performa blog kita. Dengan tool ini kita bisa meneliti masalah-masalah apa saja yang mempengaruhi performa kecepatan blog kita, mulai dari High Priority sampai Low Priority, selain itu tool ini juga menyediakan fitur Experimental Rules yaitu kamu akan diberikan masukan-masukkan yang berguna untuk meningkatkan kecepatan loading blog kamu

2. Website Speed and Performance Optimization by GTmetrix









Link : Disini


Ini tool dari GTmetrix, fungsinya sama saja seperti PageSpeed Insight, melalui tool ini kita bisa melihat lamanya waktu blog kita untuk dimuat 100%, ukuran halaman blog kita (dalam kb), serta total request ketika blog kita diakses. Situs ini juga memberi masukan / saran untuk meningkatkan performa blog kita, tapi sayangnya kalau sobat tidak mendaftar menjadi pro member maka akan diberi batasan dalam menggunakan situs ini, yaitu hanya boleh 20 kali test dalam sehari.

3. Pingdom Tools by Pingdom











Link : Disini

Tool ini fungsinya sama saja seperti GTmetrix, hanya saja di pingdom kita tidak diberi batasan mengetest speed blog dalam satu harinya tidak seperti di GTmetrix yang hanya boleh 20 kali dalam sehari. Dan fitur khusus pingdom ini kita bisa memilih mau mengetest menggunakan server Amsterdam, Dallas, atau New York.

Baiklah mungkin itu saja review tentang 3 Situs Cek Kecepatan Loading Blog kali ini, Semoga Bermanfaat.

Sumber




[ Baca Selengkapnya...]

18/06/13

4 Kelebihan & kekurangan Blog Dofollow

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Blog Dofollow adalah blog yang apabila kita berkomentar pada blog tersebut menggunakan Name/URL, maka link komentar tersebut akan di telusuri oleh mesin pencari google. Sehingga kita bisa mendapatkan sebuah backlink dari blog tersebut.

Kelebihan blog Dofollow :
  • Lonjakan traffic berlipat ganda dan luar biasa.
  • Blog dofollow lebih populer dari pada saat beraliran nofollow.
  • Lebih banyak yang follow dan berlangganan artikel blog yang beraliran dofollow
  • Meskipun jarang update pengunjung blog tetap stabil
Kekurangan Blog Dofollow :
  • Banyak Komentar SPAM yang masuk
  • Page rank blog kita mudah menurun karena antara link keluar dan link masuk tidak seimbang
  • Tidak disukai google karena banyka mengeluarkan link keluar pada komentar blog
  • Susah mendapatkan page rank dari google karena blog beraliran ini kurang di sukai oleh seaarch engine.

Sekian Post yg saya berikan semoga bermanfaat
[ Baca Selengkapnya...]

17/06/13

4 Kelebihan & kekurangan Blog Nofollow

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

assalamualaikum.wr.wb
Blog Nofollow adalah blog yang apabila kita menaruh link atau berkomentar pada blog tersebut, link itu tidak akan di telusuri oleh mesin pencari. Sehingga kita tidak akan mendapatkan backlink dari blog tersebut.
Kelebihan blog Nofollow :
- Lebih disukai dan diminati Google dalam hal SEO
- Spam komentar lebih minimal
- Tidak banyak dianggap sebagai junkblog oleh google
- Aman dari Spammer

Kekurangan blog Nofollow
- Jumlah komentar pada artikel kita tergantung dari kualitas artikel kita karena blog nofollow cenderung sedikit dalam hal komentar
- Peningkatan Page Rank yang kurang cepat
- Pengunjung blog tidak seramai blog dofollow
- Blog tidak akan setenar dofollow
[ Baca Selengkapnya...]

28/05/13

Menghapus link hidup dikomentar otomatis

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Assalamualaikum.wr.wb. Kali ini saya akan berbagi tips cara menghapus link hidup di kotak komentar. kenapa adanya script ini..? karna link hidup itu hanya membawa spam kepada blog kita. dan karna itu di adakannya script ini untuk memudahkan menghapus link hidup yang ada di kotak komentar agan. jadi agan tidak susah lagi menghapus komentar yang terdapat link hidup di dalamnya.. ya kan..? tanpa basa basi ni cara nya :

1. Masuk ke blog
2. Masuk template
3. Kemudian tekan CTRL+F untuk memudahkan pencarian
4. Cari kode ini  </head>
5. Copy kode dibawah ini lalu paste diatas kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js' type='text/javascript'> </script>
<script type='text/javascript'>
$(function() {
$('#comments p').find('a').remove();
});
</script>
6. lalu simpan template

Sekian post yg saya berikan semoga bermanfaat

[ Baca Selengkapnya...]

19/05/13

5 cara mempercepat loading blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم


assalamualaikum.wr.wb. udah lama saya ga ngepost ni kali ini saya akan post tentang cara mempercepat loading blog. Anda pernah merasa loading blog anda lama atau sangat lama? Apakah rugi jika sebuah blog berat? Rugi. Biasanya pengunjung benci dengan yang namanya LOADING . seseorang mungkin sedang dalam Koneksi yang tidak baik sehingga untuk membuka website yang amat berat sangat dihindari dan mungkin berakibat tidak jadinya mengunjungi blog kita yang berat. Kita sebagai blogger harus memanjakan visitor, karena visitor lah yang membuat website kita tumbuh. Seperti Pelayan dan Pelanggan. Langsung aja tanpa basa basi lagi di simak caranya dibawah ini :

  • Menggunakan Script lazy load
fungsi dari script lazy load ini adalah mempercepat loading gambar pada blog. 
banyak yang berhasil menggunakan script ini namun tidak banyak juga hasil yang didapat malah tambah lama loadingnya, jadi jika setelah memasang script ini loading blog tambah buruk silakan di hapus script ini
Berikut cara memasang nya

1. Login Blogger
2. pilih template >>> edit html
3. cari kode </head> untuk mempermudah pencarian gunakan CTRL+F
4. copas script dibawah ini
<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://k-blogger.googlecode.com/files/easy-loading.js' type='text/javascript'/>
<script charset='utf-8' type='text/javascript'>
$(function() {
$(&quot;img&quot;).lazyload({placeholder : &quot;http://bit.ly/Qv60g5&quot;,threshold : 200});
});
</script>
  • Cara ke-2 gunakan auto read more
tulisan panjang dan juga penuh pada homepage adalah salah satu alasan terbesar mengapa blog sobat memiliki waktu lama saat loading. untuk itu gunakanlah read more,untuk tutorialnya bisa lihat postingan saya sebelumnya Disini

  • cara ketiga tampilkan 3-5 posting saja pada homepage
Untuk lebih baiknya jangan menampilkan lebih dari 5 posting di homepage, karena akan memakan banyak waktu untuk loading
  • Cara ke-4 Pilih template yang ringan
Pilih template yang ringan karena template sangat berpengaruh pada loading blog

  • cara ke-5 kompres html blog
kompreslah html blog anda karena sangat berpengaruh pada loadung blog

Sekian tips yang dapat saya berikan semoga bermanfaat






[ Baca Selengkapnya...]

02/05/13

Cara membuat read more otomatis

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

assalamualaikum.wr.wb. Pada kesempatan kali ini saya akan memberikan script read more otomatis. Mungkin anda belum memakai read more atau pernah mencoba namun gagal? kali ini saya akan memberikan 2 script read more otomatis jika cara ke-1 gagal gunakan cara ke-2. Kelebihan read more otomatis :

-Simple
-Setiap post yang di publish akan langsung dipotong dengan tombol Read more
- Mempercepat loading blog

Berikut cara membuat read more otomatis Pertama :

  • Login ke blogger
  • Klik Menu Template
  • Pilih Edit HTML
  • Lalu cari kode </head> : ( untuk mempermudah pencarian Gunakan CTRL + F )
  • Lalu masukkan Script di bawah ini tepat di atas </head>
<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script type='text/javascript'> //<![CDATA[ function removeHtmlTag(strx,chop){ if(strx.indexOf("<")!=-1) { var s = strx.split("<"); for(var i=0;i<s.length;i++){ if(s[i].indexOf(">")!=-1){ s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length); } } strx = s.join(""); } chop = (chop < strx.length-1) ? chop : strx.length-2; while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++; strx = strx.substring(0,chop-1); return strx+'...'; } function createSummaryAndThumb(pID){ var div = document.getElementById(pID); var imgtag = ""; var img = div.getElementsByTagName("img"); var summ = summary_noimg; if(img.length>=1) { imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>'; summ = summary_img; } var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>'; div.innerHTML = summary; } //]]> </script>
  • Kemudian cari Script <data:post.body/> lalu Ganti script <data:post.body/> dengan script di bawah ini : 

<b:if cond='data:blog.pageType != &quot;item&quot;'> <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;); </script> <span class='rmlink' style='float:right;padding-top:20px;'> <a expr:href='data:post.url'> <b> Readmore</b> &#187;&#187;&#160;&#160; <data:post.title/></a> </span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/> </b:if>
  • Kemudian save template selesai, jika cara diatas tidak berhasil gunakan cara ke-2
Cara kedua sebenarnya hampir mirip dengan cara yang diatas tinggal mengganti script diatas </head> dengan script ini

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 450; summary_img = 350; img_thumb_height = 100; img_thumb_width = 120; </script>
 <script src='http://readmore-otomatis-js.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>

  • Lalu ganti <data:post.body/> dengan script ini
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb
(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>[ Baca Selengkapnya...]</a>
</span>
</b:if>
  • Lalu save template anda selesai
NB : 
  • summary_noimg = 250; : Jumlah karakter yang ditampilkan di posting tanpa adanya gambar, anda bisa menggantinya jumlah karakter dengan mengubah angka 250
  • summary_img = 250; : Jumlah karakter yang ditampilkan di posting dengan gambar, anda bisa menggantinya jumlah karakter dengan mengubah angka 250 
  • [ Baca Selengkapnya...] : tulisan Baca selengkapnya anda bisa menggantinya misal "Read More"
Sekian post yang saya berikan semoga berhasil.


[ Baca Selengkapnya...]