Cara Memasang Widget "Emoticon" Dan Menampilkannya Secara Otomatis Di Blog

Sekedar untuk fun dan supaya blog jadi lebih menarik. Saya kali ini mencoba ekseperimen buat program sederhana khusus untuk Menampilkan/Memasang Emoticon Otomatis Di Blog. Bagi sobat blogger yang berminat ingin memasangnya silahkan boleh gunakan & tambahkan ke blog sobat blogger.

Cara menambahkan feature emoticon di blog pada artikel ini berbeda dan lebih mudah dibandingkan dengan tutorial lainnya. Kita tidak perlu melakukan edit script HTML.
Selain karena sulit untuk pengguna awam yang tidak paham HTML. Mengedit script HTML di blog itu ya harus hati-hati. Karena jika kita salah edit atau copy-paste bisa ERROR blog kita.

Cara Menggunakannya :

Waktu kita membuat posting artikel/menulis komentar cukup ketik karakter emoticon-nya.

Tetapi tentu saja setelah sobat blogger memasang widget Ini. Tunggu sebentar, kemudian karakter emoticon-nya akan tampil secara "Otomatis". Sudah itu saja, Gampang kan?

Daftar Emoticon :
Emoticon yang digunakan sebagian besar adalah emoticon Yahoo Messenger (langsung dari server Yahoo). Sedangkan untuk cara penulisan karakternya sudah saya coba samakan dengan Standard Penulisan Emoticon BlackBerry.

Berikut adalah beberapa contoh "Emoticon" yang tersedia di versi ini :

:)   ;)   :D   =D   =))   ({})   \:D/   <:-P   :P   <3<3   :*   :|   >:/   :&   :(   :'(   >:O   #:-s   :O   X_X   O:)   >=)   B-)   =-c   ~o)   @};-   (y)   (n)   <3   </3   \m/   (*)

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.

2. Klik Tambah Gadget.

3. Pilih Gadget HTML/Javascript.

4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

<script language="javascript">
(function(){var s=document.createElement('script');s.async=true;s.type="text/javascript";s.src='https://sites.google.com/site/tutorialblogeno/javascript/cara-memasang-widget-emoticon-dan-menampilkannya-secara-otomatis-di-blog.js';var h=document.getElementsByTagName('script')[0];h.parentNode.insertBefore(s,h);})();
</script>
<a href="http://tutorial-blog-eno.blogspot.com/2014/12/cara-memasang-widget-emoticon-dan-menampilkannya-secara-otomatis-di-blog.html" target="_blank" title="Cara Memasang Widget &quot;Emoticon&quot; Dan Menampilkannya Secara Otomatis Di Blog"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmymuoc_kb-1X4JQZhak7EQ9SbFMmQGxHLBpe1g_aK0PZqKqeyOrI6nNX08mBB-y7a5cET255eQIZ_HJuYHoDhNAi0ImZfHfhBYjGpZaknmxQYVC9D67CHIa4xadCRQ_LOwhagnSaEPm0/s1600/Cara+Memasang+Widget+Emoticon+Dan+Menampilkannya+Secara+Otomatis+Di+Blog.gif" width="117" height="27" /></a>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.
• width='117' adalah ukuran lebar, silahkan kamu ganti dengan selera yang kamu mau.
• height='27' adalah ukuran tinggi, silahkan kamu ganti dengan selera yang kamu mau.

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████

Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Memasang Burung Twitter Terbang Melayang Di Blog

» Di sini saya akan menuliskan 2 Versi, kamu tinggal pilih Versi yang mana yang kamu inginkan.

Versi Pertama Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).
5. Simpan Pengaturan.

Versi Kedua Melalui Edit HTML :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

Ingat : Sebelum kamu mengedit HTML, sebaiknya BACKUP dulu template blog kamu.

1. Klik Template.

2. Klik Edit HTML.

3. Klik Di Dalam Kotak Template Kamu.

4. Cari Kode (agar lebih mudah mencari kode di kotak template kamu, gunakan tombol ctrl+f  » jika berhasil maka akan terlihat Di Dalam Kotak Template Kamu).

» Cari kode : </body>
» Setelah kode tersebut sudah ditemukan, silahkan pasang kode di bawah ini tepat di atasnya.

5. Sebelum Kamu Klik Simpan Template, sebaiknya kamu klik Pratinjau Template terlebih dahulu untuk memeriksanya.
6. Jika Sudah Oke » Klik Simpan Template.

