Buat Slide Di Blogmu

Sekarang, kita akan belajar untuk membuat slide show, yaitu foto-foto yang ditampilkan secara bergantian dengan otomatis. Slide show bisa digunakan untuk menampilkan banyak foto tanpa menyita banyak space. Karena foto akan diputar layaknya sebuah video, sehingga lebih menarik dan hemat tempat.

Cara Mudah Membuat Slide Show Foto di Blog
1. Login ke blogger
2. Pilih Tata Letak kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode HTML berikut ini:

<script src='http://yourjavascript.com/53816065231/Database5.js' type='text/javascript'></script><br /> <script type="text/javascript" src="http://yourjavascript.com/65160840132/cycle.js"></script><br /> <script type="text/javascript"> $(document).ready(function() { $('#content-slider').cycle({ fx: 'fade' }); }); </script><br /> <style type="text/css"> #content-slider { position: relative; width: 100%; height: 250px; overflow: hidden; margin:0 auto; } #content-slider img { display: block; width: 100%; height: 250px; } </style><br /> <div id="content-slider"> <img src="URL Foto 1" /><br /> <img src="URL Foto 2" /><br /> <img src="URL Foto 3" /><br /> <img src="URL Foto 4" /><br /> </div>

5. Ganti URL Foto 1 dengan URL foto yang sudah dihost (upload)
6. Kita bisa juga menyesuaikan tinggi foto (height) dan lebarnya.
7. Kita bisa menambahkan atau menampilkan foto lebih banyak lagi dengan menambahkan kode sama seperti <img src="URL Foto 4" /> dan seterusnya.
7. Simpan jika sudah selesai.

Teks Mengikuti Kursor

Login Jangan Lupa Masuk ke Rancangan >> Element Halaman Tambah Gedget >> HTML/JavaScript Masukin Code Berikut :

<script language="javascript"> // ENTER TEXT BELOW. CAN *NOT* INCLUDE NORMAL HTML CODE. var text='Ndorae suka²';//ganti message-nya var delay=40; // SPEED OF TRAIL var Xoff=0; // PIXEL COUNT FROM THE LEFT OF THE CURSOR (- VALUES GO TO LEFT) var Yoff=-15; // PIXEL COUNT FROM THE TOP OF THE CURSOR (- VALUES GO UP) var txtw=20; // AMOUNT OF PIXEL SPACE EACH CHARACTER OCCUPIES var beghtml='<font color="#99ff00"><b>'; // OPTIONAL HTML CODE THAT EFFECTS WHOLE TEXT STRING SUCH AS FONT COLOR, SIZE, ETC. var endhtml='</b></font>'; // END HTML CODE. MOSTLY USED IF ABOVE SETTING IS USED. //********** NO NEED TO EDIT BELOW HERE **********\\ ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false; ie4 = (document.all && !document.getElementById)? true : false; ie5 = (document.all && document.getElementById)? true : false; ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false; var txtA=new Array(); text=text.split(''); var x1=0; var y1=-100; var t=''; for(i=1;i<=text.length;i++){ t+=(ns4)? '<layer left="0" top="-100" width="'+txtw+'" name="txt'+i+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;"> '; t+=beghtml+text[i-1]+endhtml; t+=(ns4)? '</layer>' : '</div> '; } document.write(t); function moveid(id,x,y){ if(ns4)id.moveTo(x,y); else{ id.style.left=x+'px'; id.style.top=y+'px'; }} function animate(evt){ x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX); y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY); } function getidleft(id){ if(ns4)return id.left; else return parseInt(id.style.left); } function getidtop(id){ if(ns4)return id.top; else return parseInt(id.style.top); } function getwindowwidth(){ if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft; else return window.innerWidth+pageXOffset; } function movetxts(){ for(i=text.length;i>1;i=i-1){ if(getidleft(txtA[i-1])+txtw*2>=getwindowwidth()){ moveid(txtA[i-1],0,-100); moveid(txtA[i],0,-100); }else moveid(txtA[i], getidleft(txtA[i-1])+txtw, getidtop(txtA[i-1])); } moveid(txtA[1],x1,y1); } window.onload=function(){ for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?document.all['txt'+i]:document.getElementById('txt'+i); if(ns4)document.captureEvents(Event.MOUSEMOVE); document.onmousemove=animate; setInterval('movetxts()',delay); } </script>

  Simpan dan lihat hasilnya,..

Membuat Pesan Pembuka

Tips dari Blog Tips and Trick kali ini yaitu tentang bagaimana caranya untuk membuat pesan pembuka kepada pengunjung blog anda, ditambah lagi pada pesan pembuka tersebut anda bisa meminta kepada pengunjung blog anda untuk memasukan namanya terlebih dulu sebelum mereka menjelajahi blog anda.seperti contoh pada gambar berikut ini :

