Subscribe:
Tampilkan postingan dengan label widget. Tampilkan semua postingan
Tampilkan postingan dengan label widget. Tampilkan semua postingan

Minggu, 08 Januari 2012

Cara Menyembunyikan Widget Follow

Ini buat agan-agan yang tidak memiliki banyak ruang di sidebar blognya. Untuk membuat alternatifnya, saya buat tutorial ini. Mudah-mudahan bermanfaat.

Berikut langkah-langkahnya :
1. Login ke Blogger
2. Masuk Rancangan - Elemen Laman
3. Tambah Gadget Html/Java Script
4. Copy -  Paste kode berikut :



5. Ambil code script followers anda di sini
6. Setelah itu,bika rancangan - edit Html.cari code <body> dengan cara tekan Ctrl + F, copy paste kode di atas <body>


Sumber : http://www.idsena.web.id/2011/02/cara-menyembunyikan-widget-follow.html
Baca Selengkapnya»»

Senin, 02 Januari 2012

Cara Pasang Icon Burung Twitter Terbang di Blog

Kali ini saya akan menjelaskan cara pasang ikon burung twitter yang terbang bebas dihalaman blog kita.
Berikut cara memasang burung twitter yang akan terbang dihalaman blog kita:

  1. Masuk akun blog kalian
  2. Klik rancangan
  3. Pilih Elemen laman
  4. Tambah Gadget
  5. Pilih HTML/JavaScript
  6. Lalu masukkan kode icon gambar burung twitter dibawah



Kode untuk gambar diatas
<script src="http://imemovaz.googlecode.com/files/tripleflap.js" type="text/javascript">
</script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1V03Yw9lW1fK6-XigoVexzN-kB7DrvzfEMox_Zdn7DNt8FvtsWm3YYjsgydZuToHYKw1gO5OFLcv_xyFSXBBFyP-tbEbrngXhaY0z1O8gBRpurMuB7P2ZU1WckejEnnFnCfrbhejKDC0/s1600/birdsprite.png"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/TwitterKamu";var tweetThisText = "https://twitter.com/TwitterKamu/";tripleflapInit();
</script>


Atau Bisa Menggunakan Gambar dibawah ini.

Kode untuk gambar ini:
<script src="http://imemovaz.googlecode.com/files/tripleflap.js" type="text/javascript">
</script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8I0hvClNzO_bBaxzdGAyjZf8GDonM06Ld7BnF_jy9eECZZi5gfQzr9u4TqLOhjQSgZExBDFwA1cV2FFzMvmeBF890QDZFXab9J0nD87jn45Xck3Fpa0YnroRF5dq-CJyCK73EDQ7a6Bk/s1600/birdsprite+copy+copy.png"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/TwitterKamu";var tweetThisText = "https://twitter.com/TwitterKamu/";tripleflapInit();</script>

Langkah Terakhir, ganti kalimat warna biru dengan alamat twitter kamu. Lalu simpan. Selesai...



sumber : http://infotips-rama.blogspot.com/2011/07/cara-pasang-icon-burung-twitter-terbang.html
Baca Selengkapnya»»

Senin, 26 Desember 2011

Cara Membuat Widget Timer/Penghitung Mundur

Cara Membuat Widget Timer/Penghitung Mundur, widget ini secara tidak sengaja saya ketahui dari webnya si om master hashemian hahaha.. (padahal saya lagi nyasar ceritanya... wkwkwkwkwkwkw) eh ternyata tips ini cukup keren yaaa jadi saya share disini deh...  

OK lah yuk mari kita simak cara membuat widget seperti ini.

Cara Membuat Widget Timer/Penghitung Mundur :
1. login blog
2. rancangan >> elemen halaman >> tambah gadget (HTML/JavaScript)
3. lalu masukkan kode dibawah ini
<script language="JavaScript">
TargetDate = "1/1/2012 00:00 AM";
BackColor = "white";
ForeColor = "Red";
CountActive = true;
CountStepper = -1;
LeadingZero = true;
DisplayFormat = "%%D%% Hari, %%H%% Jam, %%M%% Menit, %%S%% Detik.";
FinishMessage = "Kami Dari DC Community  Mengucapkan Selamat Tahun Baru 2012";
</script>
<script language="JavaScript" src="https://sites.google.com/site/dcsoundflash/sound/countdown.js"> </script>

NB :
12/31/2011  tanggal widget penghitung waktu ini berhenti/selesei
00:00 AM jam widget penghitung waktu ini berhenti/selesei 
white  warna background widget

Red warna font widget
Kami Segenap Admin Mengucapkan Selamat Tahun Baru 2012 tulisan yang akan tampil setelah waktu widget habis

4. simpan dan lihat hasilnya.

Sekian tips Cara Membuat Widget Timer/Penghitung Mundur dari saya semoga bisa berguna bagi sobat ^_^ 




source : http://vikrymadz.blogspot.com/2011/12/cara-membuat-widget-timerpenghitung.html
Baca Selengkapnya»»

