Cara Membuat dan Memodifikasi Widget Follower di Blogger

Sebenernya Blogger sendiri udah memberikan fasilitas untuk membuat widget untuk menampilkan follower sebuah blog. Fasilitas ini sangat mudah penggunaannya dan cuma butuh waktu sedikit untuk menyelesaikannya. Cara termudah untuk menambahkan widget follower kurang lebih begini :
Cara Pertama:
  1. Masuk ke halaman "Rancangan" - "Elemen Laman"
  2. Klik "Tambah Gadget" dan pilih "Pengikut"
  3. Kalo mo pake tampilan standart dari Blogger, langsung aja klik tombol "Simpan". Tapi kalo mo ngerubah warna, ilangin aja centang pada bagian "Gunakan gaya template bawaan". Pilih warna yang kamu inginkan, kemudian klik tombol "Simpan".
  4. Tinggal tentukan letak di sebelah mana widget follower ingin kamu tampilkan dengan menyeret widget tersebut pada letak yang kamu inginkan. Kemudian klik tombol "Simpan". Untuk memastikan widget sudah terpasang sesuai dengan keingnan kamu, buka blog kamu.
Mudah bukan. Nah masalahnya, dengan fasilitas dari Blogger tersebut kita ga' bisa mengubah ukuran widget menjadi lebih lebar atau lebih tinggi dari default ukuran yang sudah ditetapin oleh Blogger. Widget akan menyesuaikan ukurannya sesuai dengan ukuran kolom dimana widget tersebut dipasang, tapi hanya bisa menjadi lebih kecil. Tapi tenang aja, kebetulan aku punya scriptnya yang bisa dengan mudah kamu gunain. Tinggal ngedit dikit, selesai.
Cara Kedua:
  1. Copy script di bawah ini
    <!-- Include the Google Friend Connect javascript library. -->
    <script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
    <!-- Define the div tag where the gadget will be inserted. -->
    <div id="div-1452457757257366305" style="width:276px;border:1px solid #cccccc;"></div>
    <!-- Render the gadget into a div. -->
    <script type="text/javascript">
    var skin = {};
    skin['BORDER_COLOR'] = '#cccccc';
    skin['ENDCAP_BG_COLOR'] = '#e0ecff';
    skin['ENDCAP_TEXT_COLOR'] = '#333333';
    skin['ENDCAP_LINK_COLOR'] = '#0000cc';
    skin['ALTERNATE_BG_COLOR'] = '#ffffff';
    skin['CONTENT_BG_COLOR'] = '#ffffff';
    skin['CONTENT_LINK_COLOR'] = '#0000cc';
    skin['CONTENT_TEXT_COLOR'] = '#333333';
    skin['CONTENT_SECONDARY_LINK_COLOR'] = '#7777cc';
    skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#666666';
    skin['CONTENT_HEADLINE_COLOR'] = '#333333';
    skin['NUMBER_ROWS'] = '4';
    google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
    google.friendconnect.container.renderMembersGadget(
     { id: 'div-1452457757257366305',
       site: '03345588534937132312' },
      skin);
    </script>
    Ganti kode berwarna merah dan biru sesuai dengan blog kamu. Kalo kamu udah pasang widget follower pake fasilitas blogger tinggal kamu buka blog kamu kemudian pencet Ctrl+U. Pada halaman "Page Source" pencet Ctrl+F dan ketik "site: " (tanpa tanda petik) pada kolom "Find".
    Gambar di atas hanyalah contoh, tiap blog mempunyai kode yang berbeda, tinggal ganti kode yang kamu temukan pada page source blog kamu.
    Sedangkan kode berwarna orange digunakan untuk mengubah ukuran lebar, tinggi, dan warna. Untuk kode warna kamu bisa cari pada software Photoshop.
  2. Masuk ke "Rancangan" - "Elemen Laman"
  3. Klik "Tambah Gadget" dan pilih "HTML/JavaScript"
  4. Beri judul pada kolom "Judul". Paste kode yang sudah di copy ke dalam kolom "Konten". Klik tombol "Simpan".
  5. Tinggal tentukan letak di sebelah mana widget follower ingin kamu tampilkan dengan menyeret widget tersebut pada letak yang kamu inginkan. Kemudian klik tombol "Simpan". Untuk memastikan widget sudah terpasang sesuai dengan keingnan kamu, buka blog kamu.
