Skip to main content

Modifikasi Tampilan Widget Followers Valid HTML5

Modifikasi Tampilan Widget Followers
Menambahkan widget Followers  (Google Friend Connect) akan memberikan keuntungan terhadap blog kita, diantara keuntungannya adalah Link artikel kita akan muncul pada dashboard pengikut / followers. Akan tetapi terkadang tampilan widget ini tidak sesuai dengan apa yang kita inginkan.
Dengan melakukan hal ini, bukan saja merubah tampilan widget followers, tapi juga akan membuat blog valid HTML5. Syaratnya, setelah semua langkah selesai, hapus kode 
<b:include name='quickedit'/>
Dibawah ini screenshoot hasil modifikasi dan valid HTML5.


Apabila sobat ingin membuat tampilan berbeda, atau ingin membuat widget valid HTM5, silahkan ikuti dengan cermat langkah-langkah berikut ini.

Langkah 1 : Tambahkan widget Followers (lewati langkah ini kalau sudah ada)
Untuk menambahkannya klik Tata Letak -> Tambahkan Gadget -> Gadget Lainnya -> Pengikut

Langkah 2 : Buka blog sobat.
Klik liat sumber laman / view page source

Langkah 3 : Cari kata kunci renderMembersGadget dan lihat kode dibawahnya.
Perhatikan pada kode id dan site. seperti pada gambar di bawah ini:

Langkah 4 : Buat widget baru HTML/JavaScript, simpan kode ini :
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>

<div id="div-4769418095313647753" style="width:300px;border:1px solid #ff4800;"></div>

<script type="text/javascript">

var skin = {};

skin['FACE_SIZE'] = '42';

skin['BORDER_COLOR'] = '#000';

skin['ENDCAP_BG_COLOR'] = '#ff0000';

skin['ENDCAP_TEXT_COLOR'] = '#fff';

skin['ENDCAP_LINK_COLOR'] = '#f0ff00';

skin['CONTENT_BG_COLOR'] = '#ddd';

skin['CONTENT_LINK_COLOR'] = '#0027cf';

skin['CONTENT_TEXT_COLOR'] = '#333333';

skin['CONTENT_HEADLINE_COLOR'] = '#007b03';

skin['NUMBER_ROWS'] = '4';

google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);

google.friendconnect.container.renderMembersGadget(

 { id: 'div-4769418095313647753',

   site: '17038536110807365684'},

  skin);

</script>
Tugas sobat adalah mengganti 2 kode ID dan 1 site, dengan kode yang didapat dari page source (Langkah 3).
Langkah 4 : Hapus widget Followers bawaan Blogger (ihat Langkah 1)

Langkah 5 : Hapus kode 
<b:include name='quickedit'/>
supaya valid HTML5.
Sampai di sini, sobat sudah membuat tampilan yang berbeda dari biasanya dan widget sudah valid HTML 5.

"Modifikasi Tampilan Widget Followers"

Untuk memodifikasi sesuai keinginan sobat, buka kembali widget yang tadi dibuat (Langkah 4), edit warna dan pengaturannya. Untuk memudahkan editing lihat panduan gambar dan keterangannya :
Keterangan :
1. ENDCAP_LINK_COLOR
2. ENDCAP_BG_COLOR (Background atas / contoh gambar warna merah)
3. ENDCAP_TEXT_COLOR (tulisan : With Google Friend Connect)
4. BORDER_COLOR (garis dibawah blok merah)
5. CONTENT_HEADLINE_COLOR (Tulisan Member 530)
6. CONTENT_LINK_COLOR (tulisan More dan Sign in)
7. Garis pinggir, ganti kode warna #ff4800
8. FACE_SIZE (ukuran avatar)
9. CONTENT_BG_COLOR (background bawah)
10. CONTENT_TEXT_COLOR (tulisan Already a member?)

Kode skin['NUMBER_ROWS'] = '4'; adalah berapa baris avatar ditampilkan. Ganti angka 4 sesuai keinginan. Sesuaikan juga lebar widget dengan mengganti kode 300px.

