Friday, 28 February 2014

Pengertian Meta Tag dan Tag Untuk SEO



Pengertian Meta Tag itu apa sih ? So, dalam artikel ini marilah kita ulas sedikit penjelasan dan juga fungsi dari meta tag ataupun tag ini. Pastinya Anda juga sudah seringkali mendengar istilah ini. Dan mungkin jika ada yang belum jelas khususnya bagi seorang pemula sebaiknya anda pahami saja penjelasan berikut ini : 

Pengertian Tag 

Tag yaitu satu kata atau kata-kata perintah yang diolah didalam dokumen html. Nyaris sama juga dengan kelompok kata, tag dipakai untuk mengklasifikasikan sebuah  artikel maupun content didalam sebuah situs. Tag berbentuk lebih fleksibel apabila dibanding dengan kelompok kata lainnya. Umumnya Tag akan dipakai lewat cara yang lebih spesifik sebagai satu kata kunci atau keyword satu halaman yang spesifik di suatu website/blog. Dalam satu halaman artikel atau tulisan umumnya diberikan banyak kata sinonim serta juga banyak tag didalamnya. 

Pengertian Meta Tag 

Meta tags yaitu kode-kode html yang ada dibagian halaman pada suatu situs. Tak seperti tag html yang lain, meta tags tidak nampak di halaman tulisan atau halaman situs, hingga umumnya membuat pengunjung tidak melihatnya. 
Meta tags yang tidak sama mempunyai fungsi yang tidak sama pula, tetapi dengan umum dari keduanya daoat dipakai untuk berikan informasi tambahan tentang kondisi atau isi dari halaman website atau blog pada robot di mesin pencari. 

Pengertian Meta Tags Description 

Meta tags description yaitu perintah didalam wujud kode html didalam template blog/web yang ada pada masing-masing halamannya. Fungsi dari meta tag description ini yaitu untuk mengemukakan ringkasan informasi dari satu judul halaman postingan pada Search Engine di mana ringkasan tersebut cuma tampak pada halaman index pencarian. Contohnya hasil pencarian oleh spider google ( googlebot ) serta search engine yang lain hingga bisa di mengerti oleh user yang tengah melacak judul artikel tersebut serta relevan dengan yang mereka cari.  Description yang relevan dengan judul artikel atau postingan lebih berpeluang memperoleh banyak clickthrough ( seringkali di klik ). 

Yang di maksud dengan meta tag kata kunci (keyword) yaitu keyword - keyword yang mewakili judul serta gambaran halaman menulis yang tengah di cari melewati search engine di internet serta jika kata kunci (keyword) tersebut cocok dengan judul serta gambaran menulis Anda, maka judul artikel Anda-lah yang nampak di halaman index pencarian. Kata kunci (keyword) sama juga dengan tag. 

Didalam kaitannya dengan search engine optimization ( SEO ), google lebih memercayakan meta description. Untuk pada yahoo search lebih memercayakan tag atau kata kunci (keyword).

Cuma segitu yang bisa saya terangkan pada waktu ini perihal pengertian meta tagdan tag serta fungsinya serta jika ada kekeliruan, diinginkan sekali koreksi dari anda khususnya beberapa master of seo. Semoga artikel ini sedikit membantu dan bisa berguna..!

Good Luck !!

Wednesday, 26 February 2014

Cara Membuat Emoticon Pada Komentar Blog

Dalam membuat emotion ini terkadang mememui kegagalan, dan kegagalan tersebut dikarenakan tidak cocoknya script yang digunakan dengan template yang mau dipasangnya. Dan ini di akibatkan beberapa faktor ketidak cocokan namun menurut saya faktor tersebut adalah karena template tersebut sudah mengalami perubahan / telah di edit sehingga sudah tidak asli lagi sebagai template bawaan. Kalau ini di pasang pada template bawaan maka tutorial dibawah ini akan bekerja baik tanpa merubah hal lainnya yang ada di template. Yang paling utama untuk keberhasilan membuat emoticon ini yaitu penentuan kode comment-holder dimana kalau pada template sobat ada kode tersebut maka di jamin ini akan berhasil.

Emoticon Blogger With Yahoo Smyle

