Download Template SEO Friendly Valid HTML 5

Download Template SEO Friendly Valid HTML 5 adalah template  Premium yang sejuta trik blogger persembahkan untuk pengunjung setia blog ini. (Walau gak Premium Amat) hehe. Bagi teman-teman yang menginginkan blognya valid HTML 5, silakan baca dengan cermat artikel ini dan jangan ada yang kelewatan.

Bicara valid HTML 5, bukan bertujuan untuk pamer, Saya posting di Curhat HTML 5 malah ada yang tidak percaya tentang valid HTML 5. Nah untuk itu, saya berikan blog saya yang sudah Valid HTML 5. nah berikut ini blog saya.

http://status-status-lucu.blogspot.com

silakan cek di kanan bawah dan lihat hasilnya!

Untuk itu, bagi yang berminat template SEO Friendly Valid HTML 5

Berikut ini deskripsinya. 

Tampilan Homepage :

Tampilan Layout :

Blog Editor :
http://free-7.blogspot.com/

URL :
http://seofriendlyblogspottemplate.blogspot.com/

Karya :
Iwan Rachmanto

Edit Ulang :
Ahmad Maryuki

Fitur :
a. SEO FRIENDLY
b. < 70 ERORR CSS
c. PASSED 1 WARNING (S)
d. VALID HTML 5
e. DAN LAIN-LAIN POKONYA MEMUASKAN.
f. YANG JELAS BUATAN ANAK BANGSA GAN! HE HE HE

DOWNLOAD
DEMO

Peringatan : 
1. Jangan Menghapus Credit di akhir HTML.
2. Untuk Masalah SEO dll silakan edit sendiri, dengan alasan template itu masih orisinil sesuai dengan yang diberikan oleh Editor di atas. Ahmad Maryuki hanya menambah HTML 5 ke dalam template tersebut yang semula dari TRANSITIONAL.
3. Jika saat dicek di V3 ternyata menemukan masih error, silakan kirim pesan ke FACEBOOK Saya.
4. Template di atas tidak ada 1 pun widget yang terpasang, jadi saat upload template, jika ada peringatan, klik KEEP WIDGET
5. Bebas iklan gan
6. Bebas Virus
7. Bebas Biaya, he he he
     dll 

Update : 

Untuk Kotak komentar yang dimunculkan, jika sudah ada komentar akan menimbulkan erorr yang sangat banyak, solusinya gunakan Komentar discus, atau gunkan komentar Facebook. Caranya lihat di Membuat Komentar Facebook Valid HTML 5

Untuk label pun mengandung error yang buanyak, solusinya gunakan cara Membuat Label Dengan HTML

Sejuta trik hanya memohon bantuan jempolnya untuk kemajuan blog ini. Maka dari itu Jika sahabat SUKA dengan artikel ini, share ke teman2, jangan lupa klik likenya ya sahabat!

Happy Blogging! by. Sejuta Trik Blogger

read more...

Membuat Menu Vertikal Pelangi Di Blogspot

Membuat Menu Vertikal Pelangi Di Blogspot adalah menu tegak yang biasa dipakai di blogger akan tetapi menampilkan tampilan yang berwarna-warni. Sebenarnya membuat menu pelangi di blogspot sangat mudah sekali. Yuk membuat menu pelangi di blog kita!

Sebenarnya kelebihan dari menu vertikal pelangi di blog ini adalah untuk menarik pengunjung dengan warna-warna pelangi untuk menjelajahi isi blog kita. Benar bukan?

Dalam membuat menu pelangi di blogspot kita hanya membutuhkan kode CSS dan HTML sebagai kunci utamanya. Dengan cara ini kemungkinan penggunaan gambar sebagai background untuk membuat menu juga bisa kita lakukan.

Sejuta Trik Blogger berharap blog ini tidak seperti kelemahan pelangi. Yaitu bentuknya cantik tapi cepat menghilang. Wah jangan sampai ya! Kalau itu terjadi, saya hanya bilang TERLALU!ha ha ha. Untuk yang sudah master CSS mohon dibetulkan jika saya keliru dalam kodenya!