█████████████████████████████████████████████████████████████████

Ini Dia "Kode" Tersebut :

<!-- Star floating twitter Bird -->
<script type="text/javascript" src="https://sites.google.com/site/tutorialblogeno/javascript/cara-memasang-burung-twitter-terbang-melayang-di-blog.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6zhx44d7vQ0YD5Wn72qmAH_X_kg-_sWNffgToxtMsXvC93oaGs0PSc7rxB-y91pJE76B9dvvoRkhWkD0BrH7gwMgdOyt8_C4fYtySvZj3c_VWj88IzJQwpUm8iaJF5OLJIURLwNKsrkI/s1600/Cara+Memasang+Burung+Twitter+Terbang+Melayang+Di+Blog.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 = "https://twitter.com/#!/EnoSutrisno1990";
var tweetThisText = "Twitter - UserID http://tutorial-blog-eno.blogspot.com/";
tripleflapInit();
</script>
<!-- End floating twitter Bird -->
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/11/cara-memasang-burung-twitter-terbang-melayang-di-blog.html" target="_blank">Cara Memasang Burung Twitter Terbang Melayang Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.
• Warna fuchsia adalah URL gambar, silahkan kamu ganti dengan selera yang kamu mau.
• Silahkan kamu ganti EnoSutrisno1990 dengan profil twitter kamu sendiri.
• Berikut contoh URL twitter "Lengkap" saya : https://twitter.com/EnoSutrisno1990, maka ID profil saya adalah EnoSutrisno1990.
• Silahkan kamu ganti http://tutorial-blog-eno.blogspot.com/ dengan URL blog kamu sendiri.

Rekomendasi Untuk Kamu :

• Kumpulan Gambar Burung Twitter

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Membuat Recommended Posts Slide Out Di Blog

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

<style type='text/css'>
#bpslidein{z-index:5;width:400px;height:100px;padding:10px;background-color:#3eb5da;border-top:3px  solid #00ff00;position:fixed;right:-430px;bottom:0;-moz-box-shadow:-2px 0 5px #00ff00;-webkit-box-shadow:-2px 0 5px #00ff00;box-shadow:-2px 0 5px #00ff00;font-family:Arial, Helvetica, sans-serif;}
#bpslidein p{font-size:11px;text-transform:uppercase;font-family:Arial,Helvetica,sans-serif;letter-spacing:1px;color:#555;}
#bpslidein_title{color:#555;font-weight:700;font-size:16px;margin:10px 20px 10px 0;}
#bpslidein a,#bpslidein a:hover,#bpslidein_title{text-decoration:none;color:#ff0000;}
#bpslidein .close,#bpslidein .expand,#bpslidein .help{border:2px solid #00ff00;cursor:pointer;color:#ff0000;width:13px;height:15px;padding:2px 0 0 5px;position:absolute;right:10px;font-size:17px;font-weight:700;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
#bpslidein .help{right:35px;}
#bpslidein_title,#bpslidein_image{float:left;width:80px;}
#bpslidein_title{width:290px;}
</style>
<div id="bpslidein" style="display:none;"> <div class="help">?</div><div class="expand">+</div> <div class="close">X</div> <p>Direkomendasikan Untuk Kamu :</p> <div id="bpslidein_image"></div> <div  id="bpslidein_title">Loading, please wait...</div> </div> <script> if(document.location.href.split("/").length==6&&document.location.href.indexOf(".html")!=-1){if(typeof bp_onload_queue=='undefined')var bp_onload_queue=[];if(typeof bp_dom_loaded=='boolean')bp_dom_loaded=false;else var bp_dom_loaded=false;if(typeof bp_async_loader!='function'){function bp_async_loader(src,callback,id){var script=document.createElement('script');script.type="text/javascript";script.async=true;script.src=src;script.id=id;var previous_script=document.getElementById(id);if(previous_script)if(previous_script.readyState=="loaded"||previous_script.readyState=="complete"){callback();return}else{script=previous_script}if(script.onload!=null)previous_callback=script.onload;script.onload=script.onreadystatechange=function(){var newcallback;if(previous_script&&previous_callback)newcallback=function(){previous_callback();callback()};else newcallback=callback;if(bp_dom_loaded){newcallback()}else bp_onload_queue.push(newcallback);script.onload=null;script.onreadystatechange=null};var head=document.getElementsByTagName('head')[0];if(!previous_script)head.appendChild(script)}}if(typeof bp_domLoaded!='function')function bp_domLoaded(callback){bp_dom_loaded=true;var len=bp_onload_queue.length;for(var i=0;i<len;i++){bp_onload_queue[i]()}}bp_domLoaded();bp_async_loader("https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-recommended-posts-slide-out-di-blog-bagian-1.js",function(){bp_async_loader("https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-recommended-posts-slide-out-di-blog-bagian-2.js",function(){},"bp-out-slide")},"jQueryjs")} </script> <a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-recommended-posts-slide-out-di-blog.html" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ0mB92g0TH8ZCEEJaHKm3YR5GlDqjEqP09vE2mc2mMX6YgmdP1tDrwvXbVAgkTXwOQA8e3XkI9yPKxdu9_Z_Yq-PhHOHXO4wNALLX8QNFbhGvr14eGLT7AxnwGNUM-z1SFWZkpPG1PC4/I/bloggerplugins.png" alt="Cara Membuat Recommended Posts Slide Out Di Blog" /></a>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-recommended-posts-slide-out-di-blog.html" target="_blank">Cara Membuat Recommended Posts Slide Out Di Blog</a></small>

