search box Paling Keren

Hay sobat , disini kami akan memberikan tips blogger kepada kalian tentang bagaimana cara membuat kotak pencarian

Cara Membuat efek teks mengikuti dan melingkari cursor pada Blog

Untuk membuat efek animasi pada cursor yang di ikuti tulisan agar supaya tampilan pada blog anda terlihat lebih cantik dan menarik itu sangat mudah kok. Tahap yang harus kita lakukan adalah:

   1. Log in ke blog anda
   2. Klik Tab Layout ( Tata Letak)
   3. Pada elemen halaman klik Tambah Gadget ( bebas dikolom mana aja)
   4. Kemudian pilih menua HTML/JavaScript
   5. Kemudia copy code Script berikut ini :


<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, Time New Roman;
color: 0EFA0E;



/* 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">


/* 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 = "dinara-289.blogspot.com";


/* 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 = 25;


// 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>

Pada tulisan " dinara-289.blogspot.com " Silahkan ganti dengan tulisan sesuai dengan kesukaan anda atau nama dari blog anda sendiri.

Anda juga bisa memodifikasi sesuai dengan selera anda  dari diameter lingkaran, kecepatan, jenis font, warna dan juga ukran Font sesuai dengan selera anda. Selamat mencoba.

semoga bermanfaat.

Cara Pasang Lagu - Music Background Auto Play di Blog

Untuk membuat Music Background Auto Play di Blog siapkan dulu bahan-bahan yang akan di perlukan.

1. File Mp3 yang akan dijadikan music background.
2. Daniusoft Video Converter Ultimate untuk mengkonvert file Mp3 menjadi file Swf. Kalau belum punya cari di google banyak yang share.
3. Secangkir kopi :p

Berikut langkah-langkahnya:

1. Convert file Mp3 menjadi file Swf menggunakan Daniusoft Video Converter Ultimate.

2. Upload file Swf yang sudah di konvert ke swfcabin.com

3. Setelah selesai mengupload anda akan diberikan link, contohnya seperti ini

http://www.swfcabin.com/open/1332455819

4. Login ke Blogger - Rancangan - Elemen Laman - Tambah Gadget

5. Pilih HTML/JavaScript dan pasang kode di bawah ini

<embed autostart='true' loop='true' width=0 height=0 src='http://www.swfcabin.com/swf-files/1332455819.swf'/></embed>

Note: Angka yang berwarna merah adalah ID dari file Swf yang anda upload tadi. Jika ingin mengganti lagu yang sudah ada, Lakukan cara yang sama dan tinggal mengganti ID filenya saja

Selesai... Silahkan anda mencobanya..

Bonus ID file swf yang sudah terupload:

• 1323755387 = Street Beat - I Wanna Change
• 1318498118 = Mr.Katro - Balasan hamil duluan
• 1324612446 = Budi doremi - Demam ayu ting ting
• 1316792396 = Still Virgin - Dear ndut
• 1325776188 = Still Virgin - Merangkai imajinasi
• 1317323203 = Still Virgin feat Cha - Hate to miss someone
• 1327732128 = Travie Mc.Coy feat Bruno Mars - Billionaire
• 1332429471 = Cleopatra Stratan - ZUNEA ZUNEA
• 1332357461 = Big Bang – Bad Boy

Atau Instrument :

Cara Memasang Chatbox di Blog (Blogger)

semangat sobat!

Chatbox atau Guest Book (Buku Tamu), ada juga yang menyebutnya dengan sebutan Shoutbox atau Shoutmix adalah sebagai tempat chatting (ngobrol/berinteraksi) dan berkirim pesan antara pengunjung blog dengan admin (pemilik) blog, maupun antara pengunjung dengan pengunjung yang lainnya.

Seperti yang kalian lihat, saat ini saya menggunakan Chatbox dari layanan Cbox.ws Tampilannya sederhana, bukan model yang Hide/Unhide, bisa dilihat di bilah blog ini bagian sebelah kanan.

Nah, jika diantara kalian ada yang ingin memasang Chatbox seperti Chatbox yang saya pasang ini, caranya mudah kok... karena sebenarnya kalian hanya tinggal menyalin kode HTML/javascript lalu memasangnya pada kotak html/javascript pada blog kita melalui menu Add Widget pada dashboard Blogger.

Untuk tampilan warna dan ukurannya, bisa disesuaikan dengan selera kamu.

Namun, sebelum mendapatkan kode html-nya untuk dipasang di menu Add  Widget, terlebih dahulu ada beberapa langkah yang harus kamu ikutin, yaitu membuat akun di Cbox.ws terlebih dahulu.

Berikut langkah-langkahnya :

1. Silahkan kunjungi www.cbox.ws

2. Isi form pendaftaran, tampilannya seperti yang terlihat pada gambar di bawah ini :

Keterangan :

> Cbox Name diisi dengan Nama kamu atau nama blog kamu. Ini akan menjadi nama akun Cbox kamu.

> Email address diisi dengan alamat email kamu, yang masih aktif tentunya. Ini berguna untuk me-recovery password, kalau suatu saat nanti kamu lupa password akun Cbox kamu.

> Password diisi dengan password sesuai keinginan kamu. Dan pada Confirm password tulis ulang password-nya

> Website diisi dengan alamat blog kamu.

> Languange dan Style, silahkan isi dengan keinginan kamu yaa...

> Centang kotak kecil persetujuan "terms and conditions"-nya

> Klik "Create my Cbox!"

3. Maka akan muncul tampilan seperti berikut :

Ini artinya, pendaftaran kita di Cbox, sukses. Tapi belum selesai sampai disini lho...

4. Silahkan login di akun Cbox, yang baru kamu buat. Tinggal memasukan passwordnya saja, setelah itu, klik tanda panah berwarna kuning yang berada di pinggir kotak password,

5. Setelah itu, kamu akan dibawa ke control panel home. Silahkan klik tulisan "Publish" (berwarna merah).

6. Maka akan muncul tampilan seperti yang terlihat pada gambar berikut :

Keterangan:

> Penting : Simpan kode Security tag kamu, ini berfungsi untuk menghapus spam atau pesan yang ingin kamu hapus di Chatbox kamu nanti.

Bagaimana cara menghapus pesan yang masuk di chatbox? akan saya jelaskan di lain waktu, Insya Allah...

> Nah, yang dilingkari warna merah itu lebih penting lagi, karena itulah kode HTML yang kita perlukan untuk memasang Chatbox di blog kamu. Silahkan copy semua kode itu, lebih mudahnya klik saja tombol yang bertuliskan "Copy to clipboard"

7. Login ke akun Blogger kamu

8. Pilih "Tata Letak" ---> "Tambah Gadget" ---> "HTML/JavaScript"

9. Pada jendela HTML/JavaScript : tuliskan Judul gadgetnya (misal Chatbox atau sesuai keinginan kamu), pastekan kode HTML/JavaScript yang telah kamu copy tadi di kotak dibawah tulisan "Konten", setelah itu klik "Simpan".

Selesai, silahkan cek blog kamu untuk melihat tampilan Chatbox yang telah kamu pasang. Untuk mengatur ukuran tinggi dan lebarnya, tinggal kamu utak-atik kode nya itu, (ubah angka "width" dan "height"-nya menjadi sesuai yang kamu butuhkan), gak susah kok... beneran deh, hanya butuh kesabaran dan ketelitian aja, heheh... Dan untuk mengatur tampilan huruf dan warnanya, klik saja pilihan "Look & Feel" pada menu Cbox-nya.

Mungkin sebenarnya, hampir setiap blogger udah tau tentang ini ya. Tapi gak apa-apa deh, aku tulis ini, mungkin aja ada sobat yang belum paham dan dengan baca tulisanku ini bisa menjadi lebih paham,.