Baik langsung saja kita membuatnya.

A. Pada bagian EDIT HTML (Design) kita akan taruh kode CSS di bawah ini :

Untuk CSSnya kita hanya menambahkan "request" warna untuk menjadikannya pelangi. Kodenya adalah sebagai berikut:

#leftnav {
width: 200px;
position: relative;
margin-left: 5px;
margin-top: 20px;
float: left;
margin-right: 5px;
margin-bottom: 5px;
}
#leftnav ul
{
margin-left: 0;
padding-left: 0;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
}

#leftnav a
{
display: block;
padding: 3px;
width: 160px;
background-color: #12366A;
border-bottom: 1px solid #eee;
}

#leftnav a:link, #navlist a:visited
{
color: #EEE;
text-decoration: none;
}

#leftnav a:hover, #leftnav a.request:hover
{
background-color: #FA5858;
color: #000;
}

#leftnav a.request

{
color: #12366A;
background-color: #F5A9A9;
}






#leftnav a:hover, #leftnav a.request2:hover
{
background-color: #FE9A2E;
color: #000;
}
#leftnav a.request2
{
color: #12366A;
background-color: #F5D0A9;
}







#leftnav a:hover, #leftnav a.request3:hover
{
background-color: #F4FA58;
color: #000;
}
#leftnav a.request3
{
color: #12366A;
background-color: #F3F781;
}






#leftnav a:hover, #leftnav a.request4:hover
{
background-color: #ACFA58;
color: #000;
}
#leftnav a.request4
{
color: #12366A;
background-color: #ACFA58;
}





#leftnav a:hover, #leftnav a.request5:hover
{
background-color: #58FA58;
color: #000;
}
#leftnav a.request5
{
color: #12366A;
background-color: #A9F5A9;
}

Keterangan :

1) background-color: #12366A;  (Warna Kepala Menu)
2) width: 200px; (Lebar kotak)
3) font-family: Arial, Helvetica, sans-serif; : (Jenis Huruf)
4) 1 sampai 5 adalah menu 1 sampai 5
5) 

#leftnav a:hover, #leftnav a.request:hover
{
background-color: #FA5858;

dan seterusnya adalah warna yang tampil

6)

#leftnav a.request2
{
color: #12366A;
background-color: #F5D0A9;
}

adalah warna perubahan

7) Selanjutnya edit sendiri ya? Jika butuh kode warna silakan kunjungi KODE WARNA HTML. Atau jika menemukan kode dan tidak tahu warnanya silakan gunakan tool PARSE KODE WARNA. Tinggal masukkan kodenya kemudian enter!

8) Paste kode di atas di atas ]]></b:skin>

9) Warna hover paling akhir mempengaruhi perubahan pada kepala menu vertikal tersebut. Jadi apabila warna perubahan atau hover paling akhir berwarna hijau, maka kepala menu vertikal akan berubah hijau pula.

10) Untuk menambah link silakan tambah ke request 6, dan seterusnya.

B. Jika sudah masukkan kode HTML di Add Widget seperti biasa

<div id="leftnav">
<ul id="navlist">
<li id="active"><a href="http://www.unitcoins.us/" id="current">Home</a></li>
<li><a class="request" href="http://www.unitcoins.us/quote.shtml">Request a Quote</a></li>
<li><a class="request2" href="http://www.unitcoins.us/quote.shtml">Request a Quote</a></li>
<li><a class="request3" href="http://www.unitcoins.us/quote.shtml">Request a Quote</a></li>
<li><a class="request4" href="http://www.unitcoins.us/quote.shtml">Request a Quote</a></li>
<li><a class="request5" href="http://www.unitcoins.us/quote.shtml">Request a Quote</a></li>
</ul>
</div>

Happy Blogging! by. Sejuta Trik Blogger

Nah, sekarang sudah jelas kan cara membuat menu vertikal pelangi di blogspot? Semoga trik sederhana ini membantu sahabat semua.

