Cara mudah membuat tombol scroll back to top di blog

 

Kawan-kawan semua, masih membahas mengenai blog. Kali ini saya berbagi info mengenai bagaimana  Cara mudah membuat tombol scroll back to top di blog. Caranya mudah sekali, sobat tinggal copy script dibawah ini. Tapi ikuti dulu langkah-langkahnya, seperti di bawah ini :
1.Harus login dulu ke blogger
2.Klik Rancangan
3.Setelah di edit tata letak tinggal klik "Tambah Gadget"
4.Selanjutnya masukkan script dibawah ini ke dalam gadget yang tadi telah disiapkan

<a style="display:scroll;position:fixed;bottom:5px;right:5px;" href="#" title="kembali ke beranda"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYS4RE17KHhWwVGJ8KpNgsY41qb1D9H3sROnAlV0R3g2OaX8HcvrVnFhjhyUwSGPeZ37H8gXQyXQARGOCUZiGebkmXI13qEPnVP0b895YF5EFAQSYCvWuAFsAgO1XUcWuPGUBcXx3V6DSH/s1600/back-to-top.png" border="0" alt="back to top" /></a>
5.Tinggal klik save
NB :

*Warna biru bisa diganti dengan gambar sesuai dengan keinginan sobat

*Warna merah bisa diganti dengan tulisan sesuai dengan keinginan sobat 

Semoga bermanfaat ya sobat...mohon tinggalkan pesan mengenai tips dan trik blog ini.

Description: Cara mudah membuat tombol scroll back to top di blog Rating: 4.5 Reviewer: mas didik - ItemReviewed: Cara mudah membuat tombol scroll back to top di blog

Sumber Artikel : http://dp-media.blogspot.com/2012/03/cara-mudah-membuat-tombol-scroll-back.html#ixzz1vOkinLyP

Read More

Membuat Burung Twitter Terbang Di Blogspot

Cara membuat / memasang widget burung Twitter terbang di Blogger, mungkin trik ini sudah tidak asing lagi bagi sobat dan sudah banyak sekali saya melihat blog yang sudah memasang widget burung Twitter terbang ini dengan berbagai macam style dan warna burung Twitter yang berbeda-beda, sekarang saya akan mengulas kembali khusus buat teman-teman blogger yang baru membuat blog dengan platform blogspot 

Twitter adalah layanan jejaring sosial yang sangat populer sekarang ini selain Facebook dan Google+ dan tidak salah banyak orang yang beramai-ramai untuk menjalin koneksi melalui Twitter apakah itu untuk keperluan bisnis maupun hanya sekedar berteman saja, nah bagi sobat yang mempunyai blog tidak ada salahnya memasang widget menarik ini selain membuat blog sobat cantik dan unik, widget ini juga mempermudah sobat untuk menjalin pertemanan baru dengan pembaca blog sobat, hanya dengan sekali klik pada burung twitter yang terbang maka akan otomatis terhubung dengan profile Twitter sobat,
Ok tanpa panjang lebar mari kita kupas bersama-sama cara memasang widget ini
Pertama-tama silahkan login di Blogger

• Klik Design > Page Element > Add Gadget > Html/Javascript
• Copy paste kode di bawah ini ke kolom Html/javascript

<!-- floating twitter Bird -->
<script type="text/javascript" src="http://bloggerpeer.googlecode.com/files/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTohF160WueSwu3HHyQqkcKQBRlrq9zKBwg_xCjWHPXsNiZ3_J7HiTriNdMLQPpSIKfRZIOku4-EYr6cycMC0JXnxbiHF_YuRXrdehMZEKz3ZvnRAsss-zvJu1jGj2n3ZLN3T4OnMcK3A/s1600/burung+twitter+terbang.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/Akun Twitter sobat";
var tweetThisText = "Twitter - UserID http://bloggerpeer.blogspot.com/";
tripleflapInit();
</script>

• Ganti kode yang berwarna biru dengan akun Twitter sobat
• Simpan dan lihat hasilnya

Warna Pilihan Burung Terbang Twitter

Untuk membuat warna burung twitter yang lain sobat bisa mengganti kode yang berwarna merah diatas dengan kode-kode dibawah ini sesuai dengan warna pilihan yang sobat inginkan
Warna Kuning

• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjySPi12ls-LjDXQUWUMr3wbnbHyzknXHQTCRABp3t5_J6ULqpBRPusR4zozFFZv22xYPfJlk3zcU-tw_ZPxyHQbeSfcc3r21V3-JIoSae954tbB19eL40tEyAF0SQxRqw3I9ioFZ2Dfbg/s1600/yellow+bird.png

Warna Hitam

• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjawNYjVXkNeyYt23MXydaNOiFzZnrKNgUpYEbpbYSptXPeW2Pbu8e7OByFefxNlgaxVsnnSnPPkMaTVHKIY-l7J1fZaA1XJWpxCSO5x2QJ01c39Zgcdp9NRY3iYSxtKquoyatEiBhIZQk/s1600/black+bird.png

Warna Biru

• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD9GqtIHqbDPgm2c5_LpOftKlnQ1Jo8tXamk-kvi0iMxwF4yGfuXZJ7ROF5BqXCHg4gT7iCU-YktRvBPWn6yBJrMCtLDbdaHzrrx5MQISKFK0D8GNRmMc_-CiMEXkjjui-RBLV3JWMJes/s1600/Blue+bird.png

Warna Coklat

• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLsRmSOB87FDmg6X8GbVF3GO0olnJF9VcZ1Tbtsg6k-ZKngcsId1sqO0eNnm1IeIP9IArxR8HrM9RvHzCGINIqK_wFJehU-EbbQ7ri5rBh8SpaAoKzMqjJmj7xaWUemg6EHteYyXWORn8/s1600/brown+bird.png

Warna Hijau

• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsoTLKuZ_wuCo1rjwjrzrdFCxgdj8C6kTJK2-CMsDixMsx3ZmbK_phFjBwBM68C5bzeQnQlIMvHqeBo-HToFcD9JNDVJy0ET155gCRFJphpHnRVt_slPaxyAzTx30Xn_vKD5o_1w_h4O4/s1600/Green+bird.png

Warna Ungu

• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOk2qcsXd6rH9BNWsydNEcPZIU0xGbZg4cg4vXo3pmHzE0vjhJFkE62l82C9g6C_3uh68R_jbEMigrZf8NMwOe9dqls55vC7OEA4V3liD9fIR_2DmEF7L46rl3I0UmLaDyYTQnkODqlMc/s1600/purple+bird.png

Warna Putih

• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPZjXWDcHbzePDuGf6P7yEFqtnXv8rpiQr0iUv-zRgx4whqyXgLu5q-L-8bg9uF_uFnfkHWeoDgmfYG40iy5o1rFE8lNyU7oldaODq83JlBho4s3uLciJyA9BmSWcaTF43d_0NTbqpDGU/s1600/white+bird.png

Warna Merah

• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiROznSBoG8-gDCgFzTItqtotn7f1tAmAWV-PYRCF8qFqRz25d0eSTa6vLlEbfQcCXA5R03-XpyZEZ3pUNTLzysioIMegPHphxwulKv3NdgtWpBwRYwmZlRDYBDuwkGWG-SGy1s0r8vI-U/s1600/red+bird.png

Dan terakhir jangan lupa disimpan
Good luck Sob..!

Read More

Membuat FB Like Box Melayang Slide Close

Membuat FB Like Box Melayang Slide Close

Pagi ini saya akan mencoba sharing sebuah widget facebook like box yang melayang dengan tombol close dengan efek slide ketika di tekan. Saya mencoba menggabungkan kode-kode script yang saya dapat dari bloger-bloger lain selama belajar blogging yang saya tekuni selama ini dan hasilnya menurut saya lumayan untuk diterapkan di blog. Bagi para master, tolong kasih masukan tentang widget ini kalau ada kesalahan. Widget ini lumayan simpel karena tidak perlu mengobok-obok HTML template blog Anda.

Bagi yang ingin mencoba menggunakannya di blog, silahkan ikuti caranya di bawah ini.

1. Seperti biasa silahkan login ke blog Anda.

2. Dashboard >> Layout >> add a gadget >> pilih HTML/JavaScript,kemudian copy kode di bawah ini.