Sumber:http://blog.kangismet.net/ semoga bermanfaat........
Labels:

Comments

Post a Comment

Peraturan Saat Berkomentar:
1. Menggunakan bahasa yang sopan
2. Tidak melakukan spamming
3. Tidak menyisipkan link aktif atau pun hidup


Komentar yang tidak sesuai akan dihapus :)

Popular posts from this blog

Cara Baru Memperbanyak Like status Di Facebook

Artikel Tentang "Cara Memperbanyak like status Facebook " Telah saya Perbarui Pada Tanggal 23,January 2017 Dan Masih terbukti bisa diaplikasikan. Status di Facebook memang sangat beragam dari yang mengandung informasi, candaan bahkan keluhan juga ada. Bebasnya mengakses facebook maka berpengaruh pada jumlah pengguna facebok itu sendiri, dalam aturannya, yang boleh menggunakan facebook adalah yang sudah 18 tahun keatas. Tapi kenyataanya tidak demikian, anak-anak pun sekarang merajai jejaring sosial tersebut, mereka akan senang apa bila status facebook mereka di like banyak orang. Untuk mendapatkan like tersebut maka banyak upaya yang dilakukan seperti ADD teman sebanyak mungkin bahkan yang mereka tidak kenal sekalipun. Sebenarnya ada jalan pintas yang bisa digunakan untuk mendapatkan like banyak   dalam sekejap mata, langsung saja akan saya uraikan  triknya disini. Login ke Facebook terlebih dahulu dan atur publis status menjadi publik (jika tidak maka tidak bisa). ...
35 comments
Read more

Cara Paling Mudah Melihat Orang Yang Sering Membuka Profil Facebook Kita

Ok sobat "Dunia Blogger" Pada kesempatan kali ini saya akan Berbagi Trik/ Cara Paling Mudah Melihat Orang Yang Sering Membuka Profil Facebook Kita , Langsung Ke tutorialnya saja yah dari pada kebanyakan cingcong  :D Pertama : Login dulu Ke Facebook Sobat. Tekan CTRL+U Pada Keyboard Atau bisa juga dengan  Klik Kanan pada mouse =>> view page source/ lihat code sumber laman 3. Nanti akan ada tab seperti gambar dibawah ini: 4. Tekan CTRL+F lalu masukan kata berikut: InitialChatFriendsList seperti contoh gambar di atas setelah itu tekan enter, dan disebelah tulisan "InitialChatFriendsList" akan ada beberapa nomer, lalu copy nomer tersebut (ingat hanya  yang didalam tanda petik) semakin kebelakang nomernya maka kurun waktu melihat profil sobat semakin dekat. 5. Untuk melihatnya buka http://facebook.com/No id yang tadi sobat copy Contoh: Coba satu persatu untuk mengetahui yang paling banyak melihat profil sobat. 6.Finish.... Demikianlah t...
4 comments
Read more

Mengatasi Kulit wajah Berminyak Secara Alami

    Sobat punya masalah dengan kulit wajah berminyak? Ingin tau penyebab dan cara jitu mengatasi kulit berminyak tersebut? Mari kita simak ulasan berikut ini. Penyebab kulit berminyak adalah kelenjar sebaceous yang bekerja secara berlebihan yang menyebabkan kulit wajah lebih berminyak dan timbul banyak bintik-bintik hitam atau putih di wajah. Ciri-ciri jenis kulit berminyak :     Lapisan kulit tanduk sering terkelupas.     Memiliki elastisitas atau kelenturan kulit yang tinggi.     Permukaan kulit tampak kasar dan lebih berminyak dibagian dagu, dahi dan hidung.     Di kulit wajah banyak terdapat komedo dan pori pori besar.     Sehabis dibersihkan, kulit wajah tampak mengkilap. 1. Jeruk Nipis.     Mengatasi kulit berminyak dengan jeruk nipis bisa dilakukan dengan menggosokkan kulit wajah dengan daging jeruk nipis secara merata. Tunggu selama kurang lebih 15 menit, kem...
1 comment
Read more