Demo :

• Home
• Request a Quote
• Request a Quote
• Request a Quote
• Request a Quote
• Request a Quote

read more...

Cara Compress Blogspot Yang Benar

Cara Compress Blogspot Yang Benar menurut Sejuta Trik Blogger adalah suatu cara optimasi blogspot menggunakan alat-alat website baik itu software (ofline) ataupun situs penyedia jasa compress (online) dengan maksud untuk mempercepat loading atau muat secara utuh suatu blog.

Di dalam SEO tentunya kecepatan atau loding suatu blog atau website menjadi pertimbangan bagi search engine agar tampil di posisi utama hasil pencarian. Memang saat blog kita lama memuat secara penuh juga akan membuat pengunjung blog kita kabur karena jengkel dengan loading blog yang sangat lama. Nah sahabat tidak ingin semua itu terjadi kan?

Setelah mondar-mandir di mbah google ternyata tutorial yang disajikan semuanya asal-asalan. Kenapa saya bilang asal-asalan, karena tidak mementingkan keselamatan dari blog pengunjung. (Mohon maaf jika kata-kata saya ini menyinggung blogger lain).

Saya sempat emosi, dikarenakan saya sudah percaya 100% eh ternyata setelah dipraktekkan blog menjadi rusak alias kurang sesuai harapan. Tapi tidak apa-apa dengan begitu saya jadi semangat menulis artikel ini. Bagi sahabat yang sudah mengalami kejadian seperti itu, saya harap setelah membaca artikel Cara Compress blogspot yang benar ini, kerusakan tidak terjadi lagi. Dan tujuan untuk mengkompress blogspot untuk mempercepat loading blogspot sesuai harapan.

Mari kita bahas dari langkah-langkahnya. Sebelum memulai kompresi blogspot diharapkan membaca ini :

a. Element Blogspot
Element Blogspot penyusun template kurang lebih ada tiga (3) pilar utama yaitu Cascading Style Sheet (CSS), Java Script, dan HTML.
b. Dari ketiga (3) macam element tadi harus dikompresi tersendiri.
c. Perhatian! Jangan mengcopy seluruh kode mulai dari <b:skin><![CDATA[ hingga ]]></b:skin> secara total dan mengcompress nya di tool compressor.
d. Backup dulu Template Sahabat sebelum melakukan kompresi
e. Kesabaran dan Ketelitian
f. Berdo'a

Jika dirasa sudah paham dan dilakukan, kita mulai dari CSS

1. Cascading Style Sheet (CSS)

Untuk kode CSS biasanya ditunjukkan/ dimulai dengan tanda bintang (*), Dot (.) dan Pagar (#). Untuk melakukan kompresi, Silakan copy semua kode yang ditunjukkan dengan tanda di atas. Jangan Centang satupun tool CSS Compressor. Dan pastikan hanya Kode CSS yang dimasukkan. Tool yang digunakan untuk mengkompress CSS Blogspot yaitu CSS Compressor.

Jika sudah, Copy paste dan Klik Compress.

TIPS
1) Untuk CSS sebenarnya dengan cara manual sudah bisa yaitu menghapus spasi dan enter di setiap kode CSS. Contoh :

#header-wrapper{

width:940px;

margin:10px auto;

padding:10px 0;

}

Menjadi :

#header-wrapper{width:940px;margin:10px auto;padding:10px 0;}        dan seterusnya. Hasinya pun hanya sekitar 2-5 Kb saja. Apakah kamu kurang kerjaan? he...he..

2) Jangan gunakan background gambar di bagian .body { url  kalaupun ada, ukuran gambar kira-kira 15-25 Kb saja dan jangan terlalu mencolok.

3) Usahakan jangan ada CSS yang ganda, selain eror juga menambah berat loading

2. Java Script atau Javascript code

Didalam javascrit juga harus memperhatikan kode javascript yaitu dimulai dengan tanda <script type='text/javascript'> atau <script> bisa juga <script scr='alamat js.'>. Untuk mengkompres javascript kita memerlukan tool yaitu yang bernama Javascript Compressor. Pastikan hanya kode javascript yang dimasukkan! Setelah itu compress.