<div style="display:scroll;position:fixed;top:50px;left:400px;">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://kompiajaib.googlecode.com/files/slidefbnew.js" type="text/javascript">
</script>
<style>
#kompiajaib_slidefb2012{
font-family: "Consolas", "Courier New", Courier, mono, serif;
border: 1px solid;
width: 355px;
margin: 10px 0px;
padding:5px 0px 0px 5px;
background-repeat: no-repeat;
position:relative;
color: #00529B;
background-color: #000000;
}
</style>
<div id="kompiajaib_slidefb2012">
<a class="close"  href="#close" style='position:absolute;right:0px;top:0px;margin-right:-1px;margin-top:-1px;'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg80liGncvtyIQ10whltHY6V1pvidKcEq4gRqpQtbtQmxA6-4S342sX470_9887b1ApszUGvBxsFLq04vQEPrVTRAE93Igykcn4BB0iRLTyUwpJqJK1EnJHKgSuTN8BO8aEmcLZHa0ujSzW/s1600/popover-close-button.gif" /></a>
<div style='width:99%;padding:8px 0px;background-color:#737373;font-family:arial;text-align:center;'><div style='color:#FFF;font-size:13px;font-weight:bold;'>Like us and get updates</div></div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Kompi-Ajaib/395526477133955&amp;width=350&amp;height=255&amp;colorscheme=dark&amp;show_faces=true&amp;border_color=%23FFFFFF&amp;stream=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:350px; height:255px;" allowtransparency="false"></iframe><div style="border: 0px; padding: 5px; background-color: none; text-align: right; font-size:9px;">Powered by <a href="http://kompiajaib.blogspot.com/" target="_blank">blogger widget</a></div>
</div></div>

Warna background widgetnya hitam atau dark.

#000000 adalah background widget, silahkan sesuaikan dengan template Anda. Untuk mengetahui kode warna silahkan masuk  

http://www.facebook.com/pages/Kompi-Ajaib/395526477133955 silahkan ganti dengan URL facebook Anda.

Jika background widgetnya terang, silahkan ganti dark dengan light. 

Demikin sharing Membuat FB Like Box Melayang Slide Close kali ini mudah-mudahan bermanfaat.

Broken link laporkan di sini

Read more: http://kompiajaib.blogspot.com/2012/05/membuat-fb-like-box-melayang-slide.html#ixzz1vM7P7urU

Read More

Cara Mudah Membuat Tab Menu Bar di Blogspot

Bagi yang menggunakan template bawaan dari Blogspot ini akan lebih mudah. Anda tidak perlu membuat elemen halaman baru di bawah header karena sudah tersedia yang bisa anda gunakan untuk memasang tab menu bar. Anda hanya tinggal memasukkan script nya saja.

Berikut script untuk cara mudah membuat tab menu bar di blogspot:
1. Masuk ke akun Blogger anda
2. Rancangan
3. Tambah Gadget
4. Javascript

1	<ul id='menubar'>

2	<li><a href='link/URL homepage blog disini'>Home</a></li>

3	<li><a href='link 1'>judul link 1</a></li>

4	<li><a href='link 2'>judul link 2</a></li>

5	<li><a href='link 3'>judul link 3</a></li>

6	<li><a href='link 4'>judul link 4</a></li>

7	<li><a href='link 5'>judul link 5</a></li>

8	<li><a href='link 6'>judul link 6</a></li>

9

</ul>

Linknya bisa anda isi dengan link apa saja sesuai keinginan anda dan kalau masih kurang tinggal ditambah saja.
5. Save

Read More

5 Blog Blogging Terbaik Indonesia

Selama sebulan ini, saya melakukan riset online tentang blog terbaik di Indonesia yang membahas topik blogging (tips konten, tips trafik, tips monetisasi, dan informasi make money blogging). Dari beberapa blog yang ditelaah, saya akhirnya memilih 5 blog terbaik.

Kriteria penilaiannya berdasarkan page rank, traffic rank Alexa, jumlah pelanggan, dan authority rank Technorati dengan total skor 40. Silakan Anda simak dan kunjungi kelima blog terbaik ini.