Kamis, 22 September 2011

Cara Membuat Related Post LinkWithin(Thumbnails)



Sudah beberapa lama ini saya menggunakan widget LinkWithin dan hasilnya cukup lumayan sebagai salah satu upaya untuk membuat pengunjung bisa melihat-lihat lagi halaman yang lainnya. Cukup lumayan untuk menyumbangkan sejumlah traffic. Bisa dibilang LinkWithin adalah tool navigasi eksternal yang cukup keren. Halaman-halaman lama yang jarang tersentuh pun bisa dioptimalkan lagi dengan penggunaan fitur ini. Selain itu, widget ini juga menggunakan thumbnail yang bisa meningkatkan daya tarik. Tampilannya pun lumayan. Linkwithin melakukan generating gambar dari page yang dimuat, atau jika tidak ada gambar dalam halaman tersebut, LinkWithin akan menampilkan gambar dasar berwarna abu-abu dan sedikit bertekstur. Sistem yang digunakan adalah randoming content, jadi semi random, namun tetap melakukan upaya persamaan konteks melalui judul, tag, atau label. Sehingga ketika page di load, dibutuhkan waktu untuk tool ini merayap dan menampilkan hasilnya. Tapi tidak cukup lama kok. Lagi pula tidak ada apa-apanya dibanding hasilnya. So, what are the ways to use it?

Cara Mendapatkan Widget
1. Go to LinkWithin.
2. Setelah masuk halamannya, lihat ke bagian kanan bawah dimana disitu terdapat kolom isian untuk mendapatkan widgetnya.
3. Masukkan valid email.
4. Isikan url blog/website.
5. Pilih Platform blog anda (ini digunakan untuk memasukkan secara otomatis melalui dashboard/admin page blog).
6. Pilih jumlah link/stories yang ingin anda tampilkan, sesuaikan dengan lebar post body di blog.(pilih melalui dropdown menu di kolom Width)
7. Centang "My blog has light text on a dark background" jika latar tampilan blog anda berwarna gelap.
8. Klik 'GetWidget!'.
9. Anda akan masuk ke halaman selanjutnya dan dibimbing untuk melakukan langkah-langkah sesuai dengan platform blog.
10. Setelah masuk ke halaman widget editor/page element di dashboard, tarik widget ke bawah post body jika ingin ditampilkan di bawah post body, save dan check hasilnya.
Contoh tampilannya seperti ini:
 Kostumisasi Widget
a. Kata-kata "you might also like:" mungkin kurang keren menurut anda, so anda bisa menggantinya dengan cara:
1. Masuk ke Edit HTML di dahboard anda
2. Cari tag <head> (Ctrl+F)
3. Kemudian masukkan script berikut di bawahnya:
<script>linkwithin_text='TEKS ANDA DISINI:'</script>
4. Ganti TEKS ANDA DISINI dengan teks yang anda inginkan dan save template.

b. Jika ingin menempatkan widget LinkWithin di posisi tertentu di bawah post body, karena mungkin disana ada banyak widget lain seperti Adsense, letakkan kode berikut di atas atau dibawah widget yang lain di bagian post body (cari widget-widget di bagian post body).
<div class="linkwithin_div"></div>
Lalu save.

c. Ketika berada di halaman utama (frontpage) atau halaman-halaman yang memuat query posts, widget ini akan muncul di bawah setiap post. Hal ini tentu saja tampak tidak elegan dan membutuhkan waktu loading yang lebih lama. So, jika anda ingin widget ini hanya muncul di bagian posting saja (menyembunyikannya dari halaman muka), lakukan langkah berikut:
1. Jika anda sudah terlajur memiliki widget LinkWithin yang terpasang, silakan di remove/delete terlebih dahulu.
2. Lakukan kembali langkah untuk mendapatkan widget LinkWithin diatas. Khusus pada menu Platform pilih 'Other'. Klik 'Get Widget!'
3. Anda akan menuju ke halaman selanjutnya, lalu copy script yang telah terbuat dan simpan script tersebut.
4. Kemudian masuk ke edit HTML template anda, dan ikuti langkah sederhana -cara menampilkan widget/link/script hanya di post body-  .
5. Save dan lihat hasilnya.
Baca Selengkapnya»»

Jumat, 15 Juli 2011

Recent Post Thumbnail/Gambar Bergerak Ke Bawah Efek Marquee

Recent Post adalah widget yang akan menampilkan beberapa artikel / postingan terakhir blog. Adapun jumlah portingan yang di tampilkan bisa diatur sesuai keinginan kita dengan mengacak - acak kode HTMLnya. Dengan widget recent post ini, pengunjung akan dengan mudah melihat beberapa artikel terakhir yang diposting di blog. Dengan sekali klik, pengunjung akan langsung menuju ke artikel yang masih fresh.

