15 Desember 2011

Home » All posts

Membuat Widget Page Rank

Rank widget adalah widget penting yang wajib dipasang di sebuah blog. Tujuanya adalah untuk mengetahui statistik rangking sebuah blog di dalam dunia internet.Selain itu juga rank widget ini bisa digunakan sebagai patokan keberhasilan blog kita berbaur dalam dunia internet.Sebelum klini-it menjelaskan Cara Pasang Rank Widget,klinik-it akan mencoba memberi gambaran rank widget ada di internet saat ini ada beberapa macam macam yaitu Pagerank,Alexa Traffic Rank,dan Technorati Blog Rank.Berikut ini adalah contoh rank widget yang klinik-it temukan di internet.
Buat kamu yang ingin pasang Rank Widget seperti ini mudah koq caranya.silakan kamu ikuti lankah-langkah berikut ini untuk memasang Rank Widget.

1.Klik http://www.rankwidget.com.

2.Setelah masuk kesitus tersebut,silakan masukan Link URL blog kamu pada form yang disediakan tersebut.

3.Selanjutnya beri tanda titik pada radio button Widget Rank yang kamu inginkan.Disitu ada 4 macam pilihan yaitu Pagerank,Alexa Traffic Rank,Technorati Blog Rank dan Yahoo! Search InLinks.

4.Setelah itu klik tombol GET RANK.

5.Setelah kode HTML nya muncul pilih image rank widget yang kamu inginkan. Lalu Copy kode HTML nya Dan paste Di Blog Kamu caranya :

6.Selanjutnya LOGIN Ke Blogger .

7.Klik Tata Letak.

8.Klik tab Elemen Halaman.

9.Klik Tambah Gadget.

10.Kemudian Pilih HTML/Javascript.

11.Lalu paste seluruh kode HTML image rank yang kamu pilih kedalamnya,Kemudian klik SIMPAN.

12.Selesai....... sekarang tinggal kamu lihat hasilnya.

Alamat Cek Page Rank Lainnya Ada DISINI dan DISINI

sumber : http://klinik-it.blogspot.com/2010/03/cara-pasang-rank-widget.html

Dalam postingan kali ini klinik-it akan membahas tentang Cara Membuat Judul Blog Bergerak.Knapa judul blognya bergerak ? tujuanya mungkin supaya Blog jadi terlihat dinamis.Judul blog kita jadinya akan terlihat berjalan pada title bar browser.Sebagai contoh lihat disini
Buat kamu yang ingin membuat Judul Blog Bergerak silakan ikuti tutorial Cara Membuat Judul Blog Bergerak Berikut ini.

1.LOGIN ke blogger.

2.Kemudian klik Tata Letak Kemudian Klik Lagi Edit HTML.

3.Selanjutnya cari kode berikut ini.

<title><data:blog.pageTitle/></title>

4.Hapus Kode Tersebut dan ganti dengan Kode berikut ini>

<b:include data='blog' name='all-head-content'/>
<script language='JavaScript'>
var txt="<data:blog.pageTitle/>";
var kecepatan=100;var segarkan=null;function bergerak() { document.title=txt;
txt=txt.substring(1,txt.length)+txt.charAt(0);
segarkan=setTimeout("bergerak()",kecepatan);}bergerak();
</script>

5.Kamu bisa mengganti angka 100 yang berwarna biru tersebut dengan keinginan kamu.Angka tersebut adalah kecepatan pergerakan judul blog kamu.

5.Kalo udah selesai silakan klik SAVE TEMPLATE

sumber : http://klinik-it.blogspot.com/2010/03/cara-membuat-judul-blog-bergerak.html

Cara Membuat Twitter birds & Facebook birds di Blog

Fungsi Utama Widget Ini :

Membuat mata pengunjung tertuju pada burung yang sedang terbang di halaman website. Hal ini dilakukan agar pengunjung berpikir sejenak apakah ingin men-Follow Twitter kita atau menjadi Fans di Facebook Kita.

* Untuk Melihat Demonya, Silakan Kunjungi :

Twitter's birds & Facebook's birds (Demo Url)