Untuk anda yang berminat membuat pesan sapaan seperti pada contoh gambar di atas, caranya yaitu
sebagai berikut. anda login ke blogger lalu klik menu tata letak halaman kemudian anda tambah gadget baru dengan mengklik add a gadget, terus anda pilih gadget Html/java script. setelah itu anda copy dan paste semua kode dibawah ini pada gadget Html/java script tersebut.kodenya adalah :

<script type='text/javascript'> var name = prompt("Greeting", "may I know your name "); alert("wellcome to My Blog "+name) alert("Thank You for Visiting My Blog") </script><br />

Setelah itu anda klik simpan atau save, selesai dech. buka blog anda untuk melihat hasilnya.

Catatan : Teks yang saya beri warna biru di atas silahkan anda ganti sesuai dengan keinginan anda, misalnya pada greeting anda ganti menjadi selamat datang dan yang lainnya juga.

ok cukup sekian dulu postingan Blog Tips and Trick kali ini, semoga bermanfaat dan salam blogger mania.

Membuat Adresbar Keren

Bagaimana cara membuat judul addressbar menjadi tambah keren langsung aja di simak dan tidak usah panjang lebar lagsung aja . .
langkah yang pertama anda harus login terlebih dahulu pastinya

2. masuk ke tata leta (layout) edit HTML
3. cari code (head)tanpa tanda kurung, kalo udah ketemu copy code berikut dan letakan di atasnya

<br /> <script type="text/javascript"> //<![CDATA[ function tb9_makeArray(n){ this.length = n; return this.length; } tb9_messages = new tb9_makeArray(1); tb9_messages[0] = "++ [[> Dhedy - Blog <]] ++ [[> SMK <]] ++ [[> Muhammadiyah 01 <]] ++"; tb9_rptType = 'infinite'; tb9_rptNbr = 5; tb9_speed = 100; tb9_delay = 2000; var tb9_counter=1; var tb9_currMsg=0; var tb9_timerID = null var tb9_bannerRunning = false var tb9_state = "" tb9_clearState() function tb9_stopBanner() { if (tb9_bannerRunning) clearTimeout(tb9_timerID) tb9_timerRunning = false } function tb9_startBanner() { tb9_stopBanner() tb9_showBanner() } function tb9_clearState() { tb9_state = "" for (var i = 0; i < tb9_messages[tb9_currMsg].length; ++i) { tb9_state += "0" } } function tb9_showBanner() { if (tb9_getString()) { tb9_currMsg++ if (tb9_messages.length <= tb9_currMsg) { if ((tb9_rptType == 'finite') && (tb9_counter==tb9_rptNbr)){ tb9_stopBanner(); return; } tb9_counter++; tb9_currMsg=0; } tb9_clearState() tb9_timerID = setTimeout("tb9_showBanner()", tb9_delay) } else { var tb9_str = "" for (var j = 0; j < tb9_state.length; ++j) { tb9_str += (tb9_state.charAt(j) == "1") ? tb9_messages[tb9_currMsg].charAt(j) : "____" } document.title = tb9_str tb9_timerID = setTimeout("tb9_showBanner()", tb9_speed) } } function tb9_getString() { var full = true for (var j = 0; j < tb9_state.length; ++j) { if (tb9_state.charAt(j) == 0) full = false } if (full) return true while (1) { var num = tb9_getRandom(tb9_messages[tb9_currMsg].length) if (tb9_state.charAt(num) == "0") break } tb9_state = tb9_state.substring(0, num) + "1" + tb9_state.substring(num + 1, tb9_state.length) return false } function tb9_getRandom(max) { var now = new Date() var num = now.getTime() * now.getSeconds() * Math.random() return num % max } tb9_startBanner() //]]> </script>

Simpan dan lihat hasilnya, selamat berbloging ria,....

Menganti Icon di Adres Bar

1. Yang pertama kalian kudu Log-in dengan Id kalian masing-masing.

2. Lalu “Rancangan/Tataletak” kemudian “Edit HTML”

3. Setelah itu “Download Template Lengkap”

* Namanya juga manusia kadang bisa aja keliru, wlw hal sepele kadang bisa menjadi masalah besar.

4. Centang (V) “Expand Template Widget”

5. Kemudian cari kode (/head" )tanpa tanda kurung

* Untuk lebih mudahnya tekan CTRL + f

6. Dan copy paste kode dibawah ini tepat diatas (/head)

<link href='http://i1185.photobucket.com/albums/z342/ndorae/BINTANG/xmas.gif' rel='SHORTCUT ICON'/>

7. Lalu “Simpan Template” dan liat hasilnya,...