Cara Membuat Cursor Bertaburan Bintang

Ada banyak sekali untuk meodifikasi atau membuat pernak-pernaik tentang cursor, yang sudah kita bahas saja ada mengubah cursor dengan gambar,membuat teks yang berputar mengelilingi cursor. Dan kali ini belajar membuat cursor yang bertaburan bintang. jadi saat cursor kita bergerak akan turun bintang-bintang dari cursor. Ada beberapa warna bintang yang bisa kita pilih untuk ditampilkan di blog kita.

Cara Membuat Cursor Bertaburan Bintang


1. Login ke blogger
2. Pilih Rancangan kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan salah satu kode HTML sesuai warna yang kita inginkan berikut ini:

<script src="http://kikiefendiclock.googlecode.com/files/www.kikiyo.co.cc.cursor-bintang-biru.js" type="text/javascript"></script>

5. Kita ganti warna biru dengan, hijau, merah, ungu, silver, kuning, hitam
6. Simpan jika sudah selesai. 

Cara Membuat Tombol Share Fb, Buzz, Digg, Twitter Di Blogspot

Assalamu'alaykum sahabat Voice of Khilafah... mau tau cara membuat tombol share seperti ini?

Membuat Tombol Share

Anda tertarik untuk mencobanya? baiklah kali ini saya akan bagikan salah satu rahasia saya dari kang salman hehe, berhubung ada yang bertanya kepada beliau tentang ini, terima kasih  Kang Salman atas informasinya.

bang gimana caranya buat share seperti gambar yang saya kirim iniseperti miliknya mas? mohon bantuanya terima kasih.

seperti yang kita tau tombol share ini merupakan elemen yang sangat penting, sebab dapat mendatangkan pengunjung yang banyak dari luar. ga percaya? coba tengok aja blog terselubung. 

Share atu berbagi saat ini merupakan hal yang penting karena itulah anda wajib memasang tombol share di blog atau web saudara :


Langkah 1
1.  Langsung saja silakan copy kodenya terlebih dahulu:

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div style='border-top:1px solid #ccc;border-bottom:1px solid #ccc; padding:8px 0px;margin:4px 0px 30px 0px;width:100%;float:left;height:20px;'>

<div style='float:left;padding-left:0px;font:normal 12px Georgia;font-style:Italic;'>

Share this history on : 

</div>

<div style='float:left;padding-left:10px;'>

<a name='fb_share' type='button_count'/> 

<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'>

</script></div>

<div style='float:left;padding-left:10px;'>

<a class='google-buzz-button' data-button-style='small-count' href='http://www.google.com/buzz/post' title='Post to Google Buzz'/>

<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/>

</div>

<div style='float:left;padding-left:10px;'>

<a class='DiggThisButton DiggCompact'/>

<script type='text/javascript'>

(function() {

var s = document.createElement(&#39;SCRIPT&#39;), s1 = document.getElementsByTagName(&#39;SCRIPT&#39;)[0];

s.type = &#39;text/javascript&#39;;

s.async = true;

s.src = &#39;http://widgets.digg.com/buttons.js&#39;;

s1.parentNode.insertBefore(s, s1);

})();

</script>

</div>

<div style='float:left;padding-left:10px;'>

<a class='twitter-share-button' data-count='horizontal' data-via='User Name' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>

</div>

</div>

</b:if>

*perhatikan pada kode diatas, ada tulisan user name twitter, ganti dengan milik Anda

Langkah 2

• Login ke Blogger » Rancangan » Edit HTML » Centang Expend Widget 
• Cari Kode lah  <div class='post-body entry-content'>

Tips mencari cepat: tekan ctrl+f dan masukan kode di atas, atau jika tidak ketemu musukan saja post-body kemudian cari kode yang mirip dengan yang saya sebutkan tadi di atas!

• Jika sudah ketemu pastekan code yang telah Anda copy tadi tepat di atasnya <div class='post-body entry-content'>
• Simpan Template dan Lihat hasilnya ! ^_^

Wah Trik kali ini lebih mudah dari yang sebelumnya bukan??? dijamin deh insya Allah cuma 20 Detik juga beres!

Oke sob, ana cukupkan sekian dulu ya.. mudah-mudahan dengan update kali ini anda dapat menikmatinya dengan puas, dan semoga bermanfaat!
Kasih link back ya klo copy-paste hehe... selamat membuat tombol share.

Cara Membuat Tombol Berbagi Jejaring Sosial Melayang

Setelah sebelumnya blog tutorial membahas tentang cara membuat tombol share facebook dan twitter di postingan Blog, sekarang kita akan mengulas kembali sebuah tombol berbagi tetapi bukan di postingan, tetapi di pinggir blog dan melayang

Mau lihat contohnya => http://awesomescreenshot.com/01388tq9e

1. Login ke blog
2. Pilih Rancangan
3. Tambah Widget
4. Pilih HTML/Javascript
5. Copy dan pastekan kode berikut :

<style  type="text/css">
*{margin:0;padding:0;}

* html #z33sHare{
position:  absolute;
}