Bingung cara ngedit warnanya? Tenang, pinjem dulu cara yang pertama. Pas di langkah yang ketiga, pilih warna yang kamu inginkan maka akan muncul kode warna di sebelah kanannya. Semoga kamu² pada ga' puyeng baca tulisanku di atas. Dan yang pasti semoga bisa dipahami dan membantu. Selamat mencoba...



Loading...

22 komentar :

Blogaul mengatakan... Balas Komentar

Bermanfaat sekali gan, thanks ya..

Blogaul mengatakan... Balas Komentar

thanks bgt... nice info...

Imron mengatakan... Balas Komentar

Triknya sangat baik dan berguna bagi yang suka utak atik blog seperti saya, terima kasih sudah berbagi Mas

J48 Blog mengatakan... Balas Komentar

menarik ya gan coba ah

Abdie, Indoblogger mengatakan... Balas Komentar

yg bnar aja... gmn mau copy code nya klo ga bisa dicopy paste. dpet trik dr umum aja pakeq proteksi2 sgla hadehhh, klo gini.. pd males ngunjungin blog lu untuq yg kdua kali nya :3

MustBhagoezt mengatakan... Balas Komentar

@Abdie, Indoblogger : waduh baru tau aku kalo codenya gak bisa dicopy.. mungkin ada script blogku yang error ni.. makasih atas koreksinya mas, segera aku perbaiki :)

topSpot | Find your top spot here mengatakan... Balas Komentar

Wah, lengkap bener nih cara nya, ada 3 pula! Nice tutorial & nice blog ya sobat.. :)

She TheKill mengatakan... Balas Komentar

tambah ilmu lagi>>terima kasih

zamroniys mengatakan... Balas Komentar

mantap sob.. izin make ya..

reki mengatakan... Balas Komentar

yg cara ke-3 udah nggak bisa kyaknya sob :D

MustBhagoezt mengatakan... Balas Komentar

@reki : oke sob, makasih atas infonya :)

Fuad Rizky mengatakan... Balas Komentar

tx gan bermanfaat ..
mampir-mampir http://trickcomputer95.blogspot.com/

sony reinaldo mengatakan... Balas Komentar

kok agak rumit ya gan tapi thnks for sharing
kunbal www.sudekyclan.blogspot.com

Fisma Ananda mengatakan... Balas Komentar

Thanks tutorialnya

Iklil Achmad mengatakan... Balas Komentar

waduh untuk pemula kyak ane susah ya,tanks dah ngasih tutornya.
kunjungi balik blog ane gan http://blogcahdemak.blogspot.com/ jgn lupa kasih saran

Aulia Manda mengatakan... Balas Komentar

Thanks ya.. mampir gan di Blog saya http://makho-manda.blogspot.com/

Antonius atvengaleri mengatakan... Balas Komentar

kerennn nih, izin coba diblog baru sy Sob, kalo ada yg butuh kode warnanya silahkan berkunjung http://atvengaleri.blogspot.com TQ

Ficri Pebriyana mengatakan... Balas Komentar

makasih mas, sangat membantu...

REAL NEWS mengatakan... Balas Komentar

makasi mas atas infonya...krennn

ijin ya
REAL NEWS
REAL NEWS
http://goo.gl/n2kyyZ

Ahmad Fathoni mengatakan... Balas Komentar

sukses terpasang di blog saya, terima kasih

mbak siphe mengatakan... Balas Komentar

tutor yang sangat super.....langsung doterapkan diblog berjalan dengAN...lancar tanpa kendala suatu apapun....terimakasih ...atas bimbingannya...semoga bermanfaat

Muhammad Fawaaid mengatakan... Balas Komentar

Terima kasih.. Jangan Lupa Kunjungi Blog saya ^^ http://aikawafaith.blogspot.com/

Posting Komentar



 
Powered by Blogger