* Cara Pemasangan Widget Ini :

1. Login ke Akun Blogger Anda

2. KLIK Tambah Gadged lalu HTML/javascript

3. Copy & Paste Script Berikut :

<script type="text/javascript">
bird_version= 3;
your_facebook=" http://www.facebook.com/USERNAME";
facebook_color= 1; //default color 0-6;
your_twitter=" http://twitter.com/USERNAME";
twitter_color= 2; //default color 0-6;
view_bird=' 6'; //input 'no'>>not active & Restart View ; 'yes'>>always active ; number ('1')('2')...('99999') >> number display
bird_speed= 17;
</script>
<script type="text/javascript" src="http://blogger_eye_1.xtgem.com/twitter_facebook_birds"></script>

* Ganti angka 3 pada "bird_version" Menjadi Versi yang Anda Inginkan. Sementara cuma tersedia versi 1, versi 2 dan versi 3. Disarankan Anda mengisi '3'.

* Ganti http://www.facebook.com/USERNAME Menjadi Alamat Facebook's Page Website/Blog Anda

* Angka 1 pada "facebook_color" adalah warna Facebook's Bird yang akan Keluar

- Warna Default : 0 = Putih || 1 = Merah || 2 = Jingga || 3 = Kuning || 4 = Hijau || 5 = Biru || 6 = Ungu

* Ganti http://twitter.com/USERNAME Menjadi Alamat Twitter Anda

* Angka 2 pada "twitter_color" adalah warna Twitter's Bird yang akan Keluar

- Warna Default : 0 = Putih || 1 = Merah || 2 = Jingga || 3 = Kuning || 4 = Hijau || 5 = Biru || 6 = Ungu

* Angka 6 pada "view_bird" adalah Jumlah tampilan Burung yang akan keluar

- Isikan Total Tampilan Burung (Angka) yang akan keluar / Unik Visitor. Misalnya : 6. Jika "Bird" yang keluar telah mencapai 6X untuk Visitor yang sama, Maka Bird tidak akan keluar untuk pengunjung tersebut.

- Isikan "no" untuk mematikan script "Twitter's Birds & Facebook's Birds"

- Isikan "yes" untuk selalu mengaktifkan script "Twitter's Birds & Facebook's Birds"

*Angka 17 pada "bird_speed" adalah kecepatan Burung. Semakin Tinggi Angka Tersebut, Semakin Cepat

Semoga Bermanfaat
sumber : http://www.hajsmy.us/

Cara agar loading blog cepat dan ringan

Oke langsung saja.kita akan membahas compress CSS nya terlebih dahulu, Oh ya kalau ada yang masih bingung dengan CSS, baiklah CSS itu kependekan dari Cascading Style Sheet yaitu sebuah bahasa pemograman atau dokument yang digunakan untuk mendesain atau mengatur tampilan tata letak sebuah halaman web atau blog. Salah satu cara optimasinya adalah dengan mengkompresnya agar ukurannya menjadi lebih kecil , sehingga tidak terlalu membebani loading blog, dengan demikian diharapkan loading blog menjadi lebih cepat lagi karena sizenya telah berkurang setelah di compress. Begitu ceritanya….

Langkah atau Cara agar loading blog cepat dan ringan adalah sebagai berikut :

#

Login ke Blogger lalu pilih Lay Out dan klik Edit HMTL

#

Jangan lupa backup template dulu dengan Download Full Template , siapa tahu nanti malah berantakan.

#

