Cara Mengetahui Ranking dan Harga Blog

Langsung aja gak usah lama2

Mengetahui Harga Blog :

1. Kunjungi  http://www.business-opportunities.biz/projects/how-much-is-your-blog-worth/ pada browser anda atau langsung klik di sini
2. Setelah anda masuk, ketikkan nama URL blog anda. Contoh: http://nama blog anda.wordpress.com. pada kotak kosong yang tersedia
3. Klik kotak “Submit.”
4. Tunggulah hasilnya……

Atau yang ini,

1. Kunjungi  http:// bizinformation.org pada browser anda atau langsung klik di sini
2. Setelah anda masuk, ketikkan nama URL blog anda. Contoh: http://nama blog anda.wordpress.com. pada kotak kosong yang tersedia
3. Klik kotak “Nilai.”

Tunggulah hasilnya……

Mengetahui Ranking Blog :

1. Kunjungi http://www.rankwidget.com/ pada browser anda atau langsung klik di sini
2. Setelah anda masuk, ketikkan nama URL blog anda pada kotak “Type the URL of your website/blog and click “Get Rank”
3. Pilihlah salah satu jenis ranking dari Google Page Rank, Alexa Traffic Rank, Technorati Blog Rank, dan yahoo! Search InLink
4. Setelah dipilih salah satunya, klik kotak “Get Rank”
5. Tungg hasilnya……

Oke, kalau sudah tahu hasilnya, berapa ranking dan harga blog anda saat ini?

Cara Membuat Head Line News

Pertama, login ke akun blogger masing-masing, lalu tata letak - edit HTML.
Kemudian cari kode ]]></b:skin>. Gunakanlah fasilitas search untuk mencari nya dengan menekan CTRL+F.
Copy scipt dibawah ini, lalu paste diatas code ]]></b:skin> yang tadi.

#anima_sudut {
position:fixed;_position:relative;top:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

Untuk menuntukan posisinya, sobat blogger bisa merubah top:10px; left:10px; .( top=atas, bottom=bawah, right=kanan, left=kiri)

Note : Kalau sobat sobat blogger sudah punya script( #anima_sudut) di html blog sobat, tambahkan angaka dibelakangnya atau semacamnya untuk membedakan nya.
Contoh : #anima_sudut2

Kemudian copy-paste code dibawah ini diatas code </body>.
<div id="anima_sudut">
&lt;font COLOR="#000000"&gt;
&lt;B&gt;&lt;MARQUEE onmouseover="this.stop()" onmouseout="this.start()" direction="left" BGCOLOR="#80ff00" width= 100%px scrollamount="3"&gt;
HEAD LINE NEWS CREATIVE BY REMO-XP | SILAHKAN GANTI DENGAN TEXT ANDA
&lt;/MARQUEE&gt;&lt;/b&gt;&lt;/font&gt;
</div>

CATATAN :
Jangan lupa samakan variabel script di atas dengan yang dibawah.
Misalnya, yang diatas menggunakan nama #anima_sudut2 maka yang di bawah otomatis harus disamakan juga menjadi anima_sudut2.
Jangan lupa ganti height dan width nya sesuai dengan ukuran blog anda. kalau tidak di ganti juga tidak masalah. suka-suka pokonya, hehehe
Sekian tips blogging dari saya, semoga bisa membantu.

Cara Membuat Gambar Bergerak di Bagian Pojok Blog

Setiap kamu membuka blog ini pasti kamu melihat gambar animasi Naruto lagi duel sama Sasuke yang ada di pojok kanan atas, iyakan... saya memilih gambar ini karena saya sedang menyesuaikan blog ini dengan templatenya yang serba Naruto... Kalau kamu mau membuat seperti gambar seperti yang ada di blog saya ini "Cara Membuat Gambar Bergerak di Bagian Pojok Blog" kalau  kamu sudah punya gambarnya tinggal kamu taruh aja di photobucket atau di webhosting... kalau kamu mau tau cara membuat gambarnya ikuti cara berikut ini... Sekaligus langsung memasukkannya ke blog kamu...
1. Buatlah gambar animasi kesukaan kamu dengan tool imaging seperti ulead gif animator atau yang lainnya. Jika cara pertama ini terlalu susah, kamu juga bisa langsung cari gambar animasi disini
2. Copy alamat URL dari gambarnya dengan cara "Klik kanan > Copy image Location"
3. Login ke blog kamu
4. Masuk ke menu Layout > Edit HTML
5. Backup template kamu dengan cara Copy Paste ke Notepad
6. Sekarang cari kode ]]></b:skin> di template kamu
7. Letakkan kode berikut tepat dibawahnya :

