Modifikasi Widget Follower Menjadi Valid Html5
Modifikasi Widget Follower menjadi Valid HTML5 - Dalam pemasangan widget follower kita terhubung dengan teman-teman kita yang sudah ikut bergabung tapi bila anda yang menyukai valid HTML5 pemasangan follower ini akan menambah error validasi pada template anda. Jika anda ingin menciptakan widget follower ini semoga valid HTML5 silahkan sedikit modifikasi.
Berikut langkah-langkahnya, pertama masuk ke dashboard blogger anda dan masuk ke tata letak atau layout
1. Tambahkan widget Follower dengan cara Tambah gadget > Gadget lainnya (more gadgets) > pengikut,biasanya berapa pada halaman pertama dan letakknya di paling bawah, abaikan cara ini bila anda sudah memasangnya.
2. Buka halaman blog , klik kanan pada halaman blog anda dan pilih "Inspect Elemen" atau tekan CTRL+U
3. pada sourcecode silahkan cari kata renderMembersGadget,tekan ctrl+f semoga memudahkan dalam pencarian.Lihat gamar berikut:
Pada gambar diatas yang di kasih kotak warna kuning dan merah silahkan anda simpan id dan site di notepad. sekarang anda sudah mengetahui id dan site blog anda,pada tahap ini anda dapat menghapus widget follower tersebut dan ganti dengan widget yang baru.
4. Sekarang pergi ke tata letak lagi dan tambahkan gadgets > tambahkan HTML/Javascript > Masukkan aba-aba berikut pada kotak "Content"
Pada tampilan diatas anda dapat memodifikasi warna dan dan ukurannya. lihat gambar berikut
Pada Kode Berikut langkah-langkahnya, pertama masuk ke dashboard blogger anda dan masuk ke tata letak atau layout
1. Tambahkan widget Follower dengan cara Tambah gadget > Gadget lainnya (more gadgets) > pengikut,biasanya berapa pada halaman pertama dan letakknya di paling bawah, abaikan cara ini bila anda sudah memasangnya.
2. Buka halaman blog , klik kanan pada halaman blog anda dan pilih "Inspect Elemen" atau tekan CTRL+U
3. pada sourcecode silahkan cari kata renderMembersGadget,tekan ctrl+f semoga memudahkan dalam pencarian.Lihat gamar berikut:
![]() |
gambar dari blog.rismawan.com |
4. Sekarang pergi ke tata letak lagi dan tambahkan gadgets > tambahkan HTML/Javascript > Masukkan aba-aba berikut pada kotak "Content"
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script> <div id="div-q8v3x4yh588r" style="width:auto;border:1px solid #c0392b;"></div> <script type="text/javascript"> var skin = {}; skin['FACE_SIZE'] = '32'; skin['BORDER_COLOR'] = '#e74c3c'; skin['ENDCAP_BG_COLOR'] = '#c0392b'; skin['ENDCAP_TEXT_COLOR'] = '#fff'; skin['ENDCAP_LINK_COLOR'] = '#c0392b'; skin['CONTENT_BG_COLOR'] = '#95a5a6'; skin['CONTENT_LINK_COLOR'] = '#0027cf'; skin['CONTENT_TEXT_COLOR'] = '#333333'; skin['CONTENT_HEADLINE_COLOR'] = '#007b03'; skin['NUMBER_ROWS'] = '5'; google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */); google.friendconnect.container.renderMembersGadget( { id: 'div-q8v3x4yh588r', site: '00647019856377971921'}, skin); </script>
Lihat pada aba-aba yang aku kasih garis bawah silahkan ganti id dan site dengan aba-aba yang sudah anda simpan sebelumnya di notepad atau dimana anda meletakkannya.Pada tampilan diatas anda dapat memodifikasi warna dan dan ukurannya. lihat gambar berikut
Keterangan:
1. ENDCAP_LINK_COLOR
2. ENDCAP_BG_COLOR
3. BORDER_COLOR
4. ENDCAP_TEXT_COLOR
5. CONTENT_HEADLINE_COLOR
6. CONTENT_BG_COLOR
7. FACE_SIZE (ukuran avatar)
8. Garis pada bab kanan silahkan ganti kode #c0392b
9. CONTENT_LINK_COLOR (warna link)
10.CONTENT_TEXT_COLOR
1. ENDCAP_LINK_COLOR
2. ENDCAP_BG_COLOR
3. BORDER_COLOR
4. ENDCAP_TEXT_COLOR
5. CONTENT_HEADLINE_COLOR
6. CONTENT_BG_COLOR
7. FACE_SIZE (ukuran avatar)
8. Garis pada bab kanan silahkan ganti kode #c0392b
9. CONTENT_LINK_COLOR (warna link)
10.CONTENT_TEXT_COLOR
skin['NUMBER_ROWS'] = '5';
ialah berapa jumlah baris yang akan ditampilkan angka 5
sesuai keinginan.Setelah tadi penambahan widget pada template silahkan hapus aba-aba
<b:include name='quickedit'/>
Begitulah Cara Modifikasi Widget Follower menjadi Valid HTML5 . Semoga bermanfaat