TIPS
1) Untuk melakukan commpres javascript yang benar jangan compres memua kode, Hanya kode didalamnya saja yaitu kode yang diapit antara <script type='text/javascript'> atau <script> kode javasript yang dicompress </script> atau //]]>
2) Usahakan jangan menaruh javascript dari tempat hosting lain. Ini akan membuat loading berjalan lama.

3. HTML

Seperti halnya langkah Mengkompres CSS. Penggunaan backdash dan spasi dalam html blog akan membuat loading lama. Jadi disarankan penggunaan backdash dan spasi yang sewajarnya. Tool yang digunakan adalah HTML Compressor

TIPS
1) Penggunaan backdash dan spasi di HTML Blog juga berpengaruh pada loading dan tampilan blogspot. Penggunaan backdash dan spasi biasanya digunakan sebagai batas antara element. Biasanya penggunaan paling banyak ada di bagian komentar Blogspot. Maka dari itu tampilan komentar mengandung rongga atau spasi ke bawah yang lebar.
2) Hapus di bagian yang menurut sahabat banyak menggandung lebar ke bawah yang tidak penting.

Tips lain berkaitan dengan Cara Compress Blogspot Yang Benar

* Upload gambar yang ukuran tidak terlalu besar

* Kurangi penggunaan flash yang berat

* Isi widget yang tidak terlalu banyak penggunaan javascript

* Hilangkan widget-widget yang sekiranya tidak bermanfaat seperti jam dll

* Tempatkan widget-widget yang memudahkan pengunjung menelusuri isi blog kita

* Jangan menampilkan Posting di halaman depan lebih dari 5 posting (solusinya tampilkan hanya judul saja)

* Jangan menggunakan emotion yang berlebihan pada kotak komentar

* Verifikasi kata pada kotak komentar

* Memasang auto musik dapat memberatkan blog

* Jangan menggunakan Jquery lebih dari 4 macam dalam 1 blog

* Compress setiap gambar sebelum diupload ke tempat hosting menggunakan Software Fast Photo Resizer 

Sekiranya itu saja yang sejuta trik blogger share tentang Cara Compress Blogspot Yang Benar. Mudah-mudahan artikel ini bermanfaat bagi pengunjung setia blog ini. Akhir kata, ayo semangat blogger Indonesia!

Image loading by : alexander-zulkarnain.blogspot.com

Happy Blogging! by. Sejuta Trik Blogger

read more...

Google Pagerank Checker Tools

Google Pagerank Checker Tools adalah alat online untuk mengetahui tingkat Pagerank Google yang selalu update setidaknya paling cepat setiap triwulan sekali. Nah untuk memudahkan mengecek Google Pagerank di blog sobat gunakan Google pagerank checker tools di bawah ini.

Cara penggunaan Google Pagerank Checker Tools :

1. Klik kanan setiap link yang dipilih kemudian open new tab

2. Sahabat diminta untuk memasukkan link homepage di kotak url setiap alamat Google pagerank checker tools tersebut. 

3. Tunggu beberapa saat dan kemudian akan terlihat hasilnya.

Baik langsung saja pilih dari salah satu Google pagerank checker tools di bawah ini

http://mypagerank.net/service_pagerankbutton_index

http://www.prchecker.info/

http://www.seocentro.com/tools/search-engines/pagerank.html

http://www.selfseo.com/check_google_pagerank.php

http://pagerank.databot.nl/

http://www.smallseotools.com/google-pagerank-checker/

http://webinfodb.net/

http://www.page-rank.pl/

http://www.google-pr.net/

http://www.prbutton.net/

http://www.prmonitor.net/check-pagerank.html

http://pagerank.my-addr.com/

http://www.masspagerank.com/

http://www.whatsmypagerank.com/pagerank-checker.php

http://www.isubmitlinks.com/PageRankChecker.aspx

