Zombi Berjalan Pada Blog

Cara Membuat Zombie Berjalan Di Blog - Blogger semakin banyak dukungan penuh untuk mendapatkan pernak-pernik ataupun widget untuk menambah kesan menarik, keren ataupun bagus agar blog anda terlihat sedemikian menariknya, tapi ingat gunakan widget yang anda butuhkan agar tidak terlalu berat blog anda saat dibuka.

Nah kali ini saya mau share gimana agar zombie berjalan pada blog kita.
Langkahnya :
1. Login akun blogger anda.
2. Klik Template » Edit HTML » Lanjutkan » Centang  Expand Template Widget

3. Cari kode </body>, lalu pastekan kode zombie dibawah ini yang kalian suka diatas kode yang telah dicari tadi.

Zombie 1

<marquee direction='right' scrolldelay='160' style='position:fixed; bottom:10px; left:0; width:100%;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjD4mwSKK9h1JN7xfjq5GQfw6H6ZRGYymWPHOKILXKIT6eED30RabiaaXpc-qQdK5Hyhxa4oNw3XxLrmM2vRYnugICKtCLmqlRgjKP92uThVey3zbb66OJkzyk_M7E1LblmDYCrbth2_MQ/s120/zombie-1.gif' tyle="border:0; background:none; padding:0; box-shadow: none;"/></marquee>

Zombie 2

<marquee direction='right' scrolldelay='160' style='position:fixed; bottom:10px; left:0; width:100%;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqZEjhWPzKz-aZMHYvgv7QNu5bTxTVlbrSdJ9Sh6EyrmFtmzct1Lbkpbyz_Ej8dpBRhlUp4b-G3MyBVfw26Nt6faCFXEvXkcE10jf7LE0a0SNpJ6MXRPni9kBPM8BD-LKuMD5FmItgerg/s100/zombie-2.gif' style='border:0; background:none; padding:0; box-shadow: none; width:80px;'/></marquee>

Zombie 3

<marquee direction='right' scrolldelay='160' style='position:fixed; bottom:10px; left:0; width:100%;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcwG3dqBSvPuPyrFmS_m88vXqSztOkGb7MRJL7m8lvlF59C0kY8XZjj8kVBj16CvrRaZSy2_3owhcv96AUjvRterZmeUV6Z4aagbAm4vvrU7btB-R2_Zxtv_ENUlJDAwb6L3fXiWVYHcY/s117/zombie-3.gif' style='border:0; background:none; padding:0; box-shadow: none;'/></marquee>

Zombie 4

<marquee direction='right' scrolldelay='160' style='position:fixed; bottom:10px; left:0; width:100%;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwQIT4ULJWZJQQJzxYU1s4OhF0kKbZcO3vISthhw2UUmGv3rgVZIAllR25ThesxL4mQCRy5pMQlp9suTotCfWVqhrONc8dQzWW_C1Jq1JaSM8Cpmxjx76Qsimdxg5IpJSW1n1TlCu0ThE/s138/zombie-4.gif' style='border:0; background:none; padding:0; box-shadow: none; width:80px;'/></marquee>

Zombie 5

<marquee direction='right' scrolldelay='260' style='position:fixed; bottom:10px; left:0; width:100%;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbUg-y4PKpnmvr_B5aFzXyyMgQ6PFkaKI41-gDEDKnr8paPIBtRVAQD1VhxMpmjZLsLdef-Lu6-PiYydlwjxkhvcafx4DITUmuoeuO26VsQ8PqDE9Lk9M5evVG1pO2M94uhRGA6cTmZGQ/s148/zombie-5.gif' style='border:0; background:none; padding:0; box-shadow: none; width:70px;'/></marquee>

Keterangan :
direction='right' : untuk arah zombie berjalan dari kiri ke kanan.
scrolldelay='260' : kecepatan berjalan zombie
bottom:10px; left:0; width:100%; : letak zombie pada layar monitor

Description: Zombi Berjalan Pada Blog Rating: 4.5 Reviewer: Unknown - ItemReviewed: Zombi Berjalan Pada Blog

Animasi Kusor 3 Warna

