Cara Membuat Recent Post Berdasarkan Label dan Thumbnail

Cara Membuat Recent Post Berdasarkan Label dan Thumbnail - Pada tutorial kali ini, Saya akan berbagi cara membuat recent post berdasarkan label dan thumbnail. Widget ini akan otomatis menampilkan update posting kita hanya pada label/kategori yang tentunya bisa sobat pilih sendiri. Contoh bisa sobat lihat pada gambar di samping ini.

Nah kalo sobat blogger tertarik buat masang widget ini, gampang koq. Tinggal ikuti tutorial berikut ini…

1. Seperti biasa, login ke akun blogger sobat
2. Pergi ke tab rancangan >> edit html
3. EXPAND TEMPLATE WIDGET
4. cari kode ]]></b:skin>.

(*Gunakan F3 di keyboard untuk mempermudah pencarian)

5. Copy paste kode di bawah ini sebelum kode No.4

img.label_thumb{float:left; padding:5px; border:1px solid #8f8f8f; background:#D2D0D0; margin-right:10px; height:55px; width:55px}
img.label_thumb:hover{background:#f7f6f6}
.label_with_thumbs{float:left; width:100%; min-height:70px; margin:0px 10px 2px 0px; adding:0}
ul.label_with_thumbs li{padding:8px 0; min-height:65px; margin-bottom:10px}
.label_with_thumbs a{}
.label_with_thumbs strong{}

6. Scroll ke bawah dan temukan kode </head>
7. Copy paste kode di bawah ini sebelum kode No.5

<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<ul class="label_with_thumbs">');for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error)
{s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){thumburl=d;}else thumburl='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLKuy9Cgou97dxvfxfhu8tPwX86916LlMXxMzgg7_Xvq4aKVEnE-s-2TvIpaozoIeuHWbqqBeqctkdXcK5YhWAGtr8CkInRwjtXLnKhxCjHdAikGRlZ_nrXFUO0BNKtGRUwU0zeNgYkQzp/';}
var postdate=entry.published.$t;var cdyear=postdate.substring(0,4);var cdmonth=postdate.substring(5,7);var cdday=postdate.substring(8,10);var monthnames=new Array();monthnames[1]="Jan";monthnames[2]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="Jun";monthnames[7]="Jul";monthnames[8]="Aug";monthnames[9]="Sep";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true)
document.write('<a href="'+posturl+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><br>');if("content"in entry){var postcontent=entry.content.$t;}
else
if("summary"in entry){var postcontent=entry.summary.$t;}
else var postcontent="";var re=/<\S[^>]*>/g;postcontent=postcontent.replace(re,"");if(showpostsummary==true){if(postcontent.length<numchars){document.write('');document.write(postcontent);document.write('');}
else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('');}}
var towrite='';var flag=0;document.write('<br>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;}
if(showcommentnum==true)
{if(flag==1){towrite=towrite+' | ';}
if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';commenttext='<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';towrite=towrite+commenttext;flag=1;;}
if(displaymore==true)
{if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">More »</a>';flag=1;;}
document.write(towrite);document.write('</li>');if(displayseparator==true)
if(i!=(numposts-1))
document.write('');}document.write('</ul>');}
//]]>
</script>

8. SAVE template.sampai disini belum selesai.
9. masih di menu DESIGN >> PAGE ELEMENTS >> ADD GADGET >> HMTL/javaScript
10. Masukkan kode di bawah ini kedalam contents

<script type='text/javascript'>var numposts = 3;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 80;</script>

<script type="text/javascript" src="/feeds/posts/default/-/NAMA LABEL?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

11. Untuk kategori/label yang berspasi seperti Belajar SEO Blogspot, Blog SEO dsb, ganti lah spasi dengan kode %20. Contoh penulisan lengkap:
http://daw-xp.blogspot.com/feeds/posts/default/-/Belajar%20SEO%20Blogspot
atau,
http://daw-xp.blogspot.com/feeds/posts/default/-/Blog%20SEO
12. Jika sudah selesai masukkan kodenya, jangan lupa sobat blogger masukkin judul/title widgetnya.
13. Klik Save / Simpan.
14. Selesai! Semoga bermanfaat…


Jika ada yang kurang dimengerti, silahkan tanyakan dengan tinggalkan komentar.

Selayaknya Dibaca:

• Cara Membuat Recent Post Dengan Slideshow


• Cara Menambahkan Recent Posts Dengan Bullets

Optimalkan Kecepatan Blog

Optimalkan Kecepatan Blog - Selain mempertimbangkan masalah Keyword, Meta Tag (baca: meta tag seo friendly), dan segala macam pernak-pernik lainnya yang berbau Search Engine Optimation (SEO) (baca: apa itu seo?), sebuah blog juga wajib mengedepankan masalah berat halaman sebagai aspek yang paling utama untuk dibenahi. Kita harus bisa meng-optimalkan berat blog kita agar pengunjung juga bisa akses blog kita dengan cepat. Maka berikut adalah penjelasan mengenai optimalkan kecepatan blog.

Salah satunya adalah dengan menggunakan 5 widget pilihan untuk blog yang berguna dan mempunyai minat pengunjung serta menambahkan jumlah pageviews kita dalam blog.

Bagi blogger yang memang menggunakan akses berkecepatan tinggi dalam mengurus blognya, masalah mengenai berat loading page kadang sering luput dari perhatian mereka. Hal ini tentu saja terjadi karena mereka membuka blognya sendiri dengan kecepatan tinggi yang mereka miliki, sehingga blog mereka seolah-olah ringan dan baik-baik saja.

Blog yang ringan adalah blog yang mampu beradaptasi tidak hanya kepada user internet dengan kecepatan akses tinggi, melainkan juga kepada user yang datang dengan akses berkecepatan rendah.

Standar Ukuran Blog

Standarnya, sebuah situs seharusnya tidak memiliki berat lebih dari 25kb per-halamannya. Hal ini di sarankan oleh banyak sekali situs mengenai Search Engine Optimation (SEO), termasuk situs-situs besar seperti www.iwebtool.com, www.websiteoptimization.com, bahkan hingga www.google.com/analytics. Mereka serempak menganjurkan hal yang sama.

Jujur saja, walaupun 25kb bukan sesuatu yang mustahil dan sangat mungkin bisa dicapai, standar tersebut masihlah terlalu berat untuk di penuhi oleh kalangan blogger.

Apa benar sesulit itu standar yang harus kita ikuti..? , kalo ngga percaya, coba cek dulu berat blog kalian lewat  http://www.iwebtool.com/speed_test / pada kolom di bawah ini . Masukkan alamat blog kalian pada kolom yang disediakan, kemudian klik tombol check dan tunggu hasilnya.

Your domain(s): Enter each address on a new line (Maximum 10) (eg. daw-xp.blogspot.com)

Bagaimana? apa blog kalian sudah berhasil mengikuti standar tersebut? atau jangan-jangan blog kalian malah hampir 3-4x lipat lebih berat dari yang disarankan?

Ukuran yang paling realistis untuk sebuah blog

Setelah melihat hasil test, mungkin saja kalian berpikir bahwa mengurangi ukuran blog hingga 25kb adalah hal yang sulit diikuti. Dan kalo benar demikian, maka kalian mempunyai pemikiran yang sama dengan Saya. Standar tersebut memang disarankan agar blog kita lebih mudah di index oleh Robot Search Engine, tapi bukan berarti itu adalah standar yang paling ideal.

Perhitungannya, sebuah blog berukuran "super duper berat (150kb keatas)" sekalipun, tetap saja tidak akan terlihat berat ketika diakses dari koneksi 1mbps. Lain ceritanya ketika blog tersebut diakses dari koneksi yang hanya berkecepatan 152kbps.. dijamin, minimal diperlukan waktu sekitar 3-4 menit untuk melihat blog secara utuh. Bahkan ada beberapa blog yang membutuhkan waktu hingga 10 menit sampai bisa diload sempurna.

Kalau kalian pernah menonton acara MTV Booling Points, kalian pastinya udah tau dengan jelas tentang bagaimana tahap mendidihnya amarah seseorang. Hal ini juga terjadi lho pada pengunjung yang menunggu terlalu lama saat mengunjungi sebuah blog. Ada titik mendidih yang membuat mereka akhirnya kabur ke tempat lain, dan ngga mau kembali lagi. Yap!, kurang lebih seperti itulah yang terjadi.

Standar sebuah blog yang ideal sebenarnya masih tergantung pada seberapa cepat koneksi yang pengunjung gunakan ketika mengakses blog kita.

Lupakan masalah standar yang benar (25kb), sekarang kita akan menghitung ukuran yang paling seimbang, yang bisa diakses dengan mudah oleh pengunjung low speed connection ataupun yang high speed connection.

Perbedaan antara standard blog yang benar dengan standar blog yang ideal

Blog yang benar di mata SEO memang seharusnya berukuran 25kb.., tapi dalam hal ini, standard yang dimaksud tersebut mungkin hanya sebatas ukuran default blog yang wajar. Selebihnya, ketika ditambahi beberapa widget-widget, sebuah blog tentu saja akan kesulitan dalam mempertahankan berat badannya.

Oleh karena itu, walaupun ada tolak ukur 25kb dalam warning yang muncul dalam analysis page-nya, kebanyakan situs-situs analyzer selalu memberikan toleransi. Minimal jika blog kita tidak melebihi 100kb, maka blog kita masih masuk ke dalam tahap aman.

Bagaimana kalo lebih dari 100kb..? Kalo blog kalian lebih dari 100kb, Saya rasa sudah saatnya kalian mengurangi beberapa widget yang dirasa ngga terlalu penting dari blog kalian. Zona 100kb sudah termasuk ke dalam zona bahaya, dimana search engine sudah dipastikan akan kesulitan dalam mengindex blog kita.

Dan jika kalian bertanya kepada Saya tentang berapa ukuran blog yang ideal.., maka Saya akan menjawab "60kb". Kenapa? karna ukuran 60kb bisa dibilang adalah perbatasan yang paling seimbang, agar blog kita bisa mudah diakses oleh pengunjung berkoneksi lemot.

Selain hal tersebut, ukuran 60kb juga ukuran yang paling pas untuk dimasukkan kedalam kategori Mobile Friendly. Disini, Saya menggunakan Opera Mini sebagai acuannya. Seperti yang kita ketahui, ketika kita membuka sebuah situs menggunakan Opera Mini, maka kita akan dialihkan terlebih dahulu ke server mereka, sebelum akhirnya mereka mengkompresi seluruh isi halaman agar situs lebih kecil dan menampilkannya di browser. Betul..?

Berdasarkan hal tersebut, sebuah blog dengan ukuran 60kb, ngga akan melebihi 25kb ketika diakses lewat Opera Mini. Sudah masuk standar kan sekarang? setidaknya, buat Mobile. Sekian dulu postingan saya mengenai optimalkan kecepatan blog. Semoga bagi anda yang lagi gencarnya optimalkan kecepatan berat blognya sudah tidak berat lagi.
Terima kasih kepada Mas Leo untuk artikelnya yang bermanfaat ini ...

See u..

Wakan | Translator Bahasa Jepang / China (2)

Sebelumnya Saya pernah share tentang software Hikaro yang translator bahasa Jepang juga. Jika Anda kesulitan dengan softwares tsb Anda bisa menggunakan softwares "wakan" ini sebagai penggantinya. Memang namanya kedengarannya lucu (namanya juga Jepang), tapi faedah / kegunaannya luar biasa.

Selain itu, sobat juga dapat belajar tentang bahasa Jepang di masa-masa yang sangat penting ini bagi kemajuan  sobat dalam menempuh perjalanan karir. Tentu saja komunikasi disini tertuang secara luas, oleh karena itu saya akan mempersempitnya hingga ke “Komunikasi Dalam Bahasa Jepang”.

Bahasa Jepang merupakan salah satu bahasa yang sulit dipelajari, hal itu disebabkan oleh banyaknya jumlah huruf  dan kosakata. Huruf yang dikenal dalam masyarakat Jepang adalah Kanji, Romaji, Hiragana, dan Katakana. Nah…bisa dibayangkan oleh kita yang notabene hanya mengenal Alphabet dan huruf  Hijaiyah saja yang jumlahnya masih puluhan, huruf kanji jumlahnya ribuan dan masih pula ditambah dengan hiragana dan katakana yang berjumlah puluhan.

Namun bagi orang yang mempelajari bahasa Jepang, hal ini merupakan suatu tantangan, karena bahasa Jepang merupakan bahasa internasional yang “sangat” bisa bermanfaat dalam menunjang karir dimasa depan. Namun tentunya mempelajari bahasa Jepang tidaklah mudah, selain pola kalimat yang berbeda dengan bahasa Indonesia,  cara berbicaranya (Hogen) dan kosakatanya (Kotoba) pun beragam jenisnya di setiap daerah di Jepang.

Dalam proses pembelajaran bahasa jepang ini, ada sebuah software/program komputer yang bisa digunakan di komputer pribadi/PC/laptop. Program ini adalah “Wakan”, sebuah program translator/penerjemah dari bahasa inggris ke bahasa jepang, dan ke bahasa China.

Keungulannya adalah program ini bisa menampilkan arti dari sebuah kosakata dengan beragam alternatif kosakata dalam bahasa Jepang/Chinanya. Juga memberikan sebuah halaman khusus yang didalamnya termuat daftar huruf kanji yang tersusun rapi sesuai dengan jenis huruf yang digunakan sebagai awal kosakata.

Kelemahannya adalah program ini berbasis bahasa inggris, jadi kesulitannya bertambah apabila kita tidak mengerti atau mengenal bahasa inggris sama sekali. Namun hal itu tentunya tidak menjadi halangan kan? karena hal itu merupakan suatu tantangan tambahan bagi anda agar mampu belajar 2 bahasa dalam satu waktu (lagi pula, bahasa Inggris menggunakan alphabet).

Program ini bisa didownload secara cuma-cuma di sini

Selamat belajar, 頑張ってねー皆さん!!!

Lembaga Kursus Bahasa

Japanese Lesson; NHK WORLD Online

Referensi : nihongoheta

Modifikasi Tampilan Read more

Pada pembahasan kali ini akan mempelajari tentang bagaimana caranya customization / modifikasi tampilan read more di homepage blog. Kita bisa merubah segala sesuatu yang kita inginkan sesuai selera kita.

Disini DAW-XP hanya akan berbagi sedikit yang diperlukan tentang code HTMLnya, selain dari itu silahkan sobat blogger kreasikan sendiri. Walaupun sudah ada fungsi Insert jump break pada post editor untuk melakukan fungsi auto read more, namun itu hanya akan berfungsi pada templates pendukung langsung dari blogger dan kemungkinan tidak akan mendukung dari templates lain.

Sebelumnya Saya harus berterima kasih kepada Kang Rohman karena telah memberikan ilmu pengetahuannya dan sharing sehingga kami bisa. Nah sekarang ikuti tutorial berikut tentang bagaimana cara modifikasi tampilan read more.

Sebagai dasar pengetahuan, kode read more blogger adalah seperti ini :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>
</div>
</b:if>

Dengan mengetahui kode dasarnya, maka tentu saja kita dapat membuat berbagai kreasi.

* Agar read more tampil di sebelah kanan

Secara default " Read more " akan tampil di sebelah kiri. Jika anda berkeinginan agar read more tampil di sebelah kanan, anda bisa menambahkan kode tambahan seperti ini :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>

<div style='float:right;padding:10px 0px 5px 0px'>

<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>

</div>

</div>
</b:if>

Atau jika anda lebih suka memasang pada CSS, bisa seperti ini ;

Simpan ini di atas kode ]]></b:skin>