Dengan fungsi thumbnail, Widget Recent Post akan menampilkan Gambar yang ada di dalam artikel seperti yang biasa kita jumpai pada Widget Related Post / Artikel Terkait yang dipasang di akhir artikel / postingan blog.

Dengan efek marquee, Widget Recent Post Thumbnail BB jadi tampak lebih menarik. Related Post Thumbnail akan BERGERAK turun dengan teratur. Hasilnya, jadilah Widget Recent Post Thumbnail Animasi hehehe....
Belum puas dengan animasinya, sekalian saja saya tambahkan bingkai yang tidak bisa di gunakan untuk foto dinding. Hasilnya... silhkan lihat sendiri pada sidebar blog DC ini (kalau belum diganti dengan yang lebih canggih hehe...).

Mau tahu cara memasang Widget Related Post Tumbnail Animasi yang bergerak turun dan dilengkapi dengan bingkai yang tidak bisa digunakan untuk foto dinding di rumah pada blog anda ? (Kalau kalimatnya terlalu panjang, silahkan ambil nafas dulu. Bernafas melalui hidung... lalu keluarkan melalui bokong hehehehe......).


  • Copy kode HTML berikut :

<center><table border="2" cellpadding="7"><tbody><tr><td><center><style type="text/css">
#rp_plus_img{height:280px;overflow:hidden;border:solid 0px #000000;padding:6px 10px 14px 5px;background-color:transparent;}
#rp_plus_img ul{list-style-type:none;margin:0;padding:0}
#rp_plus_img li{border:1px; margin:0; padding:0; list-style:none;}
#rp_plus_img li{height:85px;padding:0px;list-style:none;}
#rp_plus_img a{color: #000000;}
#rp_plus_img .news-title{display:block;font-size:14px;font-weight:bold !important;color:#000000;text-align:left;}
#rp_plus_img .news-text{display:block;font-size:12px;font-weight:normal !important;color:#DF0101;text-align:justify;}
#rp_plus_img img{float:left;margin-right:14px;padding:4px;border:solid 1px #DF0101;width:95px;height:55px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script src="https://sites.google.com/site/dinarcoolblogspotcom/dinarcool-blogspot-com/RergerakDC4U%282%29.js" type="text/javascript">
</script>
<script type="text/javascript">
var speed = 1000;
var pause = 3500;
$(document).ready(function(){
rpnewsticker();
interval = setInterval(rpnewsticker, pause);
});
</script>
<ul id="rp_plus_img"><script>
var numposts = 20;
var numchars = 45;
</script> <script src="http://dinarcool.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt">
</script> </ul>
</center></td></tr></tbody></table></center>

  • Paste di NOTEPAD atau Microsoft Office Word.
  • Ganti kode yang berwarna BIRU dengan url blog anda.
Selanjutnya....................
  • Tambahkan gadget baru pada blog anda dengan memilih kotak HTML/JavaScript lau paste kode Related Post yang telah anda ganti dengan URL BLOGANDA sendiri lalu simpan. Jika anda belum tahu cara menambahkan gadget baru pada BLOG BLOGSPOT.
  • Selesai........

Jika ingin mengedit kode yang lain, silahkan edit kode HTML Recent Postnya yang di beri warna MERAH sesuai petunjuk berikut :

height:280px; Adalah tinggi Kotak Recent Post. Silahkan ganti angka 280 menjadi angka yang lebih banyak jika ingin membut kotak yang lebih panjang atau sebaliknya.

 font-size:14px;font-weight:bold !important;color:#000000; Adalah kode untuk Besar huruf dan warna Judul artikel. Ganti angka 14 menjadi lebih besar jika ingin membuat Teks Judul menjadi lebih besar dan sebaliknya. Kode #000000 adalah kode warna hitam. Silahkan diganti dengan kode warna anda jika anda menginginkan warna lain pada judul artikel yang akan ditampilkan Related Post.

font-size:12px;font-weight:normal !important;color:#DF0101; Adalah kode untuk tulisan yang ada di bawah gambar thumbnail yang merupakan kalimat pertama artikel. Cara mengedit kodenya sama seperti cara mengedit judul artikel di atas.

var speed = 1000;
var pause = 3500; Adalah kecepatan Gambar bergerak Turun dan Lama Gambar Terdiam sebelum bergerak. Ganti angka 1000 jika ingin membuat gambarnya bergerak turun lebih cepat dan sebaliknya.  Begitu juga dengan angka 3500 jika ingin membuat gambar terdiam lebih lama dan sebaliknya, sebelum gambar bergerak turun.

var numposts = 20; adalah jumlah judul postingan / artikel yang akan di tampilkan secara bergantian. Silahkan ganti angka 20 menjadi lebih besar jika ingin menampilkan lebih banyak judul artikel pada widget recent postnya, atau sebaliknya.

Jika anda masih ingin mengedit kode yang lain, silahkan saja. Kalau widgetnya hancur baru tau rasa


Oke bro.. semoga Tutorialnya bermanfaat... Salam Blogger...
Baca Selengkapnya»»