Cara Membuat Blog Valid CSS3
Cara Membuat Blog Valid CSS3 - Membuat blog Valid HTML 5 Mungkin mudah, tapi kalau membuat blog Valid CSS3 Saya yakin tidaklah mudah dan hanya 5% orang yang memiliki template valid CSS3 .. Daripada saya membuat tutor cara buat blog valid html5 rasanya bosan karena di google sudah bejibun tutorial seperti itu tapi kalau cara membuat blog Valid CSS3 masih sedikit jadi saya buat aja deh, heheh ..
Sama dengan HTML 5 tentunya CSS3 berfungsi untuk memperbaiki kode CSS yang error pada template sehingga membuat template lebih ringan / cepat loadingnya ..
Cara Membuat Blog Valid CSS3 :
WARNING : Sebelum melakukan cara dibawah ini, hendaknya backup dulu template kamu
1. Login ke blogger
2. Pilih template > Edit html
3. Jangan lupa centang expand template widgets
4. Cari kode
5. dan hapus kode tersebut dan silahkan check seberapa banyak error kode css blog sobat di http://jigsaw.w3.org/css-validator/ ..
Jika sobat menemukan pesan kode error seperti ini :
Nah tenang saja , kita bisa menghapus kode pesan error tersebut, beginilah caranya :
1. Login ke blogger
2. pilih template > Edit html
3. jangan lupa centang expand template widgets
4. Cari kode <b:skin><![CDATA[
5. Hapus kode tersebut dan ganti dengan kode dibawah ini :
6. Lalu pratinjau dulu , kalau tidak ada error silahkan simpan
dan check di http://jigsaw.w3.org/css-validator/ , apabila masih belum valid css3
Sobat bisa belajar tentang css3 dan belajar lengkap agar blog sobat bisa valid css3 : DISINI
Sama dengan HTML 5 tentunya CSS3 berfungsi untuk memperbaiki kode CSS yang error pada template sehingga membuat template lebih ringan / cepat loadingnya ..
Cara Membuat Blog Valid CSS3 :
WARNING : Sebelum melakukan cara dibawah ini, hendaknya backup dulu template kamu
1. Login ke blogger
2. Pilih template > Edit html
3. Jangan lupa centang expand template widgets
4. Cari kode
- http://www.blogger.com/static/v1/widgets/1576120009-widget_css_bundle.css
5. dan hapus kode tersebut dan silahkan check seberapa banyak error kode css blog sobat di http://jigsaw.w3.org/css-validator/ ..
Jika sobat menemukan pesan kode error seperti ini :
- 1 .backlink-toggle-zippy Value Error : cursor hand is not a cursor value : hand
- 1 .status-msg-border Parse Error opacity=40)
- 1 .status-msg-bg Parse Error opacity=30)
- 1 .widget .widget-item-control a img Value Error : padding none is not a padding value : none
- 1 Unknown pseudo-element or pseudo-class ::root [root .goog-custom-button]
- 1 Unknown pseudo-element or pseudo-class ::root [root .goog-custom-button-outer-box]
- 1 Unknown pseudo-element or pseudo-class ::root [root .goog-custom-button-inner-box]
- 1 .FollowByEmail .follow-by-email-inner input Unknown pseudo-element or pseudo-class ::-webkit-input-placeholder [-webkit-input-placeholder]
- 1 Unknown pseudo-element or pseudo-class :-moz-placeholder
- 1 .label-size-1 Property filter doesn't exist : alpha(80)
- 1 .label-size-2 Property filter doesn't exist : alpha(90)
- 1 .Stats .blind-plate Parse Error opacity=65)
- 1 .widget.Subscribe .widget-content Property zoom doesn't exist : 1
- 1 .subscribe-wrapper Property zoom doesn't exist : 1
- 1 div.subscribe div.top attempt to find a semi-colon before the property name. add it
- 1 div.subscribe div.top Property progid doesn't exist : DXImageTransform
- 1 div.subscribe div.top Parse Error DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.blogger.com/img/widgets/s_top.png',sizingMethod='crop');
- 1 Parse Error [:1em;padding:4px 0 1px;width:144px}html>body div.subscribe div.top]
- 1 div.subscribe div.bottom attempt to find a semi-colon before the property name. add it
- 1 div.subscribe div.bottom Property progid doesn't exist : DXImageTransform
- 1 div.subscribe div.bottom Parse Error DXImageTransform.Microsoft.AlphaImageLoader(src='http://www.blogger.com/img/widgets/s_bottom.png',sizingMethod='crop');
- 1 Parse Error [:3px;height:3px;line-height:0}.subscribe-wrapper .expanded]
Nah tenang saja , kita bisa menghapus kode pesan error tersebut, beginilah caranya :
1. Login ke blogger
2. pilih template > Edit html
3. jangan lupa centang expand template widgets
4. Cari kode <b:skin><![CDATA[
5. Hapus kode tersebut dan ganti dengan kode dibawah ini :
- <style type="text/css">
<!-- /*<b:skin><![CDATA[*/
6. Lalu pratinjau dulu , kalau tidak ada error silahkan simpan
dan check di http://jigsaw.w3.org/css-validator/ , apabila masih belum valid css3
Sobat bisa belajar tentang css3 dan belajar lengkap agar blog sobat bisa valid css3 : DISINI
wah..ini penting nih..amankan..
BalasHapusnyari kode http://www.blogger.com/static/v1/widgets/1576120009-widget_css_bundle.css di edit html sampek mapus juga gak bakal ketemu..
BalasHapushahhaahhaaaa
saya masih ada masalah sob,
BalasHapus#sikil-mabur attempt to find a semi-colon before the property name. add it
-1 #sikil-mabur Parse Error null
432 #sikil-mabur Parse Error 90) }
477 .infox Parse Error hidden
565 Sorry, the at-rule @-webkit-keyframes is not implemented.
1007 .emo.delayLoad Too many values or values are not recognized : none
1008 Parse Error [empty string]
Sepertinya tutorial ini kurang, kenapa hanya tag pembuka <b:skin> sajah, di bagian penutupnya tidak di kasih ini:
BalasHapus]]><b:skin/></style>
Terus juga untuk validasi CSS3 tidak hanya itu saja, ada banyak hal yang masih harus diperhatikan.
terima kasih atas tutornya kerana dapat mengurangi error blog saya sampai 50 %
BalasHapusgan klo ada pesan error begini ,bagian yang harus di ubah sebelah mana y,nyari sampe pusing gk ktmu
BalasHapusProperty mso-fareast-font-family doesn't exist : "Times New Roman"
1697 Property mso-fareast-language doesn't exist : IN
1701 Property mso-fareast-font-family doesn't exist : "Times New Roman"
1701 Property mso-fareast-language doesn't exist : IN
2224 Value Error : width Too many values or values are not recognized : autopx
mantap sob :D
BalasHapusmantabs bro...skrg errornya berkurang cuma 2 ...
BalasHapus1. .comments .comments-content .icon.blog-author
2. .main-inner .fauxcolumn-center-outer
klo boleh tanya itu knp ya bro?
mampirlah ke blog ane http://sebutik.blogspot.com