.readmore { float:right;padding: 10px 0px 5px 0px; }

dan pasang ini di bagian body nya ;

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<div class='readmore'>




<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>

</div>

</div>
</b:if>

* Agar Read more ditampilkan tebal

Agar tampilan "Read more »" atau " Read more » " bisa tampil dengan huruf tebal, anda cukup menambahkan kode <strong>Read more »</strong> atau <b>Read more » </b>. Contoh :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<strong><a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a> </strong>
</div>
</b:if>

* Agar Read more tampil plus Judul Posting

Tulisan read more anda bisa tampil bersama dengan tulisan judul posting anda, contoh kodenya bisa seperti ini :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>




<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/>&#160;&#8594;&#160;
<data:post.title/></a>
</div>
</b:if>

* Agar Read more diganti dengan banner

Apabila anda menganggap tampilan huruf kurang menarik, anda bisa menggantinya dengan dengan tombol atau banner, misal banner seperti ini :

Format kodenya seperti ini ;

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;'><img src='URLgambarmu' alt='read more'/></a>




</div>
</b:if>

Contoh nyata seperti ini :

<b:if cond='data:post.hasJumpLink'>

<div class='jump-link'>

<a expr:href='data:post.url + &quot;#more&quot;'>

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7011LzFVSQbca17hJQ-B2ssVrYzSz0ABFvlmAZZXz5DJsYSQrOZ4jqbmVQgwKyiqb1KKJeXwHMP-Q-2Kj_A187pt6i3lJWjObA5Im4CeRbtSYY1mfh08vPOhF5b3d0BiHPk0HfuotBVo/[1].png' alt='read more'/></a>