#trik_pojok {
position:fixed;_position:absolute;bottom:0px; right:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight);
_left:expression(document.documentElement.scrollLeft+
document.documentElement.clientWidth - offsetWidth); }

8. kode yang berwarna merah menandakan posisi dari gambar, bisa diganti semaumu. Misal :

kiri=left, atas=up, bawah=bottom, kanan=right

9. Setelah itu cari kode </body> di template dan Letakkan kode dibawah ini tepat diatasnya :

<div id='trik_pojok'>
<a href='http://aagen-blog.blogspot.com/' target='_blank' title='Harree gene belum punya Blog, Ketinggalan zaman loe...'>
<img border='0' height='175' src='http://www.nonstopgifs.com/animated-gifs/games/games-animated-gif-002.gif' width='150'/></a>
</div>

10. Gantilah http://aagen-blog.blogspot.com/ dengan nama blogmu
11. Ganti Harree gene belum punya Blog, Ketinggalan zaman loe... dengan kata-kata sesukamu. Kata ini muncul pada saat hendak diklik oleh mouse.
12. Ganti 175 dengan tinggi gambar yang sesuai
13. Ganti http://www.nonstopgifs.com/animated-gifs/games/games-animated-gif-002.gif dengan alamat URL sumber gambar
14. Ganti 150 dengan lebar gambar yang sesuai
15. Jika selesai mengedit, klik Pratinjau
16. Save Changes atau Save Template

Membuat Tombol Next Page Nomor Halaman Pada Blog

Ingin membuat tombol Next Page 1, 2, 3,4 >> ... pada blogger ? jangan khawatir kita bisa memasangnya dengan mudah di blogger sehingga pengunjung dengan mudah mengeksplorasi halaman artikel kita lebih leluasa dan untuk mempercantik blog supaya lebih kelihatan professional lagi.

Sebenarnya untuk membuat Next Page / Navigasi Halaman itu caranya sangat mudah kita hanya perlu menambahkan script pada Fotter dari blogger kita.

caranya seperti ini :

1. Pertama-tama Copy Code dibawah ini

<style>
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #ccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #ccc;
background-color:#ccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #ccc;
background: #ccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #ccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333;
}

</style>






<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var pageCount=5;
var displayPageNum=6;
var firstPageWord = 'First';
var endPageWord = 'last';
var upPageWord ='Back';
var downPageWord ='Next';


var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"></span>'+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span class="showpage"> Total '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;

}

if(postNum==1) postNum++;
html += '</div>';

if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
}

}
</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>

2. Setelah itu seperti biasa masuk Rancangan

3. Lalu tambahkan Add Page Element / Gedget --> HTML/Javascript pada bagian Fotter dan Paste Code yang di atas tersebut

4. Setelah itu save, Lalu geser gadget tersebut ke bagian bawah kotak postingan Anda, seperti gambar di bawah ini:



Jadi deh...

Catatan : Jika setelah melakukan ini tidak berhasil, maka setelah halaman blog kamu tampil coba kamu klik older post dulu satu kali. Di beberapa template fungsi ini muncul mulai halaman kedua. Kalau Tidak Muncul Juga, Coba Kamu klik pada label blog yang memiliki artikel banyak, nanti akan muncul di situ. Karena memang beberapa template tidak mendukung script ini.

Tambahan : Untuk menambah jumlah posting yang ingin di tampilkan ganti angkanya var pageCount=5 Selamat Mencoba. Terima Kasih

Cara Membuat Teks atau Tulisan Berwarna di Postingan Blog

The Next adalah cara bagaimana membuat teks atau tulisan berwarna di postingan blog. Adapun fungsi dari teks berwarna adalah untuk menentukan point-point mana yang dianggap penting dan perlu diperhatikan oleh pembaca. Mungkin para rekan blogger yang lain sudah membahas topik ini di blog mereka namun saya akan lebih membahasnya lebih detail, yah hitung-hitung untuk menambah postingan hehe.... .Wokeh ga usah berbelit-belit cekidot......

Perhatikan kode HTML di bawah ini :

<span style="color:#3300cc;">Membuat Teks Warna di Blog</span>
Kode diatas nantinya akan mempunyai tampilan seperti ini

Membuat Teks Warna di Blog

Pada angka  #3300cc adalah kode warna tulisan, kode warna ini bisa anda ubah sesuai dengan keinginan, berikut kode-kode warna di HTML