Cara Membuat Kursor Blog Di Kelilingi Tiga Bintang Berekor , Sambil Mencari informasi dan sedikit waktu untuk membuka blog oktri ingin berbagi tutorial blog yang Mungkin sobat udah pada tahu tentang artiukel ini ,Cara membuat kursor Blog di kelilingi 3 bintang warna wani berekor, tapi Mazz Puji ingin berbagi dengan yang belum tau, kali aja ingin menghiasi tampilan kursor pada blognya, bagi yang ingin mencobanya silahkan ikuti tutorial berikut ini.

- Langkah pertama login ke blog sobat

- Kedua masuk dashboar>>tata letak >> Add gadget >> pilih HTML/javascript

- Copy paste code script di bawah ini

<script language="JavaScript" type="text/javascript">
var xCol = "#FF0000";
var yCol = "#FFFF00";
var zCol = "#0000FF";
var n = 6; //number of dots per trail.
var t = 40; //setTimeout speed.
var s = 0.2; //effect speed.
var r,h,w;
var d = document;
var my = 10;
var mx = 10;
var stp = 0;
var evn = 360/3;
var vx = new Array();
var vy = new Array();
var vz = new Array();
var dy = new Array();
var dx = new Array();
var pix = "px";
var strictmod = ((document.compatMode) &&
document.compatMode.indexOf("CSS") != -1);
var domWw = (typeof window.innerWidth == "number");
var domSy = (typeof window.pageYOffset == "number");
var idx = d.getElementsByTagName('div').length;
for (i = 0; i < n; i++)
{
var dims = (i+1)/2;
d.write('<div id="x'+(idx+i)+'" style="position:absolute;'
+'top:0px;left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+xCol+';font-size:'+dims+'px"></div>'
+'<div id="y'+(idx+i)+'" style="position:absolute;top:0px;'
+'left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+yCol+';font-size:'+dims+'px"></div>'
+'<div id="z'+(idx+i)+'" style="position:absolute;top:0px;'
+'left:0px;width:'+dims+'px;height:'+dims+'px;'
+'background-color:'+zCol+';font-size:'+dims+'px"></div>');
}
if (domWw) r = window;
else
{
if (d.documentElement &&
typeof d.documentElement.clientWidth == "number" &&
d.documentElement.clientWidth != 0)
r = d.documentElement;
else
{

if (d.body && typeof d.body.clientWidth == "number")
r = d.body;
}

}
function winsize()

{
var oh,sy,ow,sx,rh,rw;

if (domWw)

{

if (d.documentElement && d.defaultView &&

typeof d.defaultView.scrollMaxY == "number")

{

oh = d.documentElement.offsetHeight;

sy = d.defaultView.scrollMaxY;

ow = d.documentElement.offsetWidth;

sx = d.defaultView.scrollMaxX;

rh = oh-sy;

rw = ow-sx;

}

else

{

rh = r.innerHeight;

rw = r.innerWidth;

}

h = rh;

w = rw;

}

else

{

h = r.clientHeight;

w = r.clientWidth;

}

}

function scrl(yx)

{

var y,x;

if (domSy)

{

y = r.pageYOffset;

x = r.pageXOffset;

}

else

{

y = r.scrollTop;

x = r.scrollLeft;

}

return (yx == 0)?y:x;

}

function mouse(e)

{

var msy = (domSy)?window.pageYOffset:0;

if (!e) e = window.event;

if (typeof e.pageY == 'number')

{

my = e.pageY - msy + 16;

mx = e.pageX + 6;

}

else

{

my = e.clientY - msy + 16;

mx = e.clientX + 6;

}

if (my > h-65) my = h-65;

if (mx > w-50) mx = w-50;

}

function assgn()

