Get Gifs at CodemySpace.com
SELAMAT DATANG DI BLOG RIZAL.......BLOG INI HANYA INGIN BERBAGI ILMU DAN SHARING PENGETAHUAN DAN INFORMASI BERSAMA.........
Tampilkan postingan dengan label Tutorial. Tampilkan semua postingan
Tampilkan postingan dengan label Tutorial. Tampilkan semua postingan

Sabtu, 05 November 2011

Cara Memasang Video Youtube ke Blog Blogspot Semakin Gampang


Cara Memasang Video Youtube ke Blog Blogspot Semakin Gampang. Memasang video youtube ke dalam blog blogspot sangatlah gampang, caranya cukup dengan memasang kode embed video yang telah disediakan oleh pihak youtube ke dalam blog atau postingan blog kita (baca cara membuat postingan). Namun sekarang ada cara yang lebih gampang untuk memasang video-video youtube kesukaan anda, anda cukup search/cari, klik, klik, dan jadi deh. Mau tahu caranya?

Cara dan Langkah mudah memasang video youtube ke dalam blog blogspot


1. Silahkan untuk login ke akun Blogger anda
2. Klik "Entri Baru"
3. Pilih bentuk "Compose"

4. Lalu klik tool "insert a video"


5. Selanjutnya pilihlah menu "From youtube"

6. Maka akan muncul kolom pencarian video youtube, silahkan cari video apa saja yang ingin anda upload ke dalam blog anda dengan cara menggunakan keyword/kata kunci yang anda inginkan dan kliklah "Search Video"/enter (sebagai contoh, saya akan menggunakan kata kunci "Blogger")

7. Selanjutnya pilihlah salah satu di antara video yang muncul dengan cara mengkliknya, lalu kliklah tombol "Select" untuk memulai memasang video ke dalam postingan anda

8. Sekarang video anda telah muncul pada halaman postingan anda. Untuk mengatur posisi di mana video anda berada (di bawah postingan? Di akhir postingan? Di tengah-tengah postingan?) caranya gampang: pertama, bisa dengan cara mengklik posisi di mana letak video anda nantinya (sebelum anda melakukan pemasangan video), lalu bisa dengan cara copy-paste manual seperti halnya anda meng-copy-paste tulisan, dan terakhir bisa anda atur melalui keberadaan kode embed-nya (dan tentu dilakukan ketika ruang postingan dalam bentuk "Edit HTML"/bukan "compose")



9. Jika sobat ingin mengatur ukuran video yang akan ditampilkan, maka bisa dilakukan dengan cara pengeditan postingan dalam bentuk "Edit HTML" (editlah ukuran video youtube anda dengan cara mengatur kisaran angka yang tertera)


11. Selesai!!! Sekarang sobat bisa melihat tampilan video kesukaan anda di blog anda...


Semoga bermanfaat

Tags: Cara gampang memasang video, memasang video youtube cepat, agar video youtube tampil di blog, cara mudah dan cepat embed video

Rabu, 02 November 2011

Cara Membuat Efek Bubble Pada Cursor di Blog

Cara Membuat Efek Bubble Pada Cursor di Blog, Yups... seperti postingan saya tentang cara membuat efek bintang berjatuhan dari kursor, Tapi kali ini tentang Efek Bubble atau bisa disebut dengan gelembung. Tips ini ane dapet dari blog kang fatur Lalu ane ulas lagi disini..



Efek ini secara otomatis akan muncul setelah sobat" menggerak"an kursor sobat. untuk contoh sobat bisa mencobanya pada kotak dibawah ini



Gimana sob???? bagus kan??

Ok deh buat sobat" yang dah kepengen ma ini tips, Langsung aja ke TKP. hehehehe
1.Login ke Blogger 
2.Rancangan --> Elemen Laman --> klik Tambah Gadget --> HTML/Javascript
3.Lalu Copy dan Paste Kode Bubble Kursor Efek di bawah ini di kotak HTML/Javascript

<noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"></script><script type="text/javascript">
// <![CDATA[
var colours=new Array("#F781BE", "#F781BE", "#F781BE", "#F781BE", "#F781BE"); // colours for top, right, bottom and left borders and background of bubbles
var bubbles=100; // maximum number of bubbles on screen

var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var bubb=new Array();
var bubbx=new Array();
var bubby=new Array();
var bubbs=new Array();

window.onload=function() { if (document.getElementById) {
var rats, div;
for (var i=0; i<bubbles; i++) {
rats=createDiv("3px", "3px");
rats.style.visibility="hidden";

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="1px";
div.left="0px";
div.bottom="1px";
div.right="0px";
div.borderLeft="1px solid "+colours[3];
div.borderRight="1px solid "+colours[1];

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="0px";
div.left="1px";
div.right="1px";
div.bottom="0px"
div.borderTop="1px solid "+colours[0];
div.borderBottom="1px solid "+colours[2];

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.left="1px";
div.right="1px";
div.bottom="1px";
div.top="1px";
div.backgroundColor=colours[4];
div.opacity=0.5;
if (document.all) div.filter="alpha(opacity=50)";

document.body.appendChild(rats);
bubb[i]=rats.style;
}
set_scroll();
set_width();
bubble();
}}


function bubble() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<bubbles; c++) if (!bubby[c]) {
bubb[c].left=(bubbx[c]=x)+"px";
bubb[c].top=(bubby[c]=y)+"px";
bubb[c].width="3px";
bubb[c].height="3px"
bubb[c].visibility="visible";
bubbs[c]=3;
break;
}
}
for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
setTimeout("bubble()", 40);
}

function update_bubb(i) {
if (bubby[i]) {
bubby[i]-=bubbs[i]/2+i%2;
bubbx[i]+=(i%5-2)/5;
if (bubby[i]>sdown && bubbx[i]>0) {
if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
bubb[i].width=bubbs[i]+"px";
bubb[i].height=bubbs[i]+"px";
}
bubb[i].top=bubby[i]+"px";
bubb[i].left=bubbx[i]+"px";
}
else {
bubb[i].visibility="hidden";
bubby[i]=0;
return;
}
}
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sleft;
x=(e)?e.pageX:event.x+sdown; }

window.onresize=set_width;
function set_width() {
if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (typeof(self.innerHeight)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
else {
swide=800;
shigh=600;
}
}
window.onscroll=set_scroll;
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
return (div);
}
// ]]>
</script>
NB : 

  • Kode yang berwarna merah adalah warna Bubble silahkan sobat ganti dengan warna kesukaan sobat, untuk bantuan kode warna silahkan klik disini.
  • Kode yang berwarna biru adalah jumlah Bubble yang akan kita pasang. Sobat boleh menggantinya mau seberapa banyak Bubble yang akan di tampilkan
4. Simpan dan coba lihat hasilnya.....

Good Luck ^_^ 

refhttp://rizal-azhar.blogspot.com/ 

Post By Rizal . A
Jangan Asal Copy Paste !!! baca aturannya Disini

Cara Menambahkan Efek Teks pada Cursor Mouse


Yang dimaksud Efek Teks pada Cursor adalah ketika Cursor atau mouse kita gerakkan, maka akan muncul sebuah efek yaitu Cursor yang bergerak diikuti oleh deretan teks. Dan teks tersebut terserah kita, mau di beri tulisan apa saja. Cara buatnya mudah, silahkan anda ikuti langkah berikut bila anda berminat :
1. Login ke blogger dengan ID anda.
2. Klik Rancangan dan pilih Elemen Laman








3. Tambah Gadget



4. Pada jendela baru anda Anda pilih gadget HTML/JavaScript







5. Copy dan paste kode script dibawah ini pada gadget tersebut :
<script language="javascript">


// ENTER TEXT BELOW. CAN *NOT* INCLUDE NORMAL HTML CODE.
var text='Ganti dengan Teks yang anda suka';