Sengaja saya buat cara seperti ini agar sobat bisa lebih jauh memahami mengenai pemasangan emoticon di kotak komentar ini, kenapa? Karena cara ini bisa kita kembangkan bukan hanya menggunakan emoticon saja untuk meletakannya pada komentar tapi bisa kita pasang banner atau gambar lain, nah agar sobat bisa mengkreasikannya sendiri maka saya bikin tutorial seperti ini.

  • Login ke blogger
  • Klik Layout atau Template
  • Pada tab menu pilih Edit HTML
  • Centang kotak kecil Expand Template Widget
  • Sekarang cari kode </body>
  • Tempatkan kode berikut di atas kode </body>

    <script type='text/javascript'>
    //<![CDATA[
    /* Yahoo! Smileys For Blogger Comments
    * bY Dian Anarchyta
    * Url:http://afowles.blogspot.com
    */
    a = document.getElementById('comment-holder');
    if (a) {
    b = a.getElementsByTagName("p");
    for (i = 0; i < b.length; i++) {
    if (b.item(i).getAttribute('CLASS') == 'comment-content') {
    bh_b_smly = b.item(i).innerHTML.replace(/:\)\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/O:-\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/25.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-bd/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/113.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/7:\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/19.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/2\):\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/48.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\)\]/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\(\(/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\(/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\;\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:D/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\;\;-\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/7:\P/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/47.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/~\X\(/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-\//gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\/:\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/23.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:x/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\P/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-\*/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/=\(\(/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-\S\S/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/42.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-\O/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\X\(/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/B-\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/16.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\#:-\S/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/18.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-S/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/17.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:7/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\(:\|/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/37.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\|/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/=\)\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-B/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/26.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/=\;/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/27.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-c/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/101.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-h/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/103.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-t/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/8-7/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/105.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\I-\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/28.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/8-\|/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\L-\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-a/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/31.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-\$/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/32.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\[-\(/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/33.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\O\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/34.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/8-\}/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/2:-\P/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/36.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/=\P~/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/38.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-\?/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/39.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/#-o/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/40.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/=\D7/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/41.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\@-\)/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/43.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\^o/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/44.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-w/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/45.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\X\_\X/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/109.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:\!\!/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/110.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\\m\//gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/111.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:-q/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/112.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/\^\#\(\^/gi, "<img src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/114.gif' alt='' class='bhacksmly'/>");
    bh_b_smly = bh_b_smly.replace(/:ar\!/ig, "<img src='http://l.yimg.com/a/i/us/msg/emoticons/pirate_2.gif' alt='' class='bhacksmly'/>")
    b.item(i).innerHTML = bh_b_smly;
    }
    }
    }
    </script>
    • Selanjutnya sobat cari kode dibawah ini dan cari yang paling bawah
    <data:blogTeamBlogMessage/>
    <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
    <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' width='100%'/> 
    • Copy kode ini dan letakan tepat di atasnya
    <div style='border: 2px solid #CCC;  margint: 0px;height:80px; overflow: auto; padding: 10px; text-align: center; min-width: 500px;'>
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/> :)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/> :(
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/> ;)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/> :D
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/> ;;-)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/> :-/
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/> :x
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/> :P
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/> :-*
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/> =((
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/> :-O
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/> X(
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif'/> :7
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/16.gif'/> B-)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/17.gif'/> :-S
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/18.gif'/> #:-S
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/19.gif'/> 7:)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/> :((
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/> :))
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/> :|
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/23.gif'/> /:)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/> =))
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/25.gif'/> O:-)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/26.gif'/> :-B
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/27.gif'/> =;
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/101.gif'/> :-c
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/> :)]
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/> ~X(
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/103.gif'/> :-h
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/> :-t
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/105.gif'/> 8-7
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/28.gif'/> I-)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif'/> 8-|
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif'/> L-)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/31.gif'/> :-a
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/32.gif'/> :-$
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/33.gif'/> [-(
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/34.gif'/> :O)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/> 8-}
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/36.gif'/> 2:-P
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/37.gif'/> (:|
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/38.gif'/> =P~
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/39.gif'/> ;-;;
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/40.gif'/> #-o
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/41.gif'/> =D7
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/42.gif'/> :-SS
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/43.gif'/> @-)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/44.gif'/> :^o
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/45.gif'/> :-w
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/47.gif'/> 7:P
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/48.gif'/> 2):)
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/109.gif'/> X_X
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/110.gif'/> :!!
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/111.gif'/> \m/
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/112.gif'/> :-q
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/113.gif'/> :-bd
    <img alt='' class='bhacksmly' src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/114.gif'/> ^#(^
    <img alt='' class='bhacksmly' src='http://l.yimg.com/a/i/us/msg/emoticons/pirate_2.gif'/> :ar!
    </div>
    • Simpan template sobat.

    Sobat bisa menambakan gambar dan kode Emoticon namun perlu diperhatikan adalah posisi peletakan kode dan URL emotionnya antara yang atas dengan yang bawah. URL emoticon dapat diganti dengan gambar apapun sesuai dengan keinginan sobat. Sedangkan apabila sobat mau menambahkan emoticonnya maka sobat tinggal menambahkannya pada kode atas dan bawah, caranya sobat tinggal mengcopy saja kode tersebut kemudian letakan dibawahnya dan ganti URL emoticon dan kodenya.

    Mungkin hanya ini saja yang bisa saya bagikan, jika sobat mengalami kendala jangan sungkan untuk meninggalkan komentar..

    Sunday, 23 February 2014

    Cara Agar Postingan Cepat Terindex Google

    Cara Agar Postingan Cepat Terindex Google cara ini merupakan tambahan dalam pengoptimalan seo off page. Mengapa cuman tambahan? Karena tanpa melakukan tahap ini pun artikel kita dapat terindex oleh mesin pencari terutama Google. Tetapi, butuh waktu beberapa hari, mungkin 2 sampai 3 hari. Maka di sarankan menggunakan tehnik ini agar mempercepat pengindexkan ke mesin pencari.

    Submit Url ke google.
    Cara ini merupakan cara yang paling mudah, sejatinya google menyediakan layanan ini untuk para pemula yang baru membuat blog, agar blognya dengan segera mendapatkan respon dari pihak google.
    Namun kita bisa menggunakan untuk menyubmitkan url artikel kita, agar langsung terindex oleh google hanya dalam hitungan detik.

    Caranya mudah.
    Pertama masuklah ke layanan Alat webmaster - Rayapi URL. Jika belum login ke google maka loggin terlebih dahulu.

    Setelah berhasil login,
    Maka baca seksama tulisan dibawah ini :
    Google menambahkan situs baru ke indeks kami, dan memperbarui yang sudah ada, setiap kali kami merayapi web tersebut. Jika Anda memiliki URL baru, beri tahu kami mengenai hal itu di sini. Kami tidak menambahkan semua URL yang dikirimkan ke indeks kami, dan kami tidak dapat memprediksi atau menjamin kapan atau apakah URL yang dikirimkan akan muncul dalam indeks kami.
    Begitulah kira-kira Quote Google. Tidak memberikan jaminan artikel bisa masuk ke index mereka.

    Masukkan Url Sobat di situ. Kemudian masukkan kode Captcha yang tertera kemudian klik Submit atau kirim permintaan. Setelah berhasil, maka akan ada notifikasi. Tapi jika gagal ulangi lagi langkah berikut.

    Setelah langkah penyubmittan, sering sering melakukan ping,

    Apa itu ping?
    Ping itu ibarat melayangkan surat kepada mesin pencari, jika nanti mesin pencari menerima suratnya maka akan segera blog Anda di eksekusi oleh Search Engine..

    Lakukan ping bisa di situs Mypagerank.net atau bisa langsung ke Googleping.com

    Jika di situs mypagerank, hanya di minta memasukkan judul Blog, URL Blog / URL Postingan, masukan code yang tertera, lalu centang select, (biarkan mereload) selesai reload, gulir kebawah dan klik  "Ping Updates Site"

    Bagaimana jika di Googleping? Kalian masuk link di atas tadi, lalu masukkan Nama atau Judul Blog, Blog Homepage isi dengan URL Blog sobat ata URL Postingan, Rss URL (optional) kalian bisa isi Url blog sobat, bukan URL artikel. Di tambah dengan "atom.xml". Contohnya gini : http://afowles.blogspot.com/feeds/posts/default lalu masukan email anda, pastikan e-mail aktif karena nantinya akan di kirim Kode Verifikasi. Lalu gulir kebawah, setiap menu maka klik lah (check all).
    Popular choices (check all)
    Blog service (check all)
    Teruss.. Ke bawah check all semua dan masukan chapta, kemudian Send Ping.

    Namun semua itu bukan jaminan Artikel Anda dapat di No.1 halaman pencarian, ini hanya langkah alternatif atau bantuan.

    Saturday, 22 February 2014

    Flow Anarchyta Responsive Blogger Template Valid HTML5 dan CSS3

    Flow Anarchyta Responsive Blogger Template Valid HTML5 dan CSS3 - Malam ini saya akan membagikan Template Gratis buat Anda semua. Secara keseluruhan template ini hampir sama dengan yang saya gunakan, pada Postingan Homepage saya terinspirasi dari BKI tetapi disini saya menggunakan Javascript untuk membuat thumbnail berwarna.

    Flow Anarchyta Responsive Blogger Template Valid HTML5 dan CSS3



    Featured

    • Fast Loading
    • Responsive Design -> Check
    • Valid HTML 5 Homepage -> Check
    • Valid HTML 5 Posting -> Check
    • Valid CSS 3 -> Check
    • SEO Score 100% -> Check

    Custom

    Pada form Search Widget Anda masukan HTML berikut ini..
    <div id='search'>
    <form action='/search' id='search-form' method='get' target='_top'>
    <input id='search-text' onfocus="if(this.value==this.defaultValue)this.value=''" value="Search articel...." onblur="if(this.value=='')this.value=this.defaultValue;" name='q' type='text'/>
    </form>
    </div>
    Untuk membuat Blog tetap Valid HTML 5 dan SEO 100% setelah Anda menambahkan Widget hapus Kode ini pada --> Edit HTML
    <b:include name='quickedit'/>
    Mungkin cukup itu saja untuk menjaga Blog agar tetap Valid HTML 5 dan SEO 100%.

    Untuk kekurangan bisa menyusul.. Terima kasih atas kunjungannyaa..

    Wednesday, 19 February 2014

    Auto Read More Thumbnail Tanpa Javascript

    Selamat malam buat semua sahabat Blogger. Kali ini saya akan berbagi cara tentang membuat Auto Read More Thumbnail tanpa Javascript, maka otomatis blog anda loadingnya akan lebih cepat dari sebelumnya karena tidak ada javascript yang di gunakan. Tutorial ini sebenarnya udah banyak di Google, tapi apa salahnya untuk berbagi pengetahuan..
    Untuk demo Anda bisa melihat template yang saya gunakan ini, atau lebih jelasnya seperti ini Screen Shootnya ...

    Auto Read More Thumbnail Tanpa Javascript

    Jika Anda saat ini telah menggunakan auto read-more versi javascript, Anda bisa memodifikasinya pada formulir HTML Temlpate, temukan kode ini:
    <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>
    Note's
    Jangan lupa untuk menghapus script auto read-more link yang biasanya terletak di atas </head>

    Kalau udah ketemu hapus semua kode tersebut kemudian Anda ganti dengan kode di bawah ini
    <b:if cond="data:post.firstImageUrl">
    <a expr:href="data:post.url">
    <img class="thumbnail-post" expr:src="data:post.firstImageUrl" expr:title="data:post.title" /></a>
    <b:else>
    <a expr:href="data:post.url">
    <img class="thumbnail-post" src="http://1.bp.blogspot.com/-XeZs003zT-4/UwM1mfc9l3I/AAAAAAAAAlw/TNTcFCMPH4A/s1600/no-image-thumbnail.jpg" expr:title="data:post.title" /></a>
    </b:else>
    </b:if>
    <div class='post-snippet'>
    <data:post.snippet/>
    </div>
    Jika template blog Anda masih berupa posting bisa berikut tutorial lengkap membuat Auto Read More Thumbnail Tanpa Javascript

    Berikut Tutorialnya

    • Login Ke Blogger
    • Klik Edit Template (Jangan Lupa Back Up dulu)
    • Cari kode ]]></b:skin>
    • Copy Css Berikut di atas kode tersebut..
    .thumbnail-post {
    width:100px;
    height:100px;
    float:left;
    margin:0px 10px 0px 0px;
    }
    • Setelah itu Cari kode <data:post.body/> yang ke 2 atau 3 atau ke 4, ganti dengan kode ini
    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:post.firstImageUrl'>
    <a expr:href='data:post.url'><img class='thumbnail-post' expr:title='data:post.title' expr:src='data:post.firstImageUrl'/></a>
    <b:else/>
    <a expr:href='data:post.url'><img class='thumbnail-post' expr:title='data:post.title' src='http://1.bp.blogspot.com/-XeZs003zT-4/UwM1mfc9l3I/AAAAAAAAAlw/TNTcFCMPH4A/s1600/no-image-thumbnail.jpg'/></a>
    </b:if>
    <div class='post-snippet'>
    <data:post.snippet/>
    </div>
    <div class='rm-button-wrap'>
    <a class='button' expr:href='data:post.url'>Baca Selengkapnya</a>
    </div>
    </b:if>
    </b:if>

    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <data:post.body/>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
    <data:post.body/>
    </b:if>
    Keterangan:
    Thumbnail saya menggunakan <data:post.firstImageUrl>
    Snippet di ambil dari Referensi pada Popular Post <data:post.snippet/>
    • Langkah Terkahir "Save Template"

    Demikian tutorial Cara Membuat Auto Read More Thumbnail Tanpa Javascript, apabila Anda mengalami masalah atau masih bingung untuk menerapkan dalam Membuat Auto Read More Thumbnail Tanpa Javascript silahkan tinggalkan komentar Anda di form komentar bawah. Terima kasih ...

    Update 13 November 2014

    <data:post.firstImageUrl> Adalah gambar pertama yg di ambil dari postingan, jika sebelumnya anda menggunakan <data:post.thumbnailUrl> yg di ambil dari popular post maka tidak akan muncul thumbnail post'nya karena sejak kemarin 10 November 2014 kurang lebihnya pihak Google mengubah url yg kita upload dari http:// ke https://
    Contoh : <img src='http://1bp.blogspot.com'/> menjadi <img src='http://1bp.blogspot.com'/> dan menyembabkan thumbnail post error dan tidak muncul, mungkin cara di atas bisa mengatasi masalah sobat..
    NB : <data:post.firstImageUrl> ukuran thumbnail original misal kita upload ukuran /1600/ maka akan tetap muncul /1600/ berbeda dengan <data:post.thumbnailUrl> yg memang ukurannya lebih kecil yaitu s/72-c/ seperti di popular post itu...

    Tuesday, 18 February 2014

    jQuery Lazy Load Plugin

    Ada banyak faktor kenapa lalu lintas blog kehilangan pengunjung, salah satunya adalah kecepatan loading blog yang memerlukan waktu lama. Hal seperti ini benar-benar akan berdampak buruk buat blog Anda, jadi penting buat Anda untuk memperhatikan beban dari template blog Anda. Salah satu yang membuat blog kita loading lebih lama karena gambar atau photo, lantas apa kita tidak harus menggunakan gambar untuk blog kita? Tentu saja tidak, seharusnya kita harus mengambil suatu langkah tertentu sehingga beban dari blog kita berkurang dan tampil lebih cepat.

    Nah, pada posting ini saya akan berbagi satu tips untuk mempercepat loading blog Anda dengan menggunanakan Plugin jQuery Lazy Image Load. Cara kerja plugin ini adalah memperlambat atau menunda loading gambar di blog Anda. Gambar yang muncul hanya pada halaman yang terlihat dan gambar yang lain akan terlihat saat kita mengscroll halaman blog ke bawah. Dengan begitu loading blog akan lebih cepat dan dalam beberapa kasus tertentu dapat membantu mengurangi beban server. Untuk lebih jelasnya silahkan kunjungi Appelsiini

    Cara Install

    • Login ke Blogger Anda
    • Klik Temlate dan pilih Edit HTML
    • Cari tag </head> gunakan CTRL+F untuk mencari
    • Selanjutnya salin javascript dibawah ini tepat sebelum tag </head>
    <script type="text/javascript">
    /*
    * Lazy Load - jQuery plugin for lazy loading images
    * Copyright (c) 2007-2012 Mika Tuupola
    * Licensed under the MIT license : http://www.opensource.org/licenses/mit-license.php
    * Project home : http://www.appelsiini.net/projects/lazyload
    * Version: 1.8.3
    */
    (function($, window, document, undefined) {
    var $window = $(window);

    $.fn.lazyload = function(options) {
    var elements = this;
    var $container;
    var settings = {
    threshold: 0,
    failure_limit: 0,
    event: "scroll",
    effect: "show",
    container: window,
    data_attribute: "original",
    skip_invisible: true,
    appear: null,
    load: null
    };

    function update() {
    var counter = 0;
    elements.each(function() {
    var $this = $(this);
    if (settings.skip_invisible & amp; & amp; !$this.is(":visible")) {
    return;
    }
    if ($.abovethetop(this, settings) ||
    $.leftofbegin(this, settings)) {
    /* Nothing. */
    } else if (!$.belowthefold(this, settings) & amp; & amp; !$.rightoffold(this, settings)) {
    $this.trigger("appear");
    /* if we found an image we'll load, reset the counter */
    counter = 0;
    } else {
    if (++counter & gt; settings.failure_limit) {
    return false;
    }
    }
    });

    }

    if (options) {
    /* Maintain BC for a couple of versions. */
    if (undefined !== options.failurelimit) {
    options.failure_limit = options.failurelimit;
    delete options.failurelimit;
    }
    if (undefined !== options.effectspeed) {
    options.effect_speed = options.effectspeed;
    delete options.effectspeed;
    }

    $.extend(settings, options);
    }

    /* Cache container as jQuery as object. */
    $container = (settings.container === undefined ||
    settings.container === window) ? $window : $(settings.container);

    /* Fire one scroll event per scroll. Not one scroll event per image. */
    if (0 === settings.event.indexOf("scroll")) {
    $container.bind(settings.event, function(event) {
    return update();
    });
    }

    this.each(function() {
    var self = this;
    var $self = $(self);

    self.loaded = false;

    /* When appear is triggered load original image. */
    $self.one("appear", function() {
    if (!this.loaded) {
    if (settings.appear) {
    var elements_left = elements.length;
    settings.appear.call(self, elements_left, settings);
    }
    $("<img/>")
    .bind("load", function() {
    $self
    .hide()
    .attr("src", $self.data(settings.data_attribute))[settings.effect](settings.effect_speed);
    self.loaded = true;

    /* Remove image from array so it is not looped next time. */
    var temp = $.grep(elements, function(element) {
    return !element.loaded;
    });
    elements = $(temp);

    if (settings.load) {
    var elements_left = elements.length;
    settings.load.call(self, elements_left, settings);
    }
    })
    .attr("src", $self.data(settings.data_attribute));
    }
    });

    /* When wanted event is triggered load original image */
    /* by triggering appear. */
    if (0 !== settings.event.indexOf("scroll")) {
    $self.bind(settings.event, function(event) {
    if (!self.loaded) {
    $self.trigger("appear");
    }
    });
    }
    });

    /* Check if something appears when window is resized. */
    $window.bind("resize", function(event) {
    update();
    });
    /* With IOS5 force loading images when navigating with back button. */
    /* Non optimal workaround. */
    if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) {
    $window.bind("pageshow", function(event) {
    if (event.originalEvent.persisted) {
    elements.each(function() {
    $(this).trigger("appear");
    });
    }
    });
    }

    /* Force initial check if images should appear. */
    $(window).load(function() {
    update();
    });
    return this;
    };

    /* Convenience methods in jQuery namespace. */
    /* Use as $.belowthefold(element, {threshold : 100, container : window}) */

    $.belowthefold = function(element, settings) {
    var fold;
    if (settings.container === undefined || settings.container === window) {
    fold = $window.height() + $window.scrollTop();
    } else {
    fold = $(settings.container).offset().top + $(settings.container).height();
    }

    return fold & lt; = $(element).offset().top - settings.threshold;
    };
    $.rightoffold = function(element, settings) {
    var fold;

    if (settings.container === undefined || settings.container === window) {
    fold = $window.width() + $window.scrollLeft();
    } else {
    fold = $(settings.container).offset().left + $(settings.container).width();
    }

    return fold & lt; = $(element).offset().left - settings.threshold;
    };
    $.abovethetop = function(element, settings) {
    var fold;
    if (settings.container === undefined || settings.container === window) {
    fold = $window.scrollTop();
    } else {
    fold = $(settings.container).offset().top;
    }

    return fold & gt; = $(element).offset().top + settings.threshold + $(element).height();
    };
    $.leftofbegin = function(element, settings) {
    var fold;
    if (settings.container === undefined || settings.container === window) {
    fold = $window.scrollLeft();
    } else {
    fold = $(settings.container).offset().left;
    }

    return fold & gt; = $(element).offset().left + settings.threshold + $(element).width();
    };

    $.inviewport = function(element, settings) {
    return !$.rightoffold(element, settings) & amp; & amp;
    !$.leftofbegin(element, settings) & amp; & amp;
    !$.belowthefold(element, settings) & amp; & amp;
    !$.abovethetop(element, settings);
    };

    /* Custom selectors for your convenience. */
    /* Use as $("img:below-the-fold").something() or */
    /* $("img").filter(":below-the-fold").something() which is faster */

    $.extend($.expr[':'], {
    "below-the-fold": function(a) {
    return $.belowthefold(a, {
    threshold: 0
    });
    },
    "above-the-top": function(a) {
    return !$.belowthefold(a, {
    threshold: 0
    });
    },
    "right-of-screen": function(a) {
    return $.rightoffold(a, {
    threshold: 0
    });
    },
    "left-of-screen": function(a) {
    return !$.rightoffold(a, {
    threshold: 0
    });
    },
    "in-viewport": function(a) {
    return $.inviewport(a, {
    threshold: 0
    });
    },
    /* Maintain BC for couple of versions. */
    "above-the-fold": function(a) {
    return !$.belowthefold(a, {
    threshold: 0
    });
    },
    "right-of-fold": function(a) {
    return $.rightoffold(a, {
    threshold: 0
    });
    },
    "left-of-fold": function(a) {
    return !$.rightoffold(a, {
    threshold: 0
    });
    }
    });
    </script>
    <script type="text/javascript">
    $(function() {
    $("img").lazyload({
    placeholder: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVUcyMdKXknHXxrG9ppLRSvSEIcmgHcU-5tE1rlNWStjMp-CjytYatrmACKXE3L1iuEHswgW_f7kgXicYhZ8y4CNgvLSg68CqvFH7GCg_c6eKbBtPicuISJIFJlPo84Hr7qPOtVIhquz8/s1600/grey.gif",
    threshold: 200
    });

    });
    </script>
    • Langkah terakhir klik Simpan template - selesai !
    Dengan menyelesaikan langkah diatas Anda telah berhasil menginstall lazy image load diblog Anda. Akhir kata semoga tips yang mudah ini bermanfaat buat Anda dan jangan lupa untuk memberi 1+, like atau share posting ini.

    Loading Page Blogger (Sederhana)

    Loading Page Blogger (Sederhana) ini adalah sebuah widget yang hanya menunda waktu Loading baik saat pertama kali membuka Web atau membuka halaman Blog, dengan Script yang boleh dibilang simple.

    Langsung saja Caranya
    1. Login ke Blogger
    2. Edit Template
    3. Cari kode </b:skin>
    4. Copy Paste kode CSS dibawah ini sebelum Kode Tag </b:skin>

    #anarchyta-loader {
    position:fixed;
    top:0;
    left:0;
    background:rgba(44, 62, 80, 0.9) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiLNYo-OINeMlJZAFhOaw_hqr1UovMBscuvmGlDYm4KG3OuE3k8AIaREL4BHd-XpA9tqYEeESSoouAcsesM4tXfMdB4POybBH-mcLaHiDnkUdjgoVfNlXrO_t3VV2fCzd7b1ff3q8nsBk/s200/load6.gif)no-repeat 50% 50%;
    z-index:9999;
    text-align:center;
    width:100%;
    height:100%;
    display:none;
    }

    Note's
    Untuk gambar loading Anda bisa mengganti pada kode ini url(http://goo.gl/mRjMfu)

    5. Cari kode </head>
    6. Copy Paste kode Javascript dibawah ini sebelum Kode Tag </head>

    <script type='text/javascript'>
    //<![CDATA[
    eval(function(p,a,c,k,e,r){e=function(c){return c.toString(a)};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('$(1(){2 3="8://"+9.b.c.d();2 $4=$("a[0^=\'"+3+"\'], a[0^=\'/\'], a[0^=\'./\'], a[0^=\'../\']");$4.5(1(){$(\'#6-7\').e(f).g(h).i(j)});$(\'#6-7\').5(1(){$(k).l()})});',22,22,'href|function|var|siteURL|internalLinks|click|anarchyta|loader|http|top||location|host|toString|fadeIn|1500|delay|6000|fadeOut|1000|this|hide'.split('|'),0,{}))
    //]]>
    </script>

    7. Terakhir cari kode </body> dan letakan HTML di bawah ini tepat di atasnya

    <div id='anarchyta-loader'/>

    Kalau udah semua jangan lupa "Save Template" dan lihat penampakannya pada blog Anda. Demikian Artikel mengenai Loading Page Blogger (Sederhana) semoga Anda tertarik untuk menggunakan..