{

for (j = 0; j < 3; j++)

{

dy[j] = my + 50 * Math.cos(stp+j*evn*Math.PI/180) *

Math.sin((stp+j*25)/2) + scrl(0) + pix;

dx[j] = mx + 50 * Math.sin(stp+j*evn*Math.PI/180) *

Math.sin((stp+j*25)/2) * Math.sin(stp/4) + pix;

}

stp+=s;

for (i = 0; i < n; i++)

{

if (i < n-1)

{

vx[i].top = vx[i+1].top; vx[i].left = vx[i+1].left;

vy[i].top = vy[i+1].top; vy[i].left = vy[i+1].left;

vz[i].top = vz[i+1].top; vz[i].left = vz[i+1].left;

}

else

{

vx[i].top = dy[0]; vx[i].left = dx[0];

vy[i].top = dy[1]; vy[i].left = dx[1];

vz[i].top = dy[2]; vz[i].left = dx[2];

}

}

setTimeout(assgn,t);

}

function init()

{

for (i = 0; i < n; i++)

{

vx[i] = document.getElementById("x"+(idx+i)).style;

vy[i] = document.getElementById("y"+(idx+i)).style;

vz[i] = document.getElementById("z"+(idx+i)).style;

}

winsize();

assgn();

}

if (window.addEventListener)

{
window.addEventListener("resize",winsize,false);

window.addEventListener("load",init,false);

document.addEventListener("mousemove",mouse,false);
}
else
if (window.attachEvent)
{
window.attachEvent("onload",init);

document.attachEvent("onmousemove",mouse);

window.attachEvent("onresize",winsize);

}

</script>

 - Teraakhir save template

Keterangan : ganti script yang berwarna orange dengan warna favorit warna sobat

Semoga Membantu dan bermanfaat

Description: Animasi Kusor 3 Warna Rating: 4.5 Reviewer: Unknown - ItemReviewed: Animasi Kusor 3 Warna

Cara Membuat Kotak Komentar Blog Keren

Kronolologi Komentar ini Sebelum nya saya tertarik dengan komentar blogmate om-dayz sempat bingung bagaimana membuat kotak komentar, akan tetapi dengan usaha akhirnya bisa juga.
Ini Priview nya

• Login ke akun blogger dan masuk ke Edit HTML

• Untuk berjaga-jaga, ada  baiknya jika kita backup dulu template kita, siapa tau ada kesalahan yang tak terduga

• Centang "Expand Widget HTML" ( bila perlu ) Kemudian copy semua kode berikut ini tanpa terkecuali agar berhasil di atas code ]]></b:skin> 