Keterangan :

• Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
• Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini
• Warna red adalah teks, silahkan kamu ganti dengan selera yang kamu mau.
• Warna orange adalah link kode "JavaScript" blog.

Catatan:

• Recommended Posts Slide Out ini akan muncul setelah pengunjung masuk ke sebuah "Artikel" blog kamu, dan menggulir sampai kebawah/akhir blog kamu (Footer Blog).

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

?

+

X

Direkomendasikan Untuk Kamu :

Loading, please wait...

[Baca Selengkapnya]

Cara Membuat Efek Gelembung Pada Kursor Di Blog

» Di sini saya akan menuliskan 2 Versi, kamu tinggal pilih Versi yang mana yang kamu inginkan.

Versi Pertama Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).
5. Simpan Pengaturan.

Versi Kedua Melalui Edit HTML :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

Ingat : Sebelum kamu mengedit HTML, sebaiknya BACKUP dulu template blog kamu.

1. Klik Template.

2. Klik Edit HTML.

3. Klik Di Dalam Kotak Template Kamu.

4. Cari Kode (agar lebih mudah mencari kode di kotak template kamu, gunakan tombol ctrl+f  » jika berhasil maka akan terlihat Di Dalam Kotak Template Kamu).

» Cari kode : </head>
» Setelah kode tersebut sudah ditemukan, silahkan pasang kode di bawah ini tepat di atasnya.

5. Sebelum Kamu Klik Simpan Template, sebaiknya kamu klik Pratinjau Template terlebih dahulu untuk memeriksanya.
6. Jika Sudah Oke » Klik Simpan Template.

█████████████████████████████████████████████████████████████████

Ini Dia "Kode" Tersebut :

<script type="text/javascript" src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-gelembung-pada-kursor-di-blog.js"></script><script type="text/javascript">
// <![CDATA[
var colours=new Array("#ff0000", "#ff0000", "#ff0000", "#ff0000", "#ff0000"); // 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>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-gelembung-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Gelembung Pada Kursor Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.
• Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
• Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini
• var bubbles=100; adalah jumlah maksimal gelembung yang akan keluar, silahkan kamu ganti dengan selera yang kamu mau.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Membuat Tulisan Mengikuti Kursor Di Blog

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

<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, arial;
color: #ff0000;