Kode	Warna	Kode	Warna	Kode	Warna
#ff0033	OOOOOOOO	#3300cc	OOOOOOOO	#ffff33	OOOOOOOO
#cc9933	OOOOOOOO	#99ffff	OOOOOOOO	#33ff66	OOOOOOOO
#ff0066	OOOOOOOO	#00cc00	OOOOOOOO	#00ff00	OOOOOOOO
#66ff00	OOOOOOOO	#99ff66	OOOOOOOO	#000066	OOOOOOOO
#330066	OOOOOOOO	#660066	OOOOOOOO	#990066	OOOOOOOO
#cc0066	OOOOOOOO	#000000	OOOOOOOO	#330000	OOOOOOOO
#660000	OOOOOOOO	#990000	OOOOOOOO	#cc0000	OOOOOOOO

Kode di atas merupakan beberapa contoh saja karena sangking terlalu banyaknya kode, tetapi pada umumnya warna yang dipakai adalah warna merah, biru dan hijau .Terlalu banyak warna terlalu berat pula nanti mata menyesuaikan

MENAMBAH ELEMEN HALAMAN (GADGET) DI BAWAH HEADER

Jika sahabat sebagai blogger pendatang baru (new blogger) seperti saya, kita biasanya memiliki ilmu yang pas-pasang dalam hal disain template blog. Karena itulah untuk membuat blog, tidak ada pilihan lain kecuali harus menggunakan templates standar blogger atau mendownloadnya dari beberapa situs penyedia seperti www.eblogtemplates.com, www.ourtemplates.com,www.blogspottemplates.com dan lain-lain (gratis). Di satu sisi, templates tidak semuanya menyediakan menu atau fasilitas yang kita inginkan. Contoh sederhana misalnya elemen halaman, yang dalam dunia blogging disebut gadget. Seperti kita ketahui, gadget umumnya terletak di bagian kiri dan kanan (side bar), walaupun ada juga di bagian kiri saja, di bagian kanan saja atau di bagian bawah.

Jarang kita temukan templates dengan posisi gadget di bagian atas. Sementara itu, proses modifikasi templates dalam rangka optimasi blog, kadang-kadang mengharuskan kita untuk meletakkan widget atau asesoris lainnya di bagian atas atau tepatnya di bawah header. Ambil contoh, misalnya kita ingin menambah menu navigasi (tabs menu) yang umumnya diletakkan di bagian atas (di bawah header). Sebagai blogger baru, kondisi seperti ini tentu merupakan kesulitan tersendiri. Bertitik tolak dari uraian tersebut, merupakan inspirasi bagi saya pada kesempatan ini untuk berbagi dengan sahabat blogger, khususnya blogger baru seperti saya bagaimana menambah elemen halaman (gadget) yang posisinya di bawah header. Langkahnya sangat sederhana, simple dan sangat mudah. Untuk itu, silahkan ikuti langkah-langkah sebagai berikut :

1. Login ke blog sahabat (www.blogger.com).
2. Klik dasbor, tata letak, lalu klik edit html.
3. Beri tanda contreng pada kotak kecil yang bertuliskan expand widget templates.
4. Cari kode seperti kode di bawah ini :

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

atau seperti ini :

<b:section class='header' id='header' maxwidgets='1'>

(gunakan kontrol F supaya cepat)

Setelah ketemu, hapus semua kode tersebut dan gantikan dengan kode berikut :

<b:section class='header' id='header' preferred='yes'>

# Simpan perubahan dan selesai.

Silahkan klik dasbor, tata letak untuk melihat perubahan yang terjadi. Akan nampak tulisan tepat di bawah header add gadget (tambah elemen halaman).

Membuat Menu di Bawah Header / Judul Blog

Bagi rekan blogger yang menggunakan template yang belum difasilitasi dengan menu horisontal dibawah header pada blognya, berikut saya postkan bagaimana cara membuat menu tersebut. Fungsi dan kegunaan menu ini adalah agar memudahkan kita dalam menelusuri  semua isi yang terkandung didalam blog tersebut (baca: easy to navigate)  .Yuk kita mulai...



Hal pertama yang harus dilakukan adalah login ke blogger > Layout/Tata Letak > Edit Html .
Selanjutnya Anda cari kode dibawah ini, untuk mempermudah pencarian silahkan gunakan CTRL+F

<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'>
<b:widget id='HTML1' locked='false' title='' type='HTML'/>
</b:section>
</div>

Anda ubah kode showaddelement='no' menjadi  showaddelement='yes' , kalau sudah klik simpan ya