/* CSS Komentar */ #form-wrapper {margin-top:20px;} #comments{overflow:hidden;} .comments {clear: both;padding: 20px 30px 30px;margin: 10px 0px;background: none repeat scroll 0% 0% rgb(34, 34, 34); border: 1px solid rgb(51, 51, 51);box-shadow: 0px 0px 3px black inset;color: white;} #comments h4{display:block;padding:5px;line-height:30px} #comments h4,.comments .comment-header,.comments .comment-thread.inline-thread .comment{position:relative} #comments h4{background:rgba(255, 0, 0, 0.2); text-align:center;} #comments h4,.comments .user a{font-size:14px} #comments h4{font-weight:normal;color:#fff} #comments h4:after{content:"";position:absolute;bottom:-10px;left:20px;width: 0px;height: 0px;border-style: solid; border-width: 10px 7.5px 0 7.5px;border-color: rgba(255, 0, 0, 0.2) transparent transparent transparent;line-height:0} h4#comment-post-message {display:none} #comments .avatar-image-container img {border: 0px none; padding: 0px;box-shadow: none;border-radius: 30px;-webkit-border-radius:30px;-moz-border-radius:30px;} .comments .comments-content .datetime { float: right; font-size: 10px; margin-right:4px} .comments .comments-content .comment:first-child {padding-top: 0px;} .comments .thread-toggle { display: none;} .comments .comment .comment-actions a {padding: 2px 10px;background: rgb(51, 51, 51);border: 1px solid rgb(70, 70, 70);position: absolute;box-shadow: 0px 1px 2px black;color:rgb(230, 230, 230);-webkit-transition: all .05s linear;-moz-transition: all .05s linear;-o-transition: all .05s linear;transition: all .05s linear;} .comments .comment .comment-actions a:hover {background: none repeat scroll 0% 0% rgb(40, 40, 40);border: 1px solid rgb(51, 51, 51);text-decoration: none;box-shadow: 0px 0px 1px black;} .comment-thread{color:rgb(230, 230, 230); font-size:13px;} .comment-thread a{color:#777} .comment-thread ol{margin:0 0 20px} .comment-thread .comment-content a, .comments .user a, .comments .comment-thread.inline-thread .user a {color: rgb(230, 230, 230);font-weight: bold;font-size: 13px;text-shadow: 1px 1px rgb(0, 0, 0);} .comments .avatar-image-container, .comments .avatar-image-container img {width: 45px;max-width: 100%;height: 45px; max-height: 100%;margin: 0px 0px 3px;vertical-align: middle;border: 1px solid rgb(51, 51, 51);padding: 4px;box-shadow: 0px 1px 2px black;background-color: transparent;background-clip: content-box;transition: all 0.5s ease-out 0s;border-radius: 30px 0px 0px 30px;-webkit-border-radius:30px 0px 0px 30px;-moz-border-radius:30px 0px 0px 30px;overflow:hidden;} .comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single{margin-left:58px} .comments .comment-block{ border: 1px solid rgb(51, 51, 51);padding: 6px;background: none repeat scroll 0% 0% rgb(40, 40, 40);box-shadow: 0px 1px 2px black;position: relative; transition: all 1s ease-out 0s;} .comments .comments-content .comment-header {margin: 2px 0px 0px; padding: 5px 10px 7px; border: 1px solid rgb(65, 65, 65);background-color: rgb(51, 51, 51); word-wrap: break-word; } .comments .comments-content .comment-content {margin: 2px 0px 10px; padding: 5px 10px 7px; border: 1px solid rgb(65, 65, 65);background-color: rgb(51, 51, 51); word-wrap: break-word; } .comments .comments-content .comment{margin:20px 0 0;padding:0;width:100%;line-height:1em} .comments .comments-content .comment-thread {margin: 20px 0px;} .comments .comments-content .icon.blog-author{display:block; width:0; height:0; border:13px solid transparent; border-right-color:rgba(255, 0, 0, 0.1); position:absolute; right:-1px; bottom:4px;animation:author-icon .9s infinite;-moz-animation:author-icon .9s infinite; -webkit-animation:author-icon .9s infinite; } .comments .comments-content .inline-thread{padding:0 0 0 20px} .comments .comments-content .comment-replies{margin-top:0} .comments .comment-content{padding:5px 0;line-height:1.4em} .comments .comment-thread.inline-thread{border-left: 1px solid rgb(20, 20, 20);background: none repeat scroll 0% 0% transparent;box-shadow: -1px 0px 0px rgb(51, 51, 51);} .comments .comment-thread.inline-thread .comment{width:auto} .comments .comment-thread.inline-thread .comment .comment-block{border:0;background:transparent;padding:0} .comments .comment-thread.inline-thread .comment-block{margin-left:48px} .comments .comment-thread.inline-thread .user a{font-size:13px} .comments .comment-thread.inline-thread .avatar-image-container,.comments .comment-thread.inline-thread .avatar-image-container img{width:36px;max-width:36px;height:36px;max-height:36px} .comments .continue{border-top:0;width:100%} .comments .continue a, .comments .comments-content .loadmore a {background: none repeat scroll 0% 0% rgb(40, 40, 40); font-size: 16px;font-weight: normal;color: rgb(255, 255, 255);padding: 10px 0px;text-align: center;box-shadow: 0px 1px 2px black; text-transform: capitalize;text-shadow: 1px 1px rgb(0, 0, 0);-webkit-transition: all 0.26s ease-out 0s;-moz-transition: all 0.26s ease-out 0s;-o-transition: all 0.26s ease-out 0s;transition: all 0.26s ease-out 0s;border: 1px solid rgb(59, 59, 59);} .comments .continue a:hover, .comments .comments-content .loadmore a:hover{box-shadow: 0px 0px 1px black;} .comments .continue a:active, .comments .comments-content .loadmore a:active{box-shadow: none;background:rgb(70, 70, 70);} .comments .comments-content .loadmore {margin-top:0px;} .comment .continue{display:none} #comment-editor{width:103%!important;} .comment-form{width:100%;max-width:100%;margin-top:20px;}