/* 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'>
//<![CDATA[
/**/
;(function(){
// Your message here (QUOTED STRING)
var msg = "T-U-T-O-R-I-A-L - B-L-O-G - E-N-O";

/* 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 = 24;
// 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>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-tulisan-mengikuti-kursor-di-blog.html" target="_blank">Cara Membuat Tulisan Mengikuti Kursor Di Blog</a></small>

Keterangan :

• Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
• Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini
• Warna red adalah teks, silahkan kamu ganti dengan selera yang kamu mau.

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Membuat Efek Hati Bertaburan Pada Kursor Di Blog

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

<script type='text/javascript'>
// <![CDATA[
var colour="#ffc0cb";
var sparkles=40;
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(5, 5);
var rdow=createDiv(5, 5);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="2px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="2px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*5;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
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;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"49px";
div.style.width=width+"50px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-hati-bertaburan-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Hati Bertaburan Pada Kursor Di Blog</a></small>

Keterangan :

• Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
• Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Membuat Efek Bintang Bertaburan Pada Kursor Di Blog

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

Ingat :
Kamu cukup pilih salah satu kode di bawah ini.

» Bintang Warna Merah :

<script
src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog-bintang-warna-merah.js" type="text/javascript"></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Bintang Bertaburan Pada Kursor Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.

» Bintang Warna Kuning :

<script
src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog-bintang-warna-kuning.js" type="text/javascript"></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Bintang Bertaburan Pada Kursor Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.

» Bintang Warna Hijau :

<script
src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog-bintang-warna-hijau.js" type="text/javascript"></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Bintang Bertaburan Pada Kursor Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.

» Bintang Warna Biru :

<script
src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog-bintang-warna-biru.js" type="text/javascript"></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Bintang Bertaburan Pada Kursor Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.

» Bintang Warna Ungu :

<script
src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog-bintang-warna-ungu.js" type="text/javascript"></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Bintang Bertaburan Pada Kursor Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.

» Bintang Warna Perak :

<script
src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog-bintang-warna-perak.js" type="text/javascript"></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Bintang Bertaburan Pada Kursor Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.

» Bintang Warna Hitam :

<script
src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog-bintang-warna-hitam.js" type="text/javascript"></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-bintang-bertaburan-pada-kursor-di-blog.html" target="_blank">Cara Membuat Efek Bintang Bertaburan Pada Kursor Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Memasang Script Anti Klik Kanan Dengan Gambar Di Blog

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

Ingat :
Kamu cukup pilih salah satu kode di bawah ini.

» Full Screen Animation :

<script type="text/javascript">
var DADrccolor = '#ffffff';
var DADrcimage = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSaM8IF3rDUSrEiPdFQzdEKNTnswORu5O10abeB6OH6rqS14mF9K14sIzaw5H8YCLvTL4n4REqRtqA24-hUT2TmyCdNdaDRtCwi5R6DuAdCtqiHwdkpRAR95CFrVzEC6E6aPn8kq3OwXk/s1600/Cara+Memasang+Script+Anti+Klik+Kanan+Dengan+Gambar+Di+Blog.png';
</script>
<script type="text/javascript" src="https://sites.google.com/site/tutorialblogeno/javascript/cara-memasang-script-anti-klik-kanan-dengan-gambar-di-blog-full-screen-animation.js"> </script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-memasang-script-anti-klik-kanan-dengan-gambar-di-blog.html" target="_blank">Cara Memasang Script Anti Klik Kanan Dengan Gambar Di Blog</a></small>

Keterangan :

• Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
• Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini
• Tulisan warna fuchsia adalah URL gambar, silahkan kamu ganti dengan selera yang kamu mau.
• Warna orange adalah link kode "JavaScript" blog.

» Horizontal Animation :

<script type="text/javascript">
var DADrccolor = '#ffffff';
var DADrcimage = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSaM8IF3rDUSrEiPdFQzdEKNTnswORu5O10abeB6OH6rqS14mF9K14sIzaw5H8YCLvTL4n4REqRtqA24-hUT2TmyCdNdaDRtCwi5R6DuAdCtqiHwdkpRAR95CFrVzEC6E6aPn8kq3OwXk/s1600/Cara+Memasang+Script+Anti+Klik+Kanan+Dengan+Gambar+Di+Blog.png';
</script>
<script type="text/javascript" src="https://sites.google.com/site/tutorialblogeno/javascript/cara-memasang-script-anti-klik-kanan-dengan-gambar-di-blog-horizontal-animation.js"> </script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-memasang-script-anti-klik-kanan-dengan-gambar-di-blog.html" target="_blank">Cara Memasang Script Anti Klik Kanan Dengan Gambar Di Blog</a></small>

Keterangan :

• Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
• Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini
• Tulisan warna fuchsia adalah URL gambar, silahkan kamu ganti dengan selera yang kamu mau.
• Warna orange adalah link kode "JavaScript" blog. 

» Vertical Animation :

<script type="text/javascript">
var DADrccolor = '#ffffff';
var DADrcimage = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSaM8IF3rDUSrEiPdFQzdEKNTnswORu5O10abeB6OH6rqS14mF9K14sIzaw5H8YCLvTL4n4REqRtqA24-hUT2TmyCdNdaDRtCwi5R6DuAdCtqiHwdkpRAR95CFrVzEC6E6aPn8kq3OwXk/s1600/Cara+Memasang+Script+Anti+Klik+Kanan+Dengan+Gambar+Di+Blog.png';
</script>
<script type="text/javascript" src="https://sites.google.com/site/tutorialblogeno/javascript/cara-memasang-script-anti-klik-kanan-dengan-gambar-di-blog-vertical-animation.js"> </script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-memasang-script-anti-klik-kanan-dengan-gambar-di-blog.html" target="_blank">Cara Memasang Script Anti Klik Kanan Dengan Gambar Di Blog</a></small>

Keterangan :

• Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
• Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini
• Tulisan warna fuchsia adalah URL gambar, silahkan kamu ganti dengan selera yang kamu mau.
• Warna orange adalah link kode "JavaScript" blog.  

5. Simpan Pengaturan.

Rekomendasi Untuk Kamu :

• Kumpulan Gambar Anti Klik Gambar

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Membuat Energy Saving Mode Di Blog

Sebelum saya menuliskan Cara Membuat Energy Saving Mode Di Blog, mungkin ada sebagian blogger yang belum tahu apa sih energy saving mode itu.

Saya akan coba jelaskan sedikit apa itu energy saving mode yang saya maksud di sini.

Energy Ssving mode yang saya maksud di sini adalah sebuah script yang yang akan membuat sebuah web/blog menjadi gelap (saving mode) apabila blog tidak melakukan aktivitas. maksudnya apabila pengunjung web/blog tersebut tidak melakukan aktivitas apa pun, termasuk tidak menggerakkan kursor.

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

<script src='http://www.onlineleaf.com/savetheenvironment.js' type='text/javascript'/></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-energy-saving-mode-di-blog.html" target="_blank">Cara Membuat Energy Saving Mode Di Blog</a></small>

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Membuat Efek Daun Berjatuhan Di Blog

» Di sini saya akan menuliskan 2 Versi, kamu tinggal pilih Versi yang mana yang kamu inginkan.

Versi Pertama Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).
5. Simpan Pengaturan.

Versi Kedua Melalui Edit HTML :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

Ingat : Sebelum kamu mengedit HTML, sebaiknya BACKUP dulu template blog kamu.

1. Klik Template.
2. Klik Edit HTML.
3. Klik Di Dalam Kotak Template Kamu.

4. Cari Kode (agar lebih mudah mencari kode di kotak template kamu, gunakan tombol ctrl+f  » jika berhasil maka akan terlihat Di Dalam Kotak Template Kamu).

» Cari kode : </head> atau kode : </body>
» Setelah kode tersebut sudah ditemukan, silahkan pasang kode di bawah ini tepat di atasnya.

5. Sebelum Kamu Klik Simpan Template, sebaiknya kamu klik Pratinjau Template terlebih dahulu untuk memeriksanya.
6. Jika Sudah Oke » Klik Simpan Template.

█████████████████████████████████████████████████████████████████

Ini Dia "Kode" Tersebut :

<script src='https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-daun-berjatuhan-di-blog.js'/></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-daun-berjatuhan-di-blog.html" target="_blank">Cara Membuat Efek Daun Berjatuhan Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode JavaScript blog.

Catatan :

• Letakkan Efek Daun Berjatuhan ini di tempat yang sesuai : biasanya paling atas di "Tata Letak" blog kamu.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Membuat Efek Salju Berjatuhan Di Blog

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

Ingat :
Kamu cukup pilih salah satu kode di bawah ini.

» Efek Salju Berjatuhan :

<script type="text/javascript" src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-salju-berjatuhan-di-blog.js" /></script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-salju-berjatuhan-di-blog.html" target="_blank">Cara Membuat Efek Salju Berjatuhan Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.

Catatan :

• Karena salju itu warnanya putih maka efek salju berjatuhan di atas juga warnanya adalah putih, dan ini hanya cocok untuk blog yang menggunakan template dengan warna gelap seperti Hitam (Pokoknya yang bisa menampilkan efek salju yang berwarna putih).

Jika blog kamu menggunakan template dengan warna terang seperti Putih, maka kode efek salju berjatuhan yang harus digunakan adalah kode Efek Salju Berjatuhan Alternatif, silahkan gunakan kode di bawah ini.

» Efek Salju Berjatuhan Alternatif :

<script type="text/javascript" src="https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-efek-salju-berjatuhan-di-blog.js" /></script>
<script type="text/javascript">
snowStorm.snowColor = '#ff0000';

snowStorm.flakesMaxActive = 96;
snowStorm.useTwinkleEffect = true;
</script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-efek-salju-berjatuhan-di-blog.html" target="_blank">Cara Membuat Efek Salju Berjatuhan Di Blog</a></small>

Keterangan :

• Warna orange adalah link kode "JavaScript" blog.
• Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
• Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]

Cara Membuat Widget Pemakai Online Di Blog

Kali ini saya akan membikin artikel tentang Cara Membuat Widget Pemakai Online Di Blog. tujuannya adalah supaya kita tahu berapa pengunjung yang sedang online di blog kita.

Di bawah ini ada 2 situs penyedia Cara Membuat Widget Pemakai Online Di Blog.

1. whos.amung.us :

• Pergi ke situs whos.amung.us : Klik Di Sini
• Setelah kamu masuk ke situs whos.amung.us, pilihlah jenis widget yang kamu suka.
• Copy kode yang telah disediakan.
• Selanjutkan masukkan kode script (html) "whos.amung.us" kamu ke blog.

2. radarurl.com :

• Pergi ke situs radarurl.com : Klik Di Sini
• Setelah kamu masuk ke situs radarurl.com, pilihlah jenis widget yang kamu suka, lihat situsnya ada : Step 1 (posisi widget), Step 2 (kode widget), Step 3 (hasil tampilan, apabila kamu sudah memilih di Step 1).
• Copy script yang telah disediakan (di kotak Step 2).
• Selanjutkan masukkan kode script (html) "radarurl.com" kamu ke blog.
• Atau kamu juga bisa pilih Online Widget Simulation : masukkan URL web/blog kamu, kemudian ENTER deh.

...

» Atau kamu tidak mau capek pergi ke situsnya? nih Tutorial Blog Eno akan kasih kamu kode scriptnya, kamu tinggal copy n' paste saja ke blog kamu.

...

Lanjut...

Melalui HTML/JavaScript :

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

Ingat :
Kamu cukup pilih salah satu kode di bawah ini.

» whos.amung.us The tab widget. (Melayang Di Bawah-Tengah Blog) :

<script id="_wau2tt">var _wau = _wau || [];
_wau.push(["tab", "0dc3z679g6yp", "2tt", "bottom-left"]);
(function() {var s=document.createElement("script"); s.async=true;
s.src="http://widgets.amung.us/tab.js";
document.getElementsByTagName("head")[0].appendChild(s);
})();</script>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-widget-pemakai-online-di-blog.html" target="_blank">Cara Membuat Widget Pemakai Online Di Blog</a></small>

Keterangan :

• bottom-center adalah letak posisi, silahkan kamu ganti dengan selera yang kamu mau.
• left-upper (Kiri-Atas), left-middle (Kiri-Tengah), left-lower (Kiri-Bawah).
• bottom-left (Bawah-Kiri), bottom-center (Bawah-Tengah), bottom-right (Bawah-Kanan).
• right-upper (Kanan-Atas), right-middle (Kanan-Tengah), right-lower (Kanan-Bawah).

» radarurl (Melayang Di Bawah-Tengah Blog) :

<script type="text/javascript" src="http://radarurl.com/js/radarurl_widget.js"></script><script type="text/javascript">radarurl_call_radar_widgetv2({edition:"Dynamic",location:"bottomcenter"})</script><noscript><a href="http://radarurl.com/">RadarURL</a></noscript>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-widget-pemakai-online-di-blog.html" target="_blank">Cara Membuat Widget Pemakai Online Di Blog</a></small>

Keterangan :

• bottomcenter adalah letak posisi, silahkan kamu ganti dengan selera yang kamu mau.
• lefttop (Kiri-Atas), leftcenter (Kiri-Tengah), leftbottom (Kiri-Bawah).
• bottomleft (Bawah-Kiri), bottomcenter (Bawah-Tengah), bottomright (Bawah-Kanan).
• righttop (Kanan-Atas), rightcenter (Kanan-Tengah), rightbottom (Kanan-Bawah).

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.

█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno

» Efek Artikel Blog

[Baca Selengkapnya]