Setelah yang pertama sudah disimpan, sekarang klik Page elements / Elemen Laman > Tambah Gadget > HTML/Javascript , copy kode dibawah ini,simpan dan letakan tepat dibawah header.
Untuk menambah gadget dibawah header bisa baca  disini

<a href="http://www.masbugie.com " class="navigation">HOME</a>
<a href="http://www.masbugie.com " class="navigation">CONTACT</a>
<a href="http://www.masbugie.com " class="navigation">BUKU TAMU</a>
<a href="http://www.masbugie.com " class="navigation">FACEBOOK</a>
<a href="http://www.masbugie.com " class="navigation">TWITER</a>
<a href="http://www.masbugie.com " class="navigation">DOWNLOAD</a>
<a href="http://www.masbugie.com " class="navigation">LAIN-LAIN</a>
<a href="http://www.masbugie.com " class="navigation">CHATTING</a>

*Alamat url diatas silahkan sesuaikan dengan blog Anda.


Hal ketiga adalah supaya menu itu menimbulkan efek warna sehingga menjadi kelihatan menarik.

Klik Tata Letak > Edit HTML , cari kode </b:skin> , agar mudah gunakan tombol CTRL+F
Copy kode dibawah ini dan letakan tepat diatas kode  </b:skin> kemudian simpan.

a.navigation {
background: #3333ff ;
color: #ffffff;
margin: 1px;
padding: 2px;
border-width: 0;
text-transform: uppercase;
text-decoration: none;
font-weight: bold;
}
a.navigation:hover {
background: #333333;
color: #ffffff;
text-decoration: none;
}

Perhatikan kode yang berwarna biru adalah warna tombol dan efek hover dan bisa dirubah sesuka hati Anda.Dan yang berwarna merah adalah jarak antara tombol satu dengan lainnya, silahkan Anda sesuaikan sesuai selera.
Untuk mengetahui kode-kode warna dalam HTML silahkan lihat juga disini

Selesai, semoga bermanfaat....salam

Menambah Elemen Diatas Dan Bawah Posting Blogger

Bagi kalian yang membutuhkan tutorial cara menambah elemen diatas dan bawah posting blog agar dapat digunakan untuk menambah gadget yang kalian butuhkan nantinya, seperti menambah gadget untuk iklan, headline news, dan lainnya. Menambah elemen diatas atau bawah posting sangat membantu untuk menampilkan sebuah iklan atau gadget yang bermanfaat bagi blog agar terlihat lebih indah dan tidak merusak tampilan blog. Kalian bisa menambahkan elemen baru diatas dan bawah posting tanpa harus merubah dan mengedit template ataupun elemen halaman yang sudah ada. Kalian tinggal merubah beberapa baris kode. Baiklah langsung saja ikuti langkah-langkah berikut:

- Login ke akun Blogger kalian
- Pilih Tata Letak dan Edit Html

- Cari kode dibawah ini:

<div id="main-wrapper">
<b:section class="main" id="main" showaddelement="no">

atau

<div id="'wrapper'">


- Setelah menemukannya, ganti kode tersebut menjadi kode dibawah ini:

<div id="main-wrapper">
<b:section class="main" id="main" preferred="yes">

- Jika langkah-langkah diatas telah dilakukan, Simpan Template dan lihat hasilnya pada bagian Tata Letak maka akan tampil elemen baru diatas dan bawah posting blog kalian.

Jika menggunakan menu readmore atau baca selengkapnya pada blog kalian maka gadget yang akan dipasang pada bagian bawah posting akan muncul setelah mengklik readmore atau baca selengkapnya.

Selamat mencoba dan semoga bisa membantu bagi kalian yang membutuhkan, terima kasih telah berkunjung.

Membuat Scroll Pada Label, Arsip Blog Ataupun Widgets Lainnya

scroll itu adalah sesuatu yang bisa ditarik ke atas dan ke bawah, seperti pada halaman utama blog ini. Atau Pada arsip  di blog ini maupun NEW dan Blogger ter'buwel, Yang mana widgets2 tadi adalah widgets yang berupa bawaan dari blogger atau blogspot. Atau bisa juga widget2 lainnya yang memang pengin diberikan scroll... :-)

Dan Langsung ke cara membuatnya yaitu

1.Sign in seperti biasa di blogger
2.Ke Tata letak---> terus ke Edit Html
3.Cari Kode:

