Loading...

Membuat Blog jadi Valid CSS3

ajatshare 10:16 | 21 Comments

Membuat Blog jadi Valid CSS3

Beberapa hari ini saya disibukkan Optimasi Tampilan Blog agar lebih Seo dan valid saat di cek di Validasi Html5, nah berkaitan dengan tujuan di atas maka saya coba buat artikel Membuat Blog jadi Valid CSS3 tujuan nya adalah agar template kita lebih Seo dan artikel kita lebih mudah di telusuri oleh mesin pencari Google, Setelah beberapa waktu lalu sudah membahas cara Membuat Blog jadi Valid HTML5 dan berhasil saya terapkan, meskipun sudah Valid Html5 dan Scor Seonya sudah 100% tanpa meninggalkan link yang rusak ,ternyata itu belum selesai ,Saat blog kita cek di W3C Validasi Servis ,seakan tidak percaya blog yang kita anggap Valid Html5 dan Seo ternyata menyisakan banyak Error pada Kode CSS ,untuk membuktikan nya silahkan cek blog sobat di http://jigsaw.w3.org/css-validator/, sama halnya dengan blog saya ini ternyata Error code Css banyak terdapat pada kode bawaan blogger yang kita kita kenal css_bundle,mungkin kode ini secara kasat mata tidak dapat kita lihat karena menurut Bang Andy yang punya Kompi Ajaib kode ini disebut kode siluman, pada kesempatan ini AjatShare akan membasmi Kode siluman tsb agar blog kita berhasil dan valid Css3 ,berikut caranya:

1. Download Lengkap Template sebelum melakukan Trik ini
2. Coba cari kode ini <b:skin><![CDATA[ selanjutnya Cut (Ctrl + X) semua kode CSS di bawah nya ,
    ingat hanya kode css nya sampai pada kode ]]></b:skin> lalu paste pada NOTEPAD
    Sehingga nantinya setelah kode css nya kita pindahkan pada NOTEPAD akan menyisakan kode berikut

<b:skin><![CDATA[ ]]></b:skin>
Ganti kode <b:skin><![CDATA[ ]]></b:skin> dengan kode berikut ini :

&lt;style type=&quot;text/css&quot;&gt;
&lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>

selanjutnya tepat dibawah nya pasang kode ini :

<style type='text/css'>
.....masukan kode css disini.....
</style>

    Sehingga nantinya kode menjadi seperti ini :

&lt;style type=&quot;text/css&quot;&gt;
&lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>
<style type='text/css'>
.....masukan kode css disini.....
</style>

 3. Masih ingat dengan kode css yang di paste di notepad tadi silahkan copy dan Paste pada kata
      .....masukan kode css disini.....
4. Lakukan preview dahulu jika ternyata tidak ada Error Save template

Pada tahap ini sudah banyak kode error yang sudah teratasi silahkan cek kembali template sobat di Css Validasi Servis (linknya ada di atas bagian artikel ini )

Mudah-mudahan tips di atas dapat mengatasi Css yang tidak valid saya yakin masih banyak kode kode css yang lain yang tidak dapat saya sebutkan disini sebelum sobat mengeceknya di http://jigsaw.w3.org/css-validator/
 
Masukan email Anda untuk Dapatkan Update terbaru dari AjatShare BloggerPrint PDF
Membuat Blog jadi Valid CSS3
Membuat Blog jadi Valid CSS3 - written by ajatshare, published at 10:16, categorized as CSS, Template Hack . And have 21 comments
Facebook Twitter Google+ Linkedin Technorati Digg DMCA.com

21 comments

Tambah komentar

CSS3 codes are vital in designing a good and interactive website. But some of the old browsers (IE6+) are not supporting this. Thank you for sharing.

GET FREE BACK-LINKS : WWW.PRACTICALBACKLINKS.COM

Thank you for visiting our humble blog this, your visit is an honor and privilege for me.

susah jg ya hehe, masi bingung saya

sering praktek saja nanti juga bisa

Diperhatikan dulu ini mas kodenya karena masih sedikit bingung.

berhasil mas tapi masih ada yang error, mohon solusi nya mas

Barusan sudah saya periksa blog Mas Imamul dan terdapat 56 error ternyata kesalahan terbanyak ada pada bundle.css. Saya akann bantu sedikit:
1. Pasang kode tersebut di atas, dan hapus
<link type='text/css' rel='stylesheet' href='https://www.blogger.com/static/v1/widgets/3189209027-widget_css_bundle.css' />

2. Pada kode seperti ini, Parse Error [:url(http://3.bp.blogspot.com/-2sCW1cHbG6I/Ui0twA4XVcI/AAAAAAAALRg/6it6coVPPOs/s1600/bk_social.jpg) 0 0 repeat-x;font-size:12px;line-height:32px;padding:0 10px;-moz-border-radius:8px;-webkit-border-radius:8px;border:1px solid #008ff5;#footerWidgetsInner #copyright], tambahkan koma pada kode yang ditandai #footerWidgetsInner, #copyright]

Masih Banyak errornya bagimana nih mas

Coba perhatikan pada layar W3C CSS Validator pada kolom ketiga atau sebelah kanan, tertulis kata-kata Error disanalah letak kesalahan kode yang harus diperbaiki.
Saya coba bantu 4 baris pertama yang error tersebut, selanjutnya silahkan anda coba sendiri.

Parse Error */#navbar-iframe{display:none !important}
hapus tanda *
Parse Error [,] hapus tanda ,
Value Error : margin px is not a margin value : 0 0 0 px
hapus kode px
Parse Error 4px:0 8px} hapus tanda :

Parse Error Lexical error at line 2, column 1. Encountered: "<" (60), after : "<\n" itu maksudnya apa mas?

Padahal baru seminggu belum ada buat nya,
tapi udah banyak yang error.

Maksudnya ada kesalahan dalam penulisan kode atau kode tsb tidak dikenal oleh validator.

Coba hapus kode seperti di bawah ini:
1. https://www.blogger.com/static/v1/widgets/4171472146-widget_css_bundle.css
2. Ganti Kode auto\000009 dengan auto saja.

Sisanya silahkan coba sendiri.

Sudah oke sih mas, saya cek di page speed insights bisa sampai 98. namun kok muncul tulisan page diatas menu home ? Thks atas penjelasannya

trimaksih atas infoya

saya sudah coba kodenya tapi gak bisa pratinjau dan save template.
mohon bantuannya mas...:)
satu-untuk-semuanya.blogspot

Saya juga nih mas tolong ya.
http://bangjakwae.blogspot.com

Wah.. ternyata CSS ada cek validnya juga ya gan, ane kira cuma HTML doank
Ternyata template ane saat ini masih banyak erorr nya -_-

infonya menarik bingitz sob, keren abiss...
jangan lupa kunbalnya dong
http://e-dre.blogspot.com

apa ini tidak berpengaruh dalam tata letak blogger jika kode b:skin dipindah semua ke style?

  • Berkomentarlah dengan baik, sopan dan sesuai dengan isi konten serta tidak [SPAM].
  • Untuk menyisipkan kode dalam komentar harap di [Konversi] terlebih dahulu.
  • Jika ingin bertanya di luar judul artikel "Membuat Blog jadi Valid CSS3". Harap menggunakan tombol [OOT].

Forum DiskusiOut Off Topic (OOT)Formulir KontakArsip Blog
-->