#z33sHare{
right:1%;width:  70px;background:transparant;border:0px solid  #E7E7E7;-moz-border-radius:3px;-webkit-border-radius:3px;
position:fixed;
bottom:  20%;
}

#z33sHare div{
padding:6px 6px 6px 5px;
}

#stw{
margin-left:-2px;
}

#sfs{
margin-left:-5px;
}

</style>
<div  id="z33sHare">
<div id="ssl-box">
<div id="stw">
<a  href="http://twitter.com/share" class="twitter-share-button"  data-count="vertical">Tweet</a><script  type="text/javascript"  src="http://platform.twitter.com/widgets.js"></script>
</div>
<div><a  title="Post to Google Buzz" class="google-buzz-button"  href="http://www.google.com/buzz/post"  data-button-style="normal-count"></a><script  type="text/javascript"  src="http://www.google.com/buzz/api/button.js"></script>
</div>
<div>
<script  type="text/javascript">
(function() {
var s =  document.createElement('SCRIPT'), s1 =  document.getElementsByTagName('SCRIPT')[0];
s.type =  'text/javascript';
s.async = true;
s.src =  'http://widgets.digg.com/buttons.js';
s1.parentNode.insertBefore(s,  s1);
})();
</script>
<a class="DiggThisButton  DiggMedium"></a>
</div>
</div>
<div><a  name="fb_share" type="box_count"  href="http://www.facebook.com/sharer.php">Share</a><script  src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"  type="text/javascript"></script></div><div  style="clear:both;"></div></div>

6. Terakhir simpan template anda dan lihat hasilnya! :)


Keterangan :
Untuk mengatur posisi tombol pada cara kedua (Tombol Berbagi Terapung pada Pinggir Artikel) perhatikan kode pada Langkah 4 baris 1 :

1. bottom:20% = ubah nilai 20% untuk mengatur jarak antara bagian bawah browser dengan tombol
2. margin-left:185px = ubah nilai 185 untuk mengatur jarak antara bagian pinggir browser dengan tombol
3. float:left = ubah left ke right jika kita ingin menempatkan tombol di sebelah kanan halaman artikel
4. background-color:: transparant= artinya waranya transparan anda bisa menambahkan warna lainnya

Selamat mencoba dan semoga berhasil.:)

Cara Membuat Tombol Share Facebook dan Twitter Di Postingan Blog

Jejaring sosial merupakan media yang paling banyak dikunjungi dan Facebook merupakan jejaring sosial yang menempati peringkat pertama paling banyak dikunjungi di seluruh dunia setelah itu disusul oleh twitter di peringkat ke 2. Banyaknya pengunjung yang menggunakan jejaring sosial merupakan kesempatan baik bagi para blogger untuk membagikan setiap artikelnya kedalam situs jejaring sosial dengan harapan semakin banyak pengunjung yang datang untuk membaca-baca blog kita, tentunya hal ini sangat berpengaruh terhadap posisi blog kita di mata mesin pencari.

Namun jika kita sendiri yang membagikan artikel demi artikel dari blog kita ke situs jejaring sosial, maka para pengunjung yang akan datang ke blog kita hanya sejumlah teman-teman yang ada pada jejaring kita saja. Untuk itu menambahkan tombol atau link yang berfungsi untuk membagikan artikel kita ke situs jejaring sosial sangat bermanfaat bagi kita, agar para pengunjung blog kita dapat membagikan link artikel kita ke jejaring mereka. Nah berangkat dari situ kita akan mengulas sebuah trik tentang tombol share facebook dan twitter. 

LIVE DEMO

Langsung aja ke tutorial membuat tombol share facebook dan twitter di blogspot
1. Login ke Blogger  » Rancangan Edit  » Template
2. Ceklis Expend Template
3. Cari kode ini ]]></b:skin>
4. Masukan kode berikut tepat sebelum (diatas) kode ]]></b:skin>

.sharesoc {display:inline-block;float:right;height:125px;margin:5px 0;width:60px;}

5. Cari kode <data:post.body/>
(Tips : tekan F3 untuk mempermudahnya, masukan kode di atas dan tekan enter)
6. Masukan (copy-paste) kode berikut tepat di atas kode <data:post.body>

<span class='sharesoc'>
<div style='float: right; margin-right: 0px;'>
<a href='http://www.facebook.com/sharer.php' name='fb_share' type='box_count'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
<div style='float: right; margin: 8px 0px 0pt 0pt;'>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
</div> 
</span> 

Terakhir simpan template dan lihat hasilnya. Oke semoga bermanfaat. Assalamu'alaikum