Membuat Pagerank Checker Tool Valid HTML5

Membuat Pagerank Checker Tool Valid HTML5

Bola Hero Gawai

Membuat Pagerank Checker Tool Valid HTML5

Pagerank Checker Tool Valid HTML5
Menjelang update Pagerank Google season kedua di tahun 2014 ini, kita membuat Pagerank Checker Tool sebagai alat untuk memeriksa Pagerank blog kita. 

Salah satu penyedia online Pagerank Checker Tool ini adalah Prchecker.info yang menyediakan sebuah tool untuk disimpan di blog. Namun setelah saya coba ternyata toolnya tidak valid HTML5, nah untuk itu kini kita akan membuat Pagerank Checker Tool ini menjadi valid HTML5.

Penempakan Pagerank Checker Tool dari Prchecker.info ini seperti gambar di bawah ini.

Screenshot Pagerank Checker Tool

Dan kodenya seperti berikut:


<div style="text-align:center;">
<table cellspacing="1" style="margin:10px auto 40px;width:400px;border:1px solid #DDD;text-align:center;">
<tr><td style="background:#D1FFA4;vertical-align:middle;">
<p style="font-size:11px;font-family:Verdana;margin:0px;padding:2px;color:#666;"><strong>Check Page Rank of your Web site pages instantly:</strong></p>
</td></tr>
<form action="http://www.prchecker.info/check_page_rank.php" method="post" style="margin:0px;padding:0px;">
<tr><td style="border:1px solid #CCC;padding:10px;background:#DDD;">
<input type="hidden" name="action" value="docheck">
<input type="text" value="http://" name="urlo" maxlength="150" style="width:250px;padding:1px 2px 2px 3px;margin-right:10px;font-size:13px;font-family:Arial;">
<input type="submit" name="submit" value=" Check PR " style="width:80px;font-size:11px;font-family:Arial;padding:1px;">
</td></tr>
</form>
<tr><td>
<p style="margin:0px;padding:3px 0px 1px 0px;color:#AAA;font-size:9px;font-family:Verdana;">This page rank checking tool is powered by <a href="http://www.prchecker.info/" target="_blank">Page Rank Checker</a> service</p>
</td></tr></table>
</div>

Dan dari kode di atas ternyata menyebabkan sekitar 5 buah error pada validasi HTML5. Untuk itu saya sudah merubah beberapa kode agar valid HTML5 namun tampilannya tetap sama. Dalam HTML5, kode form tidak boleh berada dalam kode table, untuk itu saya rubah kode table-nya menjadi div.

Nah bagi yang ingin menyimpan Pagerank Checker Tool valid HTML5, silahkan gunakan kode di bawah ini dan simpan di halaman statis.


<div style="text-align:center;">
<div style="margin:10px auto 40px;width:394px;border:1px solid #DDD;text-align:center;padding:2px">
<div style="background:#D1FFA4;vertical-align:middle;">
<p style="font-size:11px;font-family:Verdana;margin:0px;padding:3px 2px;color:#666;"><strong>Check Page Rank of your Web site pages instantly:</strong></p>
</div>
<div style="border:1px solid #CCC;padding:10px;background:#DDD;margin:2px 0 1px">
<form action="http://www.prchecker.info/check_page_rank.php" method="post" target="_blank" style="margin:0px;padding:0px;">
<input type="hidden" name="action" value="docheck">
<input type="text" value="http://" name="urlo" maxlength="150" style="width:250px;padding:1px 2px 2px 3px;margin-right:10px;font-size:13px;font-family:Arial;outline:none">
<input type="submit" name="submit" value=" Check PR " style="width:80px;font-size:11px;font-family:Arial;padding:3px 1px 2px;cursor:pointer">
</form>
</div>
<div>
<p style="margin:0px;padding:4px 0px;color:#AAA;font-size:9px;font-family:Verdana;">This page rank checking tool is powered by <a href="http://www.prchecker.info/" target="_blank" rel="nofollow" title="Page Rank Checker">Page Rank Checker</a> service</p>
</div></div>
</div>