No	Nama Blog	PR	Alexa	RSS	Tcrati	Skor
1	Blognya Kang Rohman	3	9	10	1	23
2	O-om	3	8	10	1	22
3	Blogger Indonesia	5	7	4	2	18
4	Isnaini dot com	4	7	2	1	14
5	Blogguebo	3	4	3	1	11

Sistem penilaiannya sebagai berikut:

Skor	PR	Alexa	Pelanggan	Authority
1	1	100rb-90rb	0-500	0-75
2	2	90rb-80rb	500-1000	75-150
3	3	80rb-70rb	1000-1500	150-225
4	4	70rb-60rb	1500-2000	225-300
5	5	60rb-50rb	2000-2500	300-375
6	6	50rb-40rb	2500-3000	375-450
7	7	40rb-30rb	3000-3500	450-525
8	8	30rb-20rb	3500-4000	525-600
9	9	20rb-10rb	4000-4500	600-675
10	10	<10rb	>4500	> 675

Sekadar catatan, authority rank Technorati menggunakan authority baru yang dikeluarkan oleh Technorati mulai 14 Oktober lalu.

Update: Ingin tahu blog terbaik lainnya? Silakan simak 5 Blogger Wanita Paling Ngetop di Dunia dan 8 Blog yang Menghasilkan Uang Milyaran Per Tahun.

Read More

Cara Membuat Readmore Otomatis di Blogspot

Sebenarnya banyak blogger yang mempostingkan Tips ini, saya menulis ini juga supaya saya tidak lupa

Langsung saja

1. Masuk Blogger pilih Template

2. Centang Expand Template Widget

3. Cari kode </head> Supaya cepat klik Ctrl F dan tuliskan </head>
4. Masukkan kode dibawah ini tepat dibawah </head>

<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>

5. cari kode <data:post.body/> dan Ganti dengan kode dibawah ini :

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>&#187;&#187;&#160;&#160;READMORE...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Keterangan :

 

READ MORE : bisa diganti sesuai selera 

summary_noimg = 430; adalah tinggi potongan artikel tanpa gambar, bisa diganti sesuai selera
summary_img = 340; adalah tinggi potongan artikel dengan gambar, bisa diganti sesuai selera
img_thumb_height = 100; adalah ukuran tinggi thumbnail, bisa diganti sesuai selera
img_thumb_width = 120; adalah ukuran lebar thumbnail, bisa diganti sesuai selera

Save Template dan lihat hasilnya

Selamat mencoba

 

Read More

SkyDrive, Cara Mudah Menyimpan Data Online dan Sharing File

Untuk  anda pengguna MSN, Hotmail, tentunya sudah tidak asing lagi dengan SkyDrive ini. Yaitu salah satu  penyedia layanan solusi online untuk penyimpanan data atau lebih dikenal saat ini dengan Cloud Storage. 

SkyDrive saat ini memberikan space penyimpanan sebesar 25GB secara gratis, kapasitas yang lumayan besar dengan tampilan seperti Windows Explorer sehingga  lebih mudah  penggunaannya, cukup dengan drag & drop untuk proses uploading suatu file.

Untuk berbagi dengan orang lain kita bisa mensharing file kita,  dengan memberikan linknya.

Untuk melengkapi postingan atau artikel blog kita, bisa kita simpan di SkyDrive ini, lebihnya yaitu tidak ada iklan atau popup yang mengganggu sebagaimana umumnya layanan servis hosting gratis.

Di SkyDrive ini juga dilengkapi Ms.Office web Application, memungkinkan kita untuk create atau edit dokumen word, exel, atau Power Point secara online.

Kalau anda tertarik silakan create account Windows Live ID  di www.skydrive.com www.live.com ,  www.hotmail.com bisa masuk lewat mana saja karena semuanya sudah terintegrasi. Dengan 1 Account Windows Live ID anda sudah mendapatkan   Satu alamat e-mail @hotmail.com atau @live.com, Messenger, SkyDrive, dan Layanan dari Microsoft lainnnya.

Contoh langkah untuk sharing sebuah file di SkyDrive

• Beri ceklist / centang pada file atau folder yang akan disharing

• Klik pada Menu Sharing di sebelah kanan

• Pilih Get a link

Semoga bermanfaat  

Read More