<b:widget id='Profile1' locked='false' title='Mengenai Saya' type='Profile'/>
<b:widget id='HTML6' locked='false' title='Jam' type='HTML'/>
<b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'/>
<b:widget id='Label1' locked='false' title='Kategori' type='Label'/>
<b:widget id='Followers1' locked='false' title='Pengikut' type='Followers'/>
<b:widget id='HTML7' locked='false' title='Statistik Blog Ini' type='HTML'/>
<b:widget id='HTML1' locked='false' title='Kotak Chatting' type='HTML'/>

4.Lha trus cari nama widgets yang akan anda beri scroll.
Misalkan anda pengin mengasih scrollnya untuk Arsip Blog, maka kodenya kira2 seperti ini

<b:widget id='BlogArchive1' locked='false' title='Arsip Blog' type='BlogArchive'/>

Nah kode id yang nanti di pakai untuk Arsip blog ini adalah BlogArchive1

5. Kemudian Pastekan Kode dibawah ini di atas kode ]]></b:skin>

#BlogArchive1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

Kemudian simpan Templete.
Nah kalo berhasil nggak akan Error, dan Arsip Blog kita akan terscrollkan.

Cara ini bisa juga untuk membuat scroll pada label, Seperti contoh script diatas (script no 3) yang mengambarkan id Label yaitu Label1, maka kita tinggal mengganti kata BlogArchive1 pada script nomer 5 dengan Kata Label1.
Sedang Untuk tinggi scroll bisa diatur sesuai selera yang kalo yang diatas itu tulisan 200px ea...

Udah gitu ajah, moga ada manfaatnya bagi anda.

Cara Mengganti Icon Blog

Jika kita membuka suatu website atau blog maka seringkali kita menjumpai ada sebuah gambar atau icon pada address bar (kotak untuk mengetikkan alamat web). Dan jika kita punya blog di Blogspot maka icon default yang akan tampil adalah gambar seperti ini :
Bagi kamu yang tidak puas dengan icon/gambar tersebut, kamu bisa menggantinya dengan gambar sesuai dengan keinginanmu. caranya sangat mudah, yaitu dengan membuat gambar (gif, jpg, ico, dan lain2) dengan ukuran kira2 24x42 pixel sampai 32x32 pixel (sebenarnya ukurannya bebas sih, tapi biar filenya kecil dan proses membukanya cepat). Setelah itu .....
masuk ke "Layout --> Edit HTML" trus tempatkan script berikut sebelum kode </head>

<link href='http://kendhin.890m.com/sonictrik.gif' rel='SHORTCUT ICON'/>

ganti huruf yang dicetak tebal dengan lokasi gambar dimana kamu menyimpannya. Kamu bisa menyimpan gambarmu di 000webhost atau bisa juga di photobucket dan juga di imageshack atau kalo kamu tidak mau pusing dibawah ini ada beberapa contoh icon/gambar beserta dengan linknya.

http://img87.imageshack.us/img87/5862/image1an1.gif
http://img110.imageshack.us/img110/6218/image2ie0.gif
http://img98.imageshack.us/img98/9617/image3cr0.gif
http://img134.imageshack.us/img134/633/image4hx4.gif
http://img139.imageshack.us/img139/83/image5oa7.gif
http://img509.imageshack.us/img509/6449/image6fu0.gif
http://img527.imageshack.us/img527/6543/image7go9.gif
http://img507.imageshack.us/img507/5774/image8wn8.gif
http://img150.imageshack.us/img150/5784/image9qo1.gif
http://img404.imageshack.us/img404/1214/image10vr1.gif
http://img412.imageshack.us/img412/3808/image11pc0.gif
http://img100.imageshack.us/img100/4658/image12du2.gif
http://img132.imageshack.us/img132/4733/image13lj1.gif
http://img145.imageshack.us/img145/7793/image14zg9.gif
http://img412.imageshack.us/img412/4403/image15jc7.gif
http://img264.imageshack.us/img264/7575/image16kn8.gif

Cara Membuat Tulisan Berkedip

anda pengen punya tulisan

kyak gini pada blog and, klu bagi saya sih tulisan kayak gini dapat meyakinkan pengunjung untuk mencobany, soalnya tulisannya tampak lebih meyakinkan. anda pengen coba..!!

Caranya gampang banget anda tinggal menambahkan code <blink>
 pda awal text yang anda inginkan dan </blink> pada akhir text di HTML seperti contoh di bawah ini:

<blink><a href="http://www.arie-aldyno.co.cc">blog saya..</a></blink>

 anda tinggal simpan deh
jadi deh tulisanya

Cara Menampilkan Background Pada Posting