Untuk lebih lengkapnya akan selalu saya update agar memudahkan para sahabat SEO blogger mengetahui tingkat pagerank menggunakan tools ini. Akhir kata semoga Google Pagerank Tools ini bermanfaat untuk blogger semua.

Happy Blogging! by. Sejuta Trik Blogger

read more...

Tips Ganti-ganti Template

Bagi sebagian blogger seperti saya ganti-ganti template adalah hal yang menyenangkan. Akan tetapi masalah yang timbul dari ganti-ganti template adalah posisi serp yang tidak menentu. Belum lagi kalau kata kunci yang kita bidik sudah menjadi black list google. Seperti blog ini, nah bagi teman-teman yang sering ganti-ganti template, mulai sekarang berhentilah.

Seperti blog ini sudah berganti template sebanyak 7 kali. Dengan begitu kata kunci yang saya bidik dulu pada posisi pertama, sekarang merosot entah dimana. Apa mungkin karena update alogaritma atau bagaimana yang jelas ganti-ganti template sungguh sangat merugikan blog itu sendiri.

Nah untuk sobat yang biasa ganti-ganti template seperti saya. Sejuta trik blogger ada tips ringan yang bisa mengurungkan niat sobat-sobat untuk mengganti template dengan cara menggunakan fitur blogger yang baru.

Ok langsung saja kita view blog kita dengan tampilan bawaan blogger tapi kita tidak mengganti template blog. Wah-wah-wah emang bisa? Emmn bagi sobat yang belum tahu, yuk lihat gambarnya dulu.

1. Classic

2. Flipcard

3. Magazine

4. Mosaic

5. Sidebar

6. Snapsot

7. Timeslide

Dari pada kita ganti-ganti template, kita gunakan saja fitur baru google yaitu dinamic view. Dalam fitur barunya itu kita tidak mengganti template hanya saja kita dapat memilih layout yang kita inginkan. Memang baru sebatas 7 macam. Saya rasa sudah cukup mengobati penasaran kita untuk gonta-ganti template blogspot.

Nah untuk menjalankannya kita hanya menaruh view di belakang blog kita. Contoh

http://sejutatrik.blogspot.com/view

Dengan begitu kita bisa melihat tampilan yang menarik dari layanan blogger tersebut. Nah mudah-mudahan tips ganti-ganti template menggunakan dinamic view ini bisa mengobati rasa penasaran kita dalam ganti-ganti template.

Happy Blogging! by. Sejuta Trik Blogger

read more...

Dampak Erorr Blogger 14 Desember 2011

Ternyata blogger hari ini sedang dalam masa maintenance, bukan mantenan. haha. Akan tetapi blogger sedang ada tahap pemeliharaan. Dulu sebelum domain dot co.cc dihapus sebelumnya juga ada masalah kayak seperti ini. Lantas dampak erorr blogger 14 Desember 2011 apa? yuk kita lihat gambar di bawah ini !

Lihat jumlah penelusuran, Sekitar 269.000 hasil (0.30 detik) padahal sebelumnya saya perhatikan dari minggu perminggu anik sekitar 1.000 hasil. Yang semula hampir mendekati 1.000.000 sekarang menjadi seperti gambar di atas. Apa yang terjadi dengan google dan bloggernya ya?

Dengan kata lain hasil dari penelusuran google mengindikasi adanya pemangkasan dari hasil pencariannya.

Apakah Webmaster Tool sudah diberlakukan? Ataukan ini dampak dari Alogaritma baru Google. Yang jelas bagi sobat yang cermat melihat perkembangan blog sobat dari hasil penelusuran google, akan tau bedanya. 

Ataukah ini masalah dari saya sering gonta-ganti template saya sendiri juga bingung. Ataukah saya mengoptimasi SEO Blogger saya secara berlebihan? Nah bagi yang masih mengalami masalah dengan blogger, silakan sharing di kotak komentar tentang dampak erorr blogger 14 Desember 2011.

Happy Blogging! by. Sejuta Trik Blogger

read more...