var delay=40; // SPEED OF TRAIL
var Xoff=0; // PIXEL COUNT FROM THE LEFT OF THE CURSOR (- VALUES GO TO LEFT)
var Yoff=-30; // PIXEL COUNT FROM THE TOP OF THE CURSOR (- VALUES GO UP)
var txtw=14; // AMOUNT OF PIXEL SPACE EACH CHARACTER OCCUPIES
var beghtml='<font color="#00436e"><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=-1000;
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,-1000);
moveid(txtA[i],0,-1000);
}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>

Catatan :
Silahkan ganti tulisan berwarna merah dengan tulisan atau teks yang anda suka.

6. Simpan.

Selamat mencoba dan lihat hasilnya, semoga bermanfaat....
Jangan lupa luangkan waktu untuk beri komentarmu ya......terima kasi

Cara Pasang Jam & Kalender di Blog

Bagi seorang blogger ada berbagai macam aksesoris yang bisa di tambahkan pada blog nya salah satu widget yang mungkin berguna bagi seorang blogger ialah memasang Jam serta kalender di blognya tersebut, widget jam dan kalender ini selain berfungsi untuk menghiasi blog bisa juga bermanfaat untuk mengingatkan atau menunjukkan waktu serta tanggal kepada anda, yah siapa tau karena asik ngeblog jadinya lupa jika ada acara atau kegiatan yang harus di kerjakan pada waktu atau tanggal tertentu.

Untuk pasang Jam dan kalender di blog caranya sangat mudah anda hanya perlu menambahkan beberapa skrip yang telah siap pakai, untuk menggunakannya anda tinggal menaruh skrip tersebut di posting/artikel atau di widget blog anda.

Bagi yang belum tahu, lebih lengkapnya perhatikan dan ikuti caranya di bawah ini :

Cara Pasang Jam di Blog

  1. Tuju situs http://www.clocklink.com/gallery.php
  2. Setelah anda masuk di situsnya pilih “Gallery” jam yang ada, yang ini saya sarankan sesuaikan gallery jam yang di pilih dengan tema blog anda agar lebih seragam, misalkan blog anda membahas mengenai olah raga maka pilih Sports.
  3. Pilih model jam yang anda inginkan, misalkan jam berbentuk bola lalu klik “View HTML Tag” yang berada tepat pada gambar jam yang di pilih tersebut.
  4. Selanjutnya jika ada keluar halaman persetujuan license, klik saja tombol “Accept” dan akan muncul halaman pengaturan warna, jam serta zise yang di inginkan yang di sertai dengan dua kotak Text box yang berisi scrip kode jam tersebut.
  5. Ambil salah satu kode tersebut, dan pastekan dan save langsung di halaman posting/artikel atau di widget blog anda tergantung di mana anda mau meletakkan jam tersebut.
  6. Selamat, anda sudah mempunyai jam sebagai penunjuk waktu di blog anda, untuk contoh jam seperti beriktu:



Cara Pasang Kalender di Blog
  1. Tuju situs http://www.free-blog-content.com/
  2. Selanjutnya pilih tipe kalender yang anda inginkan pada kolom di bagian bawah, yang terdiri dari“Animated Calendars, Nature Calendars, Car Calendars, Abstract Calendars, Girl Calendars, Plain Calendars, Animal Calendars, Calendar with Clock”
  3. Setelah anda memilih salah satu tipe dan model kalender, anda akan di arahkan ke halaman selanjutnya yang berisi model tampilan kalender serta scrip kode kalender tersebut.
  4. Ambil salah satu kode kalender yang anda sukai kemudian pastekan dan save di halaman posting/artikel atau widget blog anda, tergantung di mana anda mau meletakkannya.
  5. Sekarang di blog anda sudah mempunyai Kalender yang menghiasi blog anda sekaligus mengigatkan tanggal ke pada anda. Contoh tanggal yang saya gunakan seperti berikut:



Sekarang blog anda sudah mempunyai Jam serta Tanggal yang menghiasi blog kesayang sekaligus berfungsi pula untuk mengingatkan waktu dan tanggal kepada anda serta pengunjung blog anda.

Selamat Mencoba.

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Best Web Host