Kemudian simpan dan lihat hasilnya….!Semoga sesuai keinginan ya…! Kalau gak berhasil, wah keterlaluan, Cuma copas script doank gak bisa… :D hehehe

Selamat mencoba dan semoga bermanfaat.. Description: Cara Membuat Kotak Komentar Blog Keren Rating: 4.5 Reviewer: Unknown - ItemReviewed: Cara Membuat Kotak Komentar Blog Keren

Animasi Meteor Jatuh

Kali Ini MAzz Puji Akan Memberikan Tips Buat Shobat Blog , Untuk Membuat Animasi Yang Sangat Unik Yaitu Animasi Meteor JAtuh Pada Blog

Cara Membuat_Nya Cukup Simpel
Sebelum Mazz Puji Kasih Tau Cara Membuat_Nya, MAzz Puji Cuma Pesan Kalau Sampean Sudah Memasang Animasi Meteor Jatuh Ini Jangan Sampai Sampean Kejatuhan Meteor Yang Anda Buat Sendiri .. Wkkwkwkwkwk ... Sayang Kan Broww Kl Gosong.... Ha ha ha ha.....

Oce Dach Jangan Basa Basi Lagi Ikuti LAngkah Dibawah Ini :

Pertamax Anda MAsuk Di Menu  Edit HTML
Setelah Itu Anda Cari Menu  </head>
Letakkan Kode Javascript dibawah Ini Tepat Di atas Kode </head>

<script language="javascript">
nd_mode="meteor";
nd_control="on";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="1";
nd_hMargin="1";
</script>
<script language="javascript" src="http://chika88.wen.ru/js/mazzpuji.js"></script>

Oce Sob Begitulah Cara Membuat Animasi Meteor JAtuh, Oh Ya Sob Jangan Lupa Klik Simpan Template YA .. Good Lock Salam Happy BloggerDescription: Animasi Meteor Jatuh Rating: 4.5 Reviewer: Unknown - ItemReviewed: Animasi Meteor Jatuh

Animasi Matric Background Blog

Sebelum saya mengasih tahu caranya, saya cuma mau kasih saran. tolong berhati-hati ya dalam mengotak-atik code scrip pada html. Karena jika kita salah naruh code scripnya akan mengakibatkan kerusakan pada tampilan blog anda. maka jangan salahkan saya bila terjadi kerusakan pada blog anda. Ada baiknya kita copy dulu code sebelumnya kenotepad untuk menghindari kesalahan dalam menaruh kode scrip.berikut adalah koleksi-koleksi efek animasi cara mengubah tampilan background pada blog agar terlihat menarik.

Background Dengan Efek  ( Matrik )
Cara Membuat_Nya

• Masuk Menu Edit HTML
• Cari Kode ]]></b:skin>
• Letakan Kode Css Ini Diatas Kode ]]></b:skin>

.nackvision.com {Background code} body {background-image: url(http://i560.photobucket.com/albums/ss44/erge32/dot.gif);}

Jika Anda Mau Mengganti Gambar_nya Dengan Foto Atau Animasi Background Anda Sendiri Anda Bisa Mengganti Alamat image  http://i560.photobucket.com/albums/ss44/erge32/dot.gif  Dengan Alamat Foto Atau Animasi Anda Sendiri .
Atau Anda Bisa Menggunakan Gambar Di Bawah Ini :

(http://s690.photobucket.com/albums/vv270/alwi/alwi07bg.png)

(http://i690.photobucket.com/albums/vv270/alwi/bggaris-1.gif)

(http://i690.photobucket.com/albums/vv270/alwi/bggaris.gif)

Oce Sob .. SilahKan Mencoba Sob Jangan Lupa Lihat Menu MAzz Puji Yang Lain Sob... !!! Thank Happy BloggerDescription: Animasi Matric Background Blog Rating: 4.5 Reviewer: Unknown - ItemReviewed: Animasi Matric Background Blog