Membuat Label Dengan HTML

Apa kelebihan Membuat Label dengan HTML? Demi membuat valid HTML template, sekaligus membahas SEO Friendly, ternyata label di dalam blog kita mengandung masalah tentunya dengan SEO dan Validnya. Nah untuk menyikapi hal tersebut mari kita optimalkan blog kita dengan membuat label dengan HTML

Nah mari kita bahas satu persatu.

1. SEO

Untuk blogger kaitannya antara SEO dengan Label adalah jauh sekali. Saya baca di blognya juragan, bahwa memasang link label di postingan untuk masalah SEO adalah pekerjaan yang sia-sia. Nah hal ini cukup beralasan, lihat URL label di bawah ini :

http://sejutatrik.blogspot.com/search/label/SEO

di link label SEO di atas tidak akan saling berkaitan, karena label tersebut menggunakan search untuk menampilkan URL. Jika kita memasang url label, akan sia-sia. Maksudnya walaupun kita menaruh puluhan link label ke dalam posting, sampai kiamat gak akan saling berkaitan. Benar bukan?

2. Valid

Ternyata setelah saya cek di validator V3, masalah yang ditimbulkan untuk label adalah eror untuk & dan lain-lain. Coba perhatikan blognya hendro prayitno, deconstruction code, chilarsip, dll. Sebagian besar blog yang valid HTML5 tidak menaruh label dalam sidebar. Dengan kata lain blog yang valid HTML5 menggunakan Template 1 Kolom.

Nah sekarang kita ganti label bawaan blogger dengan HTML. Caranya cukup mudah yaitu mengganti navigasi di bagian Edit HTML menjadi Widget di sidebar.

Caranya cukup mudah, Silakan copas kode yang ada di bawah ini ke dalam Widget atau Add Element blog sobat.

<div id="tabs"> 
<ul> <li><a href="http://status-status-lucu.blogspot.com/"><span>Label 1</span></a></li> 
        <li><a href="http://status-status-lucu.blogspot.com/"><span>Label 2</span></a></li> 
        <li><a href="http://status-status-lucu.blogspot.com/"><span>Label 3</span></a></li> 
        <li><a href="http://status-status-lucu.blogspot.com/"><span>Label 4</span></a></li>
</ul> </div>

DEMO

Jika dirasa sudah berjalan sukses, hapus label bawaan blogspot.

Tidak semua template mendukung cara ini, silakan saja sesuaikan dengan menu di bagian edit HTML sobat masing-masing. Hasil label dengan HTML di atas masih sederhana dan efeknya tergantung bawaan template sobat blogger semua.

Nah semoga dengan membuat label dengan HTML bisa mengurangi error di blog sobat. Selamat berjuang!

Happy Blogging! by. Sejuta Trik Blogger

read more...

Curhat Tentang HTML 5

Mohon maaf pada teman2 setia blog ini, yang lama sekali gak update dikarenakan banyak urusan di dunia nyata. hahaha. Nah posting kali ini berkaitan dengan penggunaan html 5 di blog. Sejuta trik blogger mau curhat tentang HTML 5. Bagi yang sudah master HTML 5 mohon pencerahannya.

Bagi para master penggunaan HTML 5 mungkin lebih mudah penggunaannya dibanding model sebelumnya. Tapi tidak bagi saya yang masih coba coba penggunaan HTML 5 sangat sulit sekali. Belum lagi kode yang masih baru. Nah berikut ini curhat tentang penggunaan template bassic HTML 5 di blog saya Status-Status Lucu

1. Di HTML 5, ternyata proses indeks ke google lebih cepat dari yang sebelumnya. Padahal metode yang digunakan dengan blog saya ini sama.

2. Di HTML 5, apabila kita memasukkan kode <div> yang diikuti css yang sama atau yang memiliki karakter sama, misal membuat 2 menu dengan css yang sama, apabila di cek di validasi V3 ternyata menjadikan eror karena mengandung duplikat atau kode yang sama. Padahal kode strukturnya sudah benar.