</div>

</b:if>

Dan anda bisa menciptakan puluhan atau bahkan ratusan kreasi untuk tampilan read more ini agar blog anda tampil menarik.

Masih pusing dimana menempatkan hasil kreasi read more mu? berikut gambaran langkah-langkahnya :

1. Silahkan login ke blogger dengan ID anda.
2. Klik Tata Letak.
3. Klik tab Edit HTML.
4. Beri tanda centang pada kotak kecil di sampil tulisan " Expand Template Widget "

5. Carilah kode yang mirip seperti Ini :

<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

6. Silahkan ganti kode di atas dengan hasil kreasimu seperti yang di contohkan kang rohman tadi di atas.
7. Klik tombol SIMPAN TEMPLATE
8. Selesai.

Selamat berkreasi!

Meta Tag Generator

Meta Tag Generator - Sebelumnya Saya pernah share tentang Apa Itu Meta Tag?. Nah pada pembahasan kali ini kita akan mempelajari bagaimana tentang memasang meta tag ke google lewat meta tag generator. Sebenarnya banyak cara memasang meta tag ke google, namun kali ini kita akan mempelajari lewat meta tag generator saja dulu.

Meta Tag Generator akan membaca halaman yang Anda tentukan, menghapus kata-kata umum dari itu, dan memilih kata-kata yang paling sering digunakan pada halaman. Ini kemudian akan menghasilkan tag Meta Keywords menggunakan kata-kata itu telah ditemukan. Ekstra berat akan diberikan kepada kata-kata dalam tag pos.