Untuk mencobanya silahkan masuk di sini Check PAGE RANK of Website Pages Instantly

Share this:

Share this with short URL: Get Short URL loading short url

You Might Also Like:

Disqus
Blogger
Pilih Sistem Komentar Yang Disukai

31 Comments Add Comment

Jadi lebih pas ya Kang.

Salam

Balas

Makasih kang andy :)
Absen dulu lagi hujan :)

Balas

Betul mas biar semuanya valid hehehe :)

Balas

Wah sama mas di sini juga lgi hujan :)

Balas

Kode widget ini sudah saya gunakan lama.. di side bar homepage. Tp sudah dimodifikasi jadi lahan iklan he..he..
Tp ngak tau deh valid apa enggak :D

Balas

Menarik nih Kang Adhy saya belum punya pagerank checker
Langsung di coba Kang Makasih atas tutorial bermanfaat ini :-bd

Balas

Oh iya saya tahu yang iklan itu hehheehe :) asal di dalam table-nya tidak terdapat form seperti di atas maka table-nya bisa valid html5 dan jika ada kode pengatur tampilan tablenya sebaiknya di-inline-kan dengan menggunakan style agar valid :)

Balas

Maaf Mas Andos Kang Adhy, numpang Absen daftar
Hadir disini untuk belajar. terima kasih :)

Balas

Sama-sama kang Saud :) silahkan dicoba kang :)

Balas

Hehehehe silahkan kang :)

Balas

Hehehe, PR saya masih 0 mas .... nanti kalau sudah dapat PR baru saya pasang dah :)

Balas

wah gimana nih btw page rank udah di update belum, dan kapan updatenya? untuk jaga-jaga lebih saya cobain tipsnya kang... :D

Balas

Menarik kang, nanti akan saya ubah kodenya. Siip dah ... :-d

Balas

Kebetulan saya juga mau tanya yang ini Kang sebelum masang :D, ada info gk Kang kira-kira kapan PR update...???

Balas

Maaf mas mau tanya, kalau ingin mengubah form komentar sesuai panjang lebarnya kodenya sebelah mana ya?
seperti ini contohnya http://s28.postimg.org/hlbdwenn1/Comment.jpg
Matur Suwun =D

Balas

simpan link dulu mas, makasih yah =D

Balas

Heeheehe mudah2an kedepannya dapet PR ya mas :)

Balas

Silahkan mas biar makin klop sama theme blognya :)

Balas

Jika menggunakan threaded comment hack cari kode ini .comment-form

Balas

Silahkan mas :)

Balas

saya numpang absen juga disini mas Adhy, hehehe :D
saya takut pasang pagerank checker krn PR saya dari dulu gak naik2 =( tapi saya simpen dulu nih script ntar kalau PR saya naik lgsg dipasang diblog biar bisa digunakan ngecheck PRnya pengunjung sewaktu2 :)

makasih sharingnya :-bd

Balas

hehe keren, yang inipun bisa di validkan, oh ya mas, coba lihat blog ini mas, kok responsive nya seperti berantakan? mohon beri petunjuknya mas

http://moteor-shark.blogspot.com/

Balas

sukses di buat mas http://hollabacktexas.blogspot.com/p/page-rank-checker.html , bisa bantu biar responsive di blog saya mas adhy

Balas

Dari dulu belum dapat pagerank :(

Balas

mantap gan. blognya bagus lagi semoga http://ksatria-biru.blogspot.com/ bisa menyusul :D

Balas

wah ternyata ada juga kode untuk menampilkan kode mengecek page rank.. terimakasih gan udah sharing

Balas
Add Comment

Komentar dengan link promo akan masuk spam.

Gunakan konversi tool jika ingin menyertakan kode atau gambar.


image
How to style text in Disqus comments Top Disqus Commentators
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Box

How to get ID DISQUS - http://disq.us/p/[ID DISQUS] - lihat di sini

strong em u strike
pre code pre code spoiler
embed

Like Kompi Ajaib? Keep us running by whitelisting Kompi Ajaib in your ad blocker.

This is how to whitelisting Kompi Ajaib in your ad blocker.

Thank you!

×
×
×