Cari kode CSS nya , biasanya terletak antara kode <b:skin><![CDATA[/* DAN ]]></b:skin>

#
Kalau CSS nya sudah ketemu tinggal di blok , lalu ambil atau Cut ( klik kanan Mouse anda lalu Cut ) dan simpan dulu di Notepad , akan lebih baik lagi bila notepadnya di save sebagai backup , siapa tahu nanti diperlukan lagi.

#

Jika sudah baru kita masuk ke CSSdrive.com untuk mengkompresnya, disitu akan ada kotak bertuliskan Insert CSS Code

#
Copy CSS yang tadi disimpan di Notepad tersebut kemudian pastekan ke kotak Insert CSS Code.

#

Nanti ada beberapa pilihan seperti di bawah ini : (Untuk pemula sebaiknya pilih Light dan Don strip any comments saja dulu , supaya masih tetap terbaca jika nanti kita mau utak-atik-utek CSS lagi).

Compression mode: (?)

Light
Normal
Super Compact

Comments handling: (?)
Don't strip any comments
Strip ALL comments
Strip comments at least chars long (NOT counting line breaks within comment)

# Klik Compress it yang ada dibawah kotak tersebut
# Tunggu sebentar sampai proses compress selesai , kalau dah selesai dibawahnya suka ada keterangan seperti ini :

Compression results

Original size: 14487 bytes

Compressed size: 12357 bytes

Savings: 2130 bytes (15%)

Copy hasil compress tersebut dan pastekan ke tempatnya semula yaitu antara : <b:skin><![CDATA[/* DAN ]]></b:skin>

# Jika semua sudah selesai jangan lupa Save Templates
# Selesai , selamat mencoba untuk Cara agar loading blog cepat dan ringan

Semoga berhasil,,jika ada pertanyaan silahkan berkomentar...

sumber : http://www.hajsmy.us/

Cara Membuat Related / Recent Post Thumbnails di Bawah Postingan Blog Dengan Mudah

kunjungi http://www.linkwithin.com/learn
isi data data mu :
1.Email anda
2.link blog anda
3.jenis web anda
4.jumlah related post nya
5.centang My blog has light text on a dark background jika template backround anda gelap
6.Letakkan Widget Tadi di Bawah Postingan

Email:
Blog Link:
Platform:
Width:
	My blog has light text on a dark background
	ini contoh script yang telah saya buat <script> var linkwithin_site_id = 981789; </script> <script src="http://www.linkwithin.com/widget.js"></script> <a href="http://www.linkwithin.com/"><img src="http://www.linkwithin.com/pixel.png" alt="Related Posts Plugin for WordPress, Blogger..." style="border: 0" /></a>

Cara Membuat Related / Recent Post Thumbnails Bergerak di Bawah Postingan Blog

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 Related Post Thmbnails 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.

Mau tahu cara memasang Cara Membuat Related Post Thumbnails Bergerak 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......).

a. Login ke Blogger.
b. Di halaman Dasbor, kita pilih Rancangan.
c. Kemudian pilih Edit HTML
d. Beri tanda centang pada Expand Template Widget
e. Cari kode </head>
Cara Membuat Related / Recent Post Thumbnails Bergerak di Bawah Postingan Blog
f. Taruh (copy paste) kode berikut ini di atasnya

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, “Times New Roman”, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if>

g. Cari kode di bawah ini

<div class='post-footer-line post-footer-line-1'>

Atau jika tidak menemukannya cari kode berikut ini

<p class='post-footer-line post-footer-line-1'>

h. Jika sudah ketemu, taruh (copy paste) kode berikut ini di bawah salah satu kode di atas

<b:if cond='data:blog.pageType == "item"'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=12"' type='text/javascript'/></b:if></b:loop>
<h3><b>Related Posts</b></h3>
<marquee align='center' behavior='alternate' direction='left' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=10;
var relatedpoststitle="";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script></marquee>
</div><div style='clear:both'/>
</b:if>
<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>
<a href='http://www.hajsmy.us/' style='display:none;'>Hajsmy Blog</a>
</b:if>
</b:if>

h. save template
gimana sob, mudahkan, perlu ketelitian sob, jangan keburu-buru nanti malah kacau hasilnya, semoga bermanfaat ya sob :)

Sumber : http://www.hajsmy.us/

UP

Membuat Widget Page Rank

Cara Membuat Judul Blog Bergerak

Cara Membuat Twitter birds & Facebook birds di Blog

Cara agar loading blog cepat dan ringan

Cara agar loading blog cepat dan ringan

Cara Membuat Related / Recent Post Thumbnails di Bawah Postingan Blog Dengan Mudah

Cara Membuat Related / Recent Post Thumbnails Bergerak di Bawah Postingan Blog