Nah jika ingin memasukkan situs web sobat ke dalam meta tag google atau search engine lainnya silahkan sobat isi form / kotak di bawah ini.

Advanced Meta-Tags Generator Tool © SEO Chat™ This Table Was By DAW-XP Title (Judul) The Title Tag must contain no more than 70 characters (generally, 100 characters may be indexed). Author (Nama Pembuat) The Author Tag is for the person who wrote the material for the site. Subject (Tema) The Subject Tag is for what your site is. Business, music, hobby, cars. Use up to 100 characters. Description (Keterangan) The Description Tag can have up to 150 characters (generally, 200 to 250 characters may be indexed, though only a smaller portion of this amount may be displayed). Classification (Klasifikasi) The Classification tag is similar to description but more in detail. Keywords (Kata Kunci) In the Keyword tag use everything you think someone will search for to find your site. Use 200 characters. Geography (Geografi) Where are you located? Full Address Language (Bahasa) Is your site in English, Spanish, French.....? Expires (Kadaluarsa) Use "never" unless your site will expire. (Eg. Tue, 18 Apr 2006 14:57:09 GMT | Note: Requires RFC1123 date as shown here Cache Control (Kontrol Cache) Cache control level. NonePublicPrivateno-Cacheno-Store No Cache (Tidak Sembunyikan) This directive indicates cached information should not be used and instead requests should be forwarded to the origin server. Yes No Copyright (Nama Situs) Who is the Owner of the site, Company Name Zip Code (Kode Pos) Your Zip Code City (Kota) Your City, Town Country (Negara) Your Country, use all names; USA, United States, United States Of America, America, etc. Designer (Seniman Blog) Webmaster name Publisher (Terbit) Owner, Webmaster, Company Names. Revisit-After (Terakhir Update) Tell search engine how often this page updates. (Eg. 21 days | Note: Most search engines do not support this Meta Tag) Distribution (Distribusi) Use [Global] unless it is a [Local] only site. GlobalLocalInternal Use Robots (Mensin Pencari) The values ALL and NONE set all directives on or off: [ALL=INDEX,FOLLOW] and [NONE=NOINDEX,NOFOLLOW]. AllNONE MS Tags (Label MS) Do you want Microsoft products to automatically generate smart tags on your web pages. Yes No Enter Captcha To Continue (Kode Verifikasi) To prevent spamming, please enter in the numbers and letters in the box below Report Problem with Tool.

Apa Itu Meta Tag?

Apa itu Meta Tag? Bagi blogger yang sudah lama mengeluti dunia per-bloggeran pasti sudah tidak asing lagi dengan meta tag ini, namun bagi blogger awam yang baru memulai blog, mungkin akan bingung dengan meta tag ini, maka dalam postingan ini saya akan membahas tentang meta tag ini.

Apa itu Meta Tag? Meta tag adalah potongan kode informasi yang diletakkan di tag-tag blog di bagian HTML. Meta tag itu sangat penting bagi sebuah blog. Tanpa meta tag sebuah blog tersebut tidak akan bisa menghasilkan pengunjung-pengunjung melalui SE atau Search Engine. Maka dari itu kita sebagai blogger wajib memasang meta tag di blog kita.

Ada dua cara dalam menulis Meta Tag, yaitu:

1. META HTTP-EQUIV="name" CONTENT="content"/>
2. META NAME="name" CONTENT="content"/>

Catatan: Boleh juga CONTENT duluan, baru NAME. (terserah saja)

Meta tag itu ada bermacam-macam, ada meta tag pilihan, meta tag yang direkomendasikan, dan ada juga meta tag yang tidak direkomendasikan.

Meta Tag yang direkomendasikan:
Meta Content Language (non-US English ONLY)
Meta Content Type
Meta Description

Meta Tag Pilihan:
Meta Abstract
Meta Author
Meta Copyright
Meta Designer
Meta Google
Meta Keywords
Meta MSN (No ODP)
Meta Title

Meta Tag yang tidak direkomendasikan:
Meta Content Script Type
Meta Content Style Type
Meta Distribution
Meta Expires
Meta Generator
Meta MS Smart Tags
Meta Pragma No-Cache
Meta Publisher
Meta Rating
Meta Refresh
Meta Reply-To
Meta Resource Type
Meta Revisit After
Meta Robots
Meta Set Cookie
Meta Subject
Meta VW96.ObjectType

Dulu pada pertengahan tahun 90an, Meta tag dikembangkan untuk membantu pertumbuhan yang cepat dari halaman web/blog. Namun pada akhir 90-an ada kejadian besar. Banyak Webmaster, umumnya mereka yang berada pada situs dewasa menyalahgunakan penggunaan Meta tag, terutama meta tag keyword. Banyak kata kunci yang tidak terkait ditempatkan di situs mereka di bagian Meta tag, menyebabkan situs porno mereka muncul di hasil pencarian padahal tidak terkait dengan topik.

Beredar kabar, google mulai tidak memperhatikan mengenai meta tag yang dipasang di blog, belum pasti alasannya. Namun bagi anda, jangan berkecil hati, itu hanya isu sementara dan masih banyak search engine lainnya yang mengindex melalui meta tag.

Mungkin segitu saja postingan saya hari ini tentang apa itu meta tag dan semoga pengunjung sobat dapat memahami apa itu meta tag yang sebenarnya. Jika anda ingin memasang meta tag, sebaiknya yang seo friendly. Lihat pada artikel cara membuat meta tag seo friendly untuk sebuah blog nantinya. semoga bermanfaat

Cara Membuat Spoiler di Blog/Forum

Pada pembahasan kali ini kita akan membahas tentang membuat spoiler di blog/forum. Spoiler kebanyakan digunakan untuk meringankan load konten agar tidak terlalu berat.

Spoiler adalah cara untuk menyembunyikan seluruh atau sebagian isi dari konten blog kita. Spoiler juga bermanfaat agar konten yang berat seperti gambar dalam ukuran besar dan video tidak diload sebelum menekan tombol show. Dengan kata lain spoiler membantu kita mengurangi waktu load konten blog dan memberikan pilih kepada pembaca blog untuk membuka atau tidak isi spoiler



Anda sudah sering lihat Spoiler di kaskus atau forum-forum untuk nyembunyikan gambar, link dan konten lainnya. Spoiler ada dua yaitu untuk forum misalnya kaskus dan satunya lagi untuk dipergunakan di blog/web. Keduanya memiliki kode yang berbeda.

• Spoiler Forum misalnya di KASKUS:
[spoiler=judul spoiler]isi spoiler[/spoiler]

Ganti tulisan yang berwarna hijau sesuai judul dan isi spoiler yang anda kehendaki.

• Spoiler untuk blog/web:
Menyembunyikan konten tertentu dari sebuah halaman blog/website diperlukan untuk menghemat space. Ketika visitor ingin melihatnya mereka dapat dengan mudah menampilkannya. Begitupun dalam software forum semacam vBulletin, Spoiler pasti banyak digunakan.

Berikut kode yang bisa digunakan dalam membuat spoiler di blog :

<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Tentang bla..bla.bla.. </span></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

isi spoiler...

</div></div></div></div>

Kode HTML diatas akan memberikan hasil seperti dibawah ini:

Tentang bla..bla.bla..

isi spoiler...

Jika ada pertanyaan silahkan ditanya, jangan sungkan-sungkan sob.