Beberapa hari ini Admin Full Blog Design disibukkan Optimasi Tampilan Blog agar lebih Seo dan valid saat di cek di Validasi Html5 (Maklum Job Lagi Sepi jadi ada waktu untuk obrak abrik template ),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 Agar Blog Valid HTML5 Dan Seo dan berhasil saya terapkan (Semoga sobat juga menerapkan nya),blog saya 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 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 ,nah pada pertemuan kali ini Admin Full Blog Design akan membasmi Kode siluman tsb agar blog kita berhasil dan valid Css3 ,berikut caranya
- Download Lengkap Template sebelum melakukan Trik ini
- 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 :
<style type="text/css">
<!-- /*<b:skin><![CDATA[*/]]></b:skin> - selanjutnya tepat dibawah nya pasang kode ini :
<style type='text/css'>
bla...bla...bla.....bla...bla
</style> - Sehingga nantinya kode menjadi seperti ini :
<style type="text/css">
<!-- /*<b:skin><![CDATA[*/]]></b:skin>
<style type='text/css'>
bla...bla...bla.....bla...bla
</style> - Masih ingat dengan kode css yang di paste di notepad tadi silahkan copy dan Paste pada kata Bla ....bla...bla...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 )
Judul Artikel :Cara Agar Blog Valid Css3
73 komentar
saya sudah lama ngga cek blog mas, mungkin sudah banyak yang error alias tidak valid lagi, makasih mas, kalo ada waktu bisa diterapin nih triknya
memang semua tergantung ama waktu mas karena sebagian waktu kita memang tersita ama rutinas kerja sedangkan blog saya kira hanya sekedar Hobby saja matur nuwun untuk kehadiran nya
Hehehe kali ini kayaknya satu hati nih...saya juga posting tentang hal ini hehehe...
Untuk warningnya masih ada dua tuh mas... coba di kode body kan ada font:x-small Georgia Serif; nah hapus salah satunya.
Siap langsung ke TKP...
Keren ini yang saya tunggu tunggu ... Hehehehee
iya mas blog saya juga masih banyak errornya, kapan2 saya coba mas...
Wah udah saya terapkan lagi sob , tanks ya
Gan Cara Membuat Dropcap Pada KOmentar Bagaimana...???
Tolong Di Poting Gan ATau Kunjungi Blog Syaa
Terimakasihhh Di tunggu pencerahannya
Yes , akhirnya udah CSS3 juga , makasih sob :D
Bukan fungsi gan saya kira manfaat nya.., ya agar blog kita ramah sama semua browser jika blog kita valid pada Html5,css3,dan seo maka Insya Allah Postingan Kita cepat terindex dan untuk mencobanya silahkan buka web/blog yang sudah valid dengan HP yang paling jadul pun akan cepat terbuka (tentunya harus terkonex dengan internet)
triknya sangat membantu mas tapi template ane html5 masih 155 eror dan 9 warning, untuk jigsawnya 1019 eror :v
tapi seo score chkme udah 100%
mas saya mau tanya kenapa jumlah posting di homepage blog ane cuma kelihatan 2 posting, padahal di setting post udah ane set 5 post, dan kl ane klik next post yang keluar sampai 6 post.
urlny lelembot.com
mhon petunjuknya
om blog ku koq g muncul gambarnya ya waktu di share di social media .,. apakah ada kode yang ke hapus., klo ada di bagian mana om ??? sorry om kebanyakan nanya ??? lagi asyik otak atik template
saya kira itu sudah biasa terjadi punya ku juga kadang sering gak muncul tapi biasanya kalau gak salah setiap kita akan share ke media di situ kan ada pilihan gambar gambar yang akan di tampilkan ini biasanya dalam bentuk hover kurang lebih bentuknya kayak gini
"<>"saat ini tidak dapat memberi contoh karena sudah saya buat otomatis share ke facebook dan tweeter saat pertama share artikel baruatau saya tambahin lagi di situ ada kotak chacklist dengan tulisan tanpa fotomini biarkan kosong yang itu (jangan di ceklist)
oo gitu ya om .,., masalahnya sekarang sudah muncul tapi g saya apa2in,, kronologinya begini om blog baru ku masih ada 4 artikel iseng2 aku share di fb eee koq g muncul kirain ada masalah setelah otak atik template.,. tapi pas artikel ke lima muncul.,. apa memang dari sononya ya om ???
Akang mohon cex lagi Html5 udah valid skarang tinggal CSS nya bingung ap pnyebab tidak validnya http://winmediatv.blogspot.com thnks
pada bagian #search-result...hilangkan kode ini
-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4);
-moz-box-shadow:0 1px 3px rgba(0,0,0,.4);
untuk lebih lanjut add saya di https://www.facebook.com/mahfid.wist/
akan saya pandu dari sana
bang mau nanya eror css3 saya tinggal satu lagi fimana cara menghilangkannya, Ini Kodenya
.post
Property positon doesn't exist : relative
atau lihat di : http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fcontoh-contoh-template01.blogspot.com%2F
terang aja eror seharusnya position bukan positon dan juga warningnya juga banyak tuh 74 warning coba hapus semua kode yang berhubungan dengan -moz-,-webkit-,dan yang terakhir -0- karena semua kode itu tidak valid pada Html 5 contoh misal :
maksud saya kode -moz-,-webkit-,dan -o- tidak valid pada css3
ane sudah coba trik diatas, masih banyak yang eror mas,,gimana cara mengatasinya? mohon bantuannya mas mafid...thanks
kok yang saya lihat kodenya beda ya mas coba lihat lagi karena css bundle nya masih terlihat dari sini atau coba copy codenya di bagian atas dan bawah kode
]]><b:skin>sudah ane coba/praktekkan lagi mas mafid, masih eror juga. yang harus dihapus mana mas?
coba ganti kode
oh ya kayaknya ada kode kayak ginihapus aja kode itu
tapi kenapa dibagian tata letak agak hancur
sebenarnya bukan hancur sob cuma tersusun kebawah/melorot dan itu semua terjadi ama blog yang udah valid (coba cari info ama blog yang udah valid tentang hal ini, Kompi ajaib misal nya )
Oke Sob
disini ada gak tutorial untuk membuat blog responsive
gak ada sob belum kepikiran
oooooooooooo
kalau sudah ada tolong beri tahu saya.
atau kalau abang ngerti caranya tolong bimbing saya via FB.
facebook.com/denbagoes.ungguldcompany
pusing saya om ngatasin css error
Lakukan dulu trik yang di atas pasti banyak error yang akan dapat di atasi selanjutnya ...perbaiki sisanya mungkin saya bisa bantu
sob caranya buat g+follower melayang di sidebar gimana sob...?
Review ini:
http://www.fullblogdesign.com/2013/06/auto-hide-widget-with-scroll-animation.html
sob mau nanya nih ,, gimana caranya mengatasi
Bad value for attribute src on element script: Must be non-empty
pada Validator w3
coba hapus kode ini pada html
Makasih sob akhiranya berhasil juga
itu kan sisa 1 error coba ikuti trik di atas untutk menyembunyikan css bundle ,konsukwensinya terjadi perubahan pada tata letak yang akan berjejer kebawah ,karena semua blog yang sudah valid biasanya kaya gitu dan yang paling penting selalu cek saat setelah tambah widget atau habis update postingan
sudah saya perbaiki sob.
mantab ...sudah valid html5 tinggal valid css 3...coba hilangkan semua css kode -moz-,-webkit-,-o-,karena kode seperti ini tidak valid pada css3 akibat nya tentu tampilan tidak maksimal pada browser opera dan IE tapi akan terbaca dengan baik oleh kedua browser tersebut perubahan hanya pada tampilan saja
sob cara mengurangi eror di css gimana sob
punya ane masih eror 14 .
thank you mas ... dari kmaren udah 2 hari saya cari " ekh ad di sini makasih banyak ...
berhasil mas, tapi jadi berantakan smw isi widgetnya, sprti popular post, dan menu navigasinya ga tentu arah haha :D
lho kok bisa mas..mas menggunakan browser apa
saya coba gan moga berhasil
Silahkan sob
makasih mas infonya, ane sudah perbaiki css blog saya tp kok masih ada erro iya?
#nav li Parse Error ;*display:inline;
kalau saya hapus * menu nav blog saya jadinya brsusun ke bawah.
errornya ada pada bagian ini juga
#PopularPosts1 ul li{bla bla
warna border sama background tidak boleh sama atau kalau memang tidak akan menggunakan border hapus aja bordernya
terima kasih sarannya mas. errornya tinggal 2.
sudah pusing carinnya tidak ketemu. Mohon sarannya lagi, pesannya kaya gini mas.
Parse Error px
http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fnazcules.blogspot.com%2F&profile=css3&usermedium=all&warning=1&vextwarning=&lang=en
Salam ketemu, Mas menarik artikel izin simak
yah,. terima kasih atas info dan berbaginya,.
mampir juga di blog saya,. Karrysta
http://karristaent.blogspot.com/
penyebabnya apa mohon bantuannya
http://prntscr.com/1sedy0
cari kode
.breadcrumbs{bla-bla}}
tag penutupnya lebih satu hapus tag penutup } yang terakhir
manteb kang tutorialnya sangat membantu sekali
eror mulu
Sangat bermanfaat banget buat blog saya yang error terus.
http://febi27.blogspot.com/
terima kasih mas untuk tutorialnya tapi saya masi mengalami beberapa error pada css3 8 error dan 21 warn. o_O selain css setelah mengalami pembenahan agar valid html 5 saya masi menemui 5 error dan 2 warn. masi sangat banyak error nya dan saya bingung belum nemu cara mecahin masalah tersebut. kalo akang bersedia tolong cek di
http://masdifa-blog.blogspot.com/
Anti copas dan anti Ctrl+ u nya juga menyumbang satu error mas coba hapus saja kembalikan seperti semula kodenya seperti ini
hapus kode di atas ganti dengan
<body>emang setelah valid html5 belum tentu valid css3 mas mahfid,blogku sekarang masih ada 98 error nih,gaktau cara benerinnya,bantuin dong
<3coba hapus kode yang berawalan -moz-,-webkit-,-o-, kode ini tidak valid css3 contohnya kaya gini
maka jika kode -moz- dan -webkit- kita hapus kodenya akan menjadi seperti ini
box-shadow:0 2px 2px rgba(0,0,0,0.6)sudah diterapin tp cuman ngurangin warningnya masbrow,kalau errornya tetep gak berkurang.contohnya kayak gini mas:
body Value Error : color Lexical error at line 3, column 62. Encountered: "t" (116), after : "$" :textcolor;
2 Unknown pseudo-element or pseudo-class :x-small
2 font Georgia Serif Value Error : color Parse Error Serif;
2 Unknown pseudo-element or pseudo-class :small
2 font-size Value Error : color Parse Error small;
2 Unknown pseudo-element or pseudo-class :center
pada bagian body[--------- hapus/ganti kode
color:$textcolorsemalam sudah jos gandos kotos kotos mas,aq coba oprek sendiri sampai kepalanya mau mbledos mas,memang ada 10an kesalahan kayak kodecolor:$textcolor
keren sob ..tapi coba liat pake firefox kayaknya ada yang salah pada bagian sidebar..
tinggal warning satu mas kek gini:Family names containing whitespace should be quoted. If quoting is omitted, any whitespace characters before and after the name are ignored and any sequence of whitespace characters inside the name is converted to a single space
apa ya disidebar yang salah? kulihat yg agak mengganggu kode - disamping cari artikel itu mas,nggak tau cara ngapusnya
biasanya kalau warning seperti itu ada font-family yang terdiri dari 2 atau 3 kata mas misal
font-family:Times New Romanmaka agar valid pada css 3 maka kata Times New Roman harus di apit tanda petik maka jadinya seperti ini
font-family:"Times New Roman"Kak bantuin saya cara mengatasi ini dunk, saya sampai sekarang belum bisa mengatasinya
Error Line 18, Column 128: & did not start a character reference. (& probably should have been escaped as &.)
…n.css?targetBlogID=6673542326556106003&zx=6e2921fb-faf6-4789-a739-d0b727b2c0f1…
Blog : http://grosire-parfum.blogspot.com
Bisa di tolong, tinggal satu ini saja saya sudah Valid HTML, trims dlu
Sudah saya terapkan seperti yang mas jelaskan di atas, tapi errornya dab warningnya tidak berubah, mohon bantuanya mas ..
www.infobarumaluku.com
makasih sudah bermanfaat bagi saya untuk membuka blog yang tidak lelet.... by muizcyan-xp
Artikel ini sangat bermanfaat buat saya.
Mohon infonya mas, apakah ini bisa saya terapkan pada blog saya.
oh ya, blog saya : satu-untuk-semuanya.blogspot
mas punya ane masih ada erornya.....bisa beri pencerahan? trims... ini blognya
http://semakinbermanfaat.blogspot.com/mas kalau kodenya kayak gini ini gimna cara ngtasinya ya gan ?
#autoXML2045190120451901 Same color for background-color and border-left-color
Posting Komentar
Terima Kasih Sobat Sudah:
1. Berkomentar Dengan Sopan
2. Tidak Memasukkan Link Aktif Dalam Form Komentar
3. Berkomentar Sesuai Artikel/Postingan
4. Berilah Informasi Kepada Admin Jika ada script yang Sudah tidak berfungsi
5. komentar Jorok/kasar /berbau Sara/Porno /saya anggap sebagai SPAM
6.untuk memasukkan gambar gunakan <i rel="image">URL Gambar</i>