halo sobat blogger..!! Saya akan beri trik memposting yg namanya cara membuat backgruond pada postingan. Trik ini bertujuan agar tampil beda atau agar lebih enak dilihat maka suatu postingan diberi bacckground. Tepat pula untuk memisahkan suatu kata pengantar dan isi atau pengumuman.
Caranya sangat mudah

1. Buat posting baru
2. Klik tab edit html jangan yang tulis
3. Lalu gunakan code berikut:

- Background dengan warna
<div style="background:Isi kode warna HTML;">

(Tulis artikel anda disini)

</div>

- Atau ingin background image
<div style="background:url(alamat gambar) no-repeat;">

(Tulis artikel Anda disini)

</div>

Cara Membuat Tulisan Berjalan Pada Taskbar Blog

Bagi Seorang Bloger tak lengkap rasanya bila tak memiliki tulisan berjalan pada taskbar blog, dan pada kali ini saya ingin berbagi dengan rekan blogger tentang cara membuat tulisan tersebut. mari kita memulai 

langkah 1 : log in ke blogger

langkah 2 : plih tata letak

langkah 3 : edit HTML

     Lalu masukkan code berikut

=================================

<script language='JavaScript'>

    var txt=&quot;.:: www.arie-aldyno.co.cc ::.&quot;;
    var kecepatan=180;var segarkan=null;function bergerak() { document.title=txt;
    txt=txt.substring(1,txt.length)+txt.charAt(0);
    segarkan=setTimeout(&quot;bergerak()&quot;,kecepatan);}bergerak();
    </script>

=================================
Copy di bawah code <head>

ket: tulisan yang berwarna tebal anda ganti dengan teks anda sendiri

kemudian save,dan lihat hasilnya
mudah bkan.....????

Cara Bikin Link Sentuh

Bagi Anda yang sudah memulai karir blog dan menumbuhkan blog Anda, tentu senang rasanya mulai menapaki berbagai modifikasi dan desain untuk blog Anda. Satu hal menarik adalah modifikasi soal link. Memang modifikasi soal link tak pernah habis. Kali ini saya akan memberitahu cara bagaimana membuat sebuah link terbuka tanpa klik. Biasanya tujuan link terbuka begitu ada aksi klik, tetapi dengan script ini hanya dengan menyorotnya saja link sudah terbuka.

Cara untuk membuatnya sangatlah simpel, coba perhatikan dua link di bawah ini

1. masuk ke blogger anda
2. pilih tata letak
3. tambah gatged
4. pilih java script
5. copy paste aja kodenya
   

ini kodenya :
<a href="http://www.arie-aldyno.co.cc" onMouseover="window.location=this.href">arie aldyno | kumpulan tipstrik blogger</a>

ket : cukup anda copy link tsb langsung ke java script

caranya..
ganti target=_blank> dengan onMouseover="window.location=this.href">

semoga bermanfaat !!!

Efek Pelangi Pada Link

 anda pengen coba

langsung aja ya...
caranya

1. log in dulu ke akun anda
2. trus edit HTMLnya
3. masukkan code berikut

----------------------
<script src='http://tipsbloggerzacky.googlecode.com/files/rainbow.js'/>
----------------------
tambahkan dibawah tulisan <head>

lalun simpan, lihat deh hasilnya

Cara Pasang Kotak Komentar Facebook di Blogger

Akhirnya artikel yang sangat ditunggu-tunggu Di Publish juga, ini adalah fitur yang paling ditunggu untuk pengguna blogger, dalam langkah-langkah sangat mudah untuk meng-integrasi kotak komentar facebook dan blogger ( blogspot) blog.

Sekarang pengunjung tidak perlu ketik alamat email mereka atau nama untuk memberikan komentar di situs anda. Mereka hanya login ke account facebook mereka secara otomatis sudah bisa komentar .
Semua orang terhubung melalui facebook , Hal ini akan mendorong lebih banyak orang untuk komentar karena kebanyakan orang sudah log in ke account mereka.

Oke mari kita melakukannya, jangan khawatir, saya tahu bahwa Anda ingin mencoba menambahkannya ke blog blogger namun tanpa hasil, tetapi sekarang Anda akan melihat bagaimana cara menambahkannya dengan langkah sangat mudah dan bekerja 100%. tetapi harap berhati-hati dan memperhatikan semua rincian.
Kini Pengunjung yang Punya Account Facebook bisa Berkomentar di Blog Anda

Cara Pasang Kotak Komentar Facebook di Blogger seperti ini

Langkah 1. Nonaktifkan Default Komentar.

Hal pertama yang harus Anda lakukan yakni Nonaktifkan Setting Komentar ANda . karena Anda tidak ingin memiliki 2 bentuk komentar, dan jika memang membutuhkan dua komentar biarkan saja seperti biasa.