3. Blog yang menggandung HTML 5, kadang tidak bisa diterjemahkan ke dalam goolge terjemahan.

4. Untuk SEO jika menggunaan meta tag yang tidak benar, tenyata mempengaruhi posisi serp. Nah untuk no.4 ini perlu master-master yang menjawabnya.

5. Untuk HTML 5 pada masalah webmastertool, akan diindikasi tanpa masalah, padahal saya tidak memasukkan deskripsi, meta tag, autor, atau apalah itu, yang jelas blog masih tidak ada bawaan keyword dll, kok bisa-bisanya tidak ada masalah di webmaster tool. Padahal posting juga sudah belasan.

6. Untuk Masalah Validasi HTML 5, ternyata paling mudah dari semua pendahulunya. Dikarenakan penggunaan <div> yang sedikit sekali. Tapi untuk template yang bukan bawaan HTML 5, alitas modifikasi, masalah Validasi juga sama sulitnya. Jadi gunakan yang bawaan HTML 5 dan kita harus rela berkorban memotong beberapa fungsi yang banyak mengandung error.

7. Beberapa fungsi blogger yang menerapkan HTML 5 kadang bekerja lambat ataupun tidak berjalan. Seperti proses pengindeksan. Saya mencentang pada setting agar blog saya tidak terindeks ke google, tapi kenyataannya tetap terbaca oleh google. Nah untuk fungsi dan pengaturan yang lain kurang lebih seperti itu, seperti google frined connect yang berjalan agak lama dari biasanya.

Nah emang kalau curhat HTML 5 di sini banyak yang tidak tersampaikan. Bagi sobat yang mau membantu blog saya atau mengalami kejadian serupa dengan blog saya, mohon share di kotak komentar. Makasih.

Happy Blogging! by. Sejuta Trik Blogger

read more...

Membuat Komentar Facebook Valid HTML 5

Membuat Komentar Facebook Valid HTML 5 adalah pilihan ke2 setelah menambah komentar discus di blog untuk membuat kotak komentar yang valid HTML 5. Memang kotak komentar facebook memiliki banyak sekali eror. Belum lagi jika komentar pengunjung sudah saking buanyaknya. Justru akan menambah eror yang lebih banyak lagi.

Bagi sahabat yang sampai hari ini belum juga memasang komentar yang valid html 5. Ataupun bagi sahabat yang masih menggunakan template doctype STRICT atau TRANSITIONAL yang masih belum berhasil, Berikut cara yang mungkin dicoba.

DEMO

1. Silakan Menuju ke http://developers.facebook.com/setup/
2. Klik Aplikasi
3. Anda akan dibawa pada gambar di bawah ini (Isikan sesuai selera) Toh tidak terlihat siapa pun.

4. Klik lanjutkan dan Anda akan di bawa ke gambar di bawah ini

 5. Klik Kirim, dan akan menjumpai seperti di bawah ini

6. Simpan hasilnya. Dan menuju ke https://developers.facebook.com/docs/reference/plugins/comments/

7. Jika sudah klik Get Code

8. Kode di atas akan kita tempatkan berbeda tempat.

9. Kode no.1 kita taruh pada EDIT HTML di bawah <body>

10. Jika sudah, Klik simpan. Untuk kode no.2 kita taruh di ADD ELEMENT seperti menambahkan widget. (ukuran kotak komentar secara default adalah 500. Silakan edit sesuai selera.

11. Taruh dimana anda suka, entah dibawah posting, di bagian header atau footer terserah kita.


PENTING!
Kode HTML pada gambar 7 adalah kode untuk HTML 5. Jadi apabila kita menggunakan strict atau transitional silakan klik dulu iframe.

Nah. Itu saja tentang membuat komentar facebook valid html 5. Semoga membantu.

Update !
Untuk teman-teman yang ingin memiliki template valid HTML 5 sekaligus SEO Friendly khusus blogger silakan Download Template SEO Friendly Valid HTML 5

Happy Blogging! by. Sejuta Trik Blogger

read more...