Silahkan ke account blogger Anda
navigasikan ke" PENGATURAN " Lalu Klik " KOMENTAR " Pada Menu KOMENTAR Klik " SEMBUNYIKAN " kemudian gulir ke bawah dan klik   SIMPAN 

Langkah 2. Buatlah Facebook App ID ( Aplikasi di Facebook ).

sekarang Anda harus menghasilkan facebook app id Anda sendiri, itu benar-benar mudah dan prosesnya hanya satu langkah, Login dulu dengan Account Facebook Anda LaluSilahkan Kunjungi, pengembang facebook disini :  Facebook developers

Anda akan diwa ke halaman seperti Contoh pada Gambar dibawah :

Masukkan nama aplikasi Anda, (Anda dapat mengetikkan nama apa saja) dan Klik  Setuju  lalu klik  Buat   Aplikasi. Sebagai contoh saya membuat aplikasi dengan nama " Kotak Komentar "

Maka anda akan dibawa ke Halaman berikut seperti Gambar di bawah ini:
 

kemudian klik pada tab Connect (Terhubung) (pada daftar-tab kiri) Anda akan dibawa kehalaman Terhubung seperti gambar dibawah ini :

Ingat Sewaktu Memasukkan ULR Terhubung Jangan Lupa beri tanda / pada akhir ULR Blog sobat, sebagai Contoh pada gambar diatas saya masukkan ULR Terhubung : http://trafikmagic.blogspot.com/

Masukkan Base Domain : blogspot.com.

Lalu Klik Simpan Perubahan
Selanjutnya Silahkan Klik Dasar Untuk Mengambil No Application ID , Copy dulu Application ID di NotePad atau Word agar mudah kita ambil saat kita gunkan nanti pada Langkah Berikutnya.

Langkah 3. Menambahkan Kode pada template blogger

 Anda harus menambahkan kode berikut ke template blogger Anda untuk memastikan bahwa kotak komentar akan bekerja pada blog Anda dengan cra yang benar.
Silakan pergi ke akun blog Anda lagi,
Arahkan ke PENGATURAN + RANCANGAN + Edit HTML Lalu Centang Expand Template Widget

Jangan Lupa Download Template Anda untuk menjaga jika terjadi kesalahan.

Cari 

< body >

Tambahkan Kode berikut dibawahnya

<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : &#39;APP-ID Anda&#39;,
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};

(function() {
var e = document.createElement(&#39;script&#39;);
e.src = document.location.protocol + &#39;//connect.facebook.net/en_US/all.js&#39;;
e.async = true;
document.getElementById(&#39;fb-root&#39;).appendChild(e);
}());
</script>

Ganti APP ID dengan APP ID Aplikasi Facebook yang tadi Anda buat.

Sekarang Cari   

</head>

Letakkan Kode Berikut dibawahnnya

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta content='Nama Blog Anda' property='og:site_name'/>
<meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='APP-ID Anda' property='fb:app_id'/>
<meta content='Profile-ID-Facebook Anda' property='fb:admins'/>
<meta content='article' property='og:type'/>

Nama Blog Anda : Ganti dengan Nama Blog Anda
http://google.com/help/hc/images/logos/blogger_logo.gif' : Bisa Anda Ganti dengan Gambar anda atau juga bisa di hapus.
APP-ID Anda : Ganti dengan APP ID anda
Profile-ID-Facebook Anda : Ganti dengan ID Profile Facebook Anda.

Sekarang kita selesai menambahkan kode facebook untuk template Anda, jangan menyentuh apa pun dan melanjutkan ke langkah berikutnya.

Langkah 4. Menambahkan Komentar Box Blogger Template Anda.

Silakan Cari kode Berikut

<data:post.body/>

Letakkan Kode Berikut dibawahnya
Jika Punya dua <data:post.body/>  karena sudah pasang Readmore Silahkan Letakkan di bawah <data:post.body/> yang kedua

<b:if cond='data:blog.pageType == "item"'><br /> <p align='left'><a href="http://www.arie-aldyno.co.cc/2010/04/13.html" target="new"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuMMTU9H_gtpPFKQAFEn51JoxgWr5fhq-wLDKWCU0DppcSK1zGdd8WXaZr0yGEoBaHe5QEGElXYKV96GePAie54uLFFmC0tdhy-tb8HUEQtUFMWRZL3yF_bCItSRfdfReWfaX8plqUrD0/s1600/comment.gif" /></a></p><div><fb:comments width='450' expr:title='data:post.title' expr:url='data:post.url'   expr:xid='data:post.id'/></div><div style='background-color: #f2f2f2;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'><b>  by <a href='http://www.arie-aldyno.co.cc/2010/04/13.html' target='_blank' title='Facebook Comment'>Facebook Comment , Mau ?</a></b></div></b:if><br /> 

Mau Lihat Hasil Nya????
            Ne Ada Di bawah....:P


Semoga Berhasil .....

by Facebook Comment , Mau ?

Cara Menambahkan Effect Salju ke Blog Kamu Dengan Warna Yang Kamu Suka

Untuk memulai prosesnya ikuti langkah berikut:


1. Login ke Blogger klik Layout/Tata Letak ----> Edit HTML
2. Cari Kode <body> Kalo dah Ketemu CopyPaste kode/Script efek salju di bawahnya,

Silahkan Pilih warna salju yang kamu suka, Tapi ingat Hanya meletakkan SATU Script efek salju berwarna, Jika lebih dari satu maka skrip efek salju berwarna yang paling atas-lah yang hanya muncul.



Hanya mengkopy Mulai dari code <script sampai </script>

Merah

<script src='http://agungosx.googlepages.com/saljumerah.js' type='text/javascript'></script>

Kuning

<script src='http://agungosx.googlepages.com/saljukuning.js' type='text/javascript'></script>

Hijau Muda

<script src='http://agungosx.googlepages.com/greensalju.js' type='text/javascript'></script>

Hijau Tua

<script src='http://agungosx.googlepages.com/saljuijotua.js' type='text/javascript'></script>

Merah Muda/Pink

<script src='http://agungosx.googlepages.com/pinksalju.js' type='text/javascript'></script>

Ungu

<script src='http://agungosx.googlepages.com/saljuungu.js' type='text/javascript'></script>

Biru Muda

<script src='http://agungosx.googlepages.com/saljubirumuda.js' type='text/javascript'></script>

Biru Tua

<script src='http://agungosx.googlepages.com/saljubiru.js' type='text/javascript'></script>

Coklat

<script src='http://agungosx.googlepages.com/saljucoklat.js' type='text/javascript'></script>

Orange

<script src='http://agungosx.googlepages.com/saljuorange.js' type='text/javascript'></script>

Hitam

<script src='http://agungosx.googlepages.com/saljuhitam.js' type='text/javascript'></script>

Absolutely Putih

<script src='http://agungosx.googlepages.com/saljuputih.js' type='text/javascript'></script>

Script Kursor Ular-Ularan Untuk Blog

Pertama yang harus anda lakukan adalah,
Login ke akun blogger anda masing-masing
Kemudian Pilih Tata Letak --> Edit HTML.

Tips : Sebelum anda melakukan edit template, sebaiknya simpan dulu template anda, dengan cara meng-klik tulisan Download Template Lengkap. Kemudian simpan kedalam harddisk atau media penyimpanan lainnya. Sehingga jika terjadi hal-hal yang tidak di inginkan anda masih bisa mengembalikan keadaaan blog anda seperti semula.

Cari kode </head>

Tips : Untuk mempercepat pencarian anda, gunakan tombol F3/CTRL F.
Kalau sudah ketemu, copas kode berikut diatasnya.

<style type='text/css'>
/* Circle Text Styles */
#outerCircleText {
/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #000;
/* End Optional */

/* Start Required - Do Not Edit */
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
/* End Required */
/* End Circle Text Styles */
</style>
<script type='text/javascript'>
//<![CDATA[
/* Circling text trail- Tim Tilton
Website: http://www.tempermedia.com/
Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
Modified Here for more flexibility and modern browser support
Modifications as first seen in http://www.dynamicdrive.com/forums/
username:jscheuer1 - This notice must remain for legal use
*/

;(function(){

// Your message here (QUOTED STRING)
var msg = "Masukkan teks kamu disini";

/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */

// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 24;

// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;

// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;

// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;

// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.4;

// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;

////////////////////// Stop Editing //////////////////////

if (!window.addEventListener && !window.attachEvent || !document.createElement) return;

msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement :

document.body,

mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},

makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) +

'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},

drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},

init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},

ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};

o.id = 'outerCircleText'; o.style.fontSize = size + 'px';

if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};

})();
//]]>
</script>

Sekarang simpan template anda dan lihat sendiri perubahan nya,, hehehe
Bagaimana??

Catatan : Ganti teks yang berwarna merah dengan teks yang anda inginkan dan yang berwarna biru untuk ukuran teks.