Sabtu, 27 April 2013

Cara Membuat Text Mengikuti Kursor Pada Blog ( Muter Mode )










  1.  Ya Buka Blogger Lo
  2. Masuk Dashboard Blogger > Tata Letak > Tambah Gadget | Add Gadget 
  3. Copy Paste Kode Dibawah Ini
  4. <script>
    //mouse
    //Circling text trail- Tim Tilton
    //Website: http://www.tempermedia.com/
    //Visit http://www.dynamicdrive.com for this script and more
    function cursor_text_circle(){
    // your message here
    var msg='BANG ZENDY SANGAT GANTENG'.split('').reverse().join('');

    var font='Verdana,Arial';
    var size=3; // up to seven
    var color='#ff0000';

    // This is not the rotation speed, its the reaction speed, keep low!
    // Set this to 1 for just plain rotation w/out drag
    var speed=.3;

    // This is the rotation speed, set it negative if you want
    // it to spin clockwise
    var rotation=-.2;

    // Alter no variables past here!, unless you are good
    //---------------------------------------------------


    var ns=(document.layers);
    var ie=(document.all);
    var dom=document.getElementById;
    msg=msg.split('');
    var n=msg.length;
    var a=size*13;
    var currStep=0;
    var ymouse=0;
    var xmouse=0;
    var props="<font face="+font+" size="+size+" color="+color+">";

    if (ie)
    window.pageYOffset=0

    // writes the message
    if (ns){
    for (i=0; i < n; i++)
    document.write('<layer name="nsmsg'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+msg[i]+'</font></center></layer>');
    }
    else if (ie||dom){
    document.write('<div id="outer" style="position:absolute;top:0px;left:0px;z-index:30000;"><div style="position:relative">');
    for (i=0; i < n; i++)
    document.write('<div id="iemsg'+(dom&&!ie? i:'')+'" style="position:absolute;top:0px;left:0;height:'+a+'px;width:'+a+'px;text-align:center;font-weight:normal;cursor:default">'+props+msg[i]+'</font></div>');
    document.write('</div></div>');
    }
    (ns)?window.captureEvents(Event.MOUSEMOVE):0;

    function Mouse(evnt){
    ymouse = (ns||(dom&&!ie))?evnt.pageY+20-(window.pageYOffset):event.y; // y-position
    xmouse = (ns||(dom&&!ie))?evnt.pageX+20:event.x-20; // x-position
    }

    if (ns||ie||dom)
    (ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
    var y=new Array();
    var x=new Array();
    var Y=new Array();
    var X=new Array();
    for (i=0; i < n; i++){
    y[i]=0;
    x[i]=0;
    Y[i]=0;
    X[i]=0;
    }

    var iecompattest=function(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
    }

    var makecircle=function(){ // rotation properties
    if (ie) outer.style.top=iecompattest().scrollTop+'px';
    currStep-=rotation;
    for (i=0; i < n; i++){ // makes the circle
    var d=(ns)?document.layers['nsmsg'+i]:ie? iemsg[i].style:document.getElementById('iemsg'+i).style;
    d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15+(ie||dom? 'px' : '');
    d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2+(ie||dom? 'px' : ''); // remove *2 for just a plain circle, not oval
    }
    }

    var drag=function(){ // makes the resistance
    y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
    x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
    for (var i=1; i < n; i++){
    y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
    x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);

    }
    makecircle();
    // not rotation speed, leave at zero
    setTimeout(function(){drag();},10);
    }
    if (ns||ie||dom)
    if ( typeof window.addEventListener != "undefined" )
    window.addEventListener( "load", drag, false );
    else if ( typeof window.attachEvent != "undefined" )
    window.attachEvent( "onload", drag );
    else {
    if ( window.onload != null ) {
    var oldOnload = window.onload;
    window.onload = function ( e ) {
    oldOnload( e );
    drag();
    };
    }
    else
    window.onload = drag;
    }

    }
    cursor_text_circle();

    </script>
  5. Bang Zendy Sangat Ganteng | Ganti Sesuai Keinginan lovar font='Verdana,Arial';   | Adalah Bentuk Huruf Ganti Sesuka Lo
    var size=3; // up to seven  | Ukuran Huruf
    var color='#ff0000';  | Warna Nya Kamu Bisa Liat Warna Lain Dibawah ini

Kode Warna

Cuma Sekedar Share kan ini agak penting buat script yang mau di cat xixi Liat Screen Shootnya Dibawah




















Ini yang Asli Liat Dibawah Monggo dicicipi masih anget hehe


     5. Save Template Lo Dan liat Insyaallah Berhasil  

Cara Membuat Vertical Menu

 

Rocky santoso- Cara Membuat Vertical Menu , Hehe mungkin agan belum atgu Vertical Menu Itu Seperti apa , tapi yang perlu diketahui vertical menu itu keren sob klik muncul dia kebawah kita klik yang lain mucul lagi ke bawah dan yang kita klik tadi menutup , kita juga bisa memilih menu mana yang mau kita masukin ke vertical menu ini .

http://zendyhafitra.blogspot.com/2013/02/cara-membuat-vertical-menu.html

  1. Masuk ke dasboard blogger lo > Template > Edit HTML
  2. cari kode ]]></b:skin>   pencet tombol F3 kalo gak CTRL + F masukin kodenya ntar ketemu
  3. masukan kode berikut ini diatas kode ]]></b:skin>
  4. /*Vertikal Menu
    ---------------------------------*/
    .vertikalmenu{
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 180px; /* lebar dari menu vertikal*/
    }
    .vertikalmenu li{
    border-bottom: 1px solid white;
    }
    .vertikalmenu li a{
    background: #000000 ; /*warna dari menu vertikal*/
    font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana;
    display: block;
    color: white;
    width: auto;
    padding: 5px 0;
    text-indent: 8px;
    text-decoration: none;
    border-bottom: 1px solid black;
    }
    .vertikalmenu li a:visited, .vertikalmenu li a:active{
    color: white;
    }
    .vertikalmenu li a:hover{
    background-color: #737373; /*warna setelah pointer diarahkan (hover)*/
    color: white;
    border-bottom: 1px solid black;
    }
  5. Klik Save Template
Kode Yang Berwarna Hijau #000000 adalah backgroundnya ganti sesuka anda
Dan Kode #737373 adalah kode warna setelah link menu dklik
  1. Selanjutnya Anda Pilih Tata Letak
  2. Add Gadget | Tambah Gadget Masukan kode ini

<ul class="vertikalmenu">
<li><a href="/">» HOME</a></li>
<li><a href="http://your blog name.blogspot.com">» Menu1</a></li>
<li><a href="http://your blog name.blogspot.com">» Menu 2</a></li>
<li><a href="http://your blog name.blogspot.com">» Menu 3</a></li>
<li><a href="http://your blog name.blogspot.com">» Menu 4</a></li>
<li><a href="http://your blog name.blogspot.com">» Menu 5</a></li>
</ul>
Dan your blog name ganti dengan nama blog lo atau yang mau lo jadiin menunya
Dan Menu nya ganti sesuai Menu Kamu Sekian Wassalam
Semoga Bermanfaat Kurang Jelas Komentarnya Ditunggu

Cari Mengganti Older Post Dengan Angka 123


Rocky Santoso - Cari Mengganti Older Post Dengan Angka 123 , Memang Cara Ini Sudah Sedikit Greget , Daripada Yang Ada tulisan Home dan older post kan gak asik susah kita mau langsun ke ujung artikel oke berikut cara pemasangannya.


  1. Buka Dasboard Blogger > Template > Edit HTML
  2. cari kode ]]></b:skin> lalu taruh script berikut diatas kode ]]></b:skin>
  3.  .showpageArea a {text-decoration:underline;}
    .showpageNum a {text-decoration:none;border: 1px solid #cccccc;margin:0 3px;padding:3px;}
    .showpageNum a:hover {border: 1px solid #cccccc;background-color:#cccccc;}
    .showpagePoint {color:#333;text-decoration:none;border: 1px solid #cccccc;background: #cccccc;margin:0 3px;padding:3px;}
    .showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}
    .showpage a {text-decoration:none;border: 1px solid #cccccc;padding:3px;}
    .showpage a:hover {text-decoration:none;}
    .showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;}
  4. setelah itu cari kode ini </body> kemudian taruh script dibawah ini sebelum kode </body>.
  5.  <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
    <script type='text/javascript'>
    var pageCount=5;
    var displayPageNum=5;
    var upPageWord =&#39;Previous&#39;;
    var downPageWord =&#39;Next&#39;;
    </script>
    <script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
    </b:if> </b:if>
  6. lalu simpan dan lihat hasilnya
Segitu saja Cari Mengganti Older Post Dengan Angka 123 , jika kurang jelas harap berkomentar
Semoga Bermanfaat

Cara Membuat Efek Zoom Pada Foto Di blog ( Perbesar Gambar )


Rocky santoso- Cara Membuat Efek Zoom Pada Foto Di blog ( Perbesar Gambar ) , ini cara simple memperbesar foto pada postingan di blog ketika kita arahkan mouse kita kesana berikut caranya.

1. Masuk Dasbord Blogger Lo
2. Pilih Template > Edit HTML
3. Selanjutnya cari kode ]]></b:skin> teken aja f3 lalu masukan script berikut tepat diatas kode ]]></b:skin>
.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.3); -o-transform: scale(1.3); -webkit-transform: scale(1.3); }
4. Lalu Simpan Dan Lihat Hasilnya
Berikut Cara Membuat Efek Zoom Pada Foto Di blog ( Perbesar Gambar ) , Karena Mungkin Foto yang ditampilkan pada postingan blog itu terlalu kecil , cara ini sudah saya coba bisa anda check sendiri , Salam hangat Selalu ~ Rocky santoso
Semoga Bermanfaat

Cara Pasang Widget SMS Gratis Pada Blog


Rocky Santoso - Cara Pasang Widget SMS Gratis Pada Blog , Dan Saya Pernah Memposting Cara Pasang Lagu Di Blog Banyak Blog Blog yang sudah Memasang Widget ini , fungsinya membuat pengunjung betah dengan SMS-SMS Gratis yang ada pada blog kita , oce berikut Cara Pasang Widget SMS Gratis Pada Blog ,


1. Log in blog dulu
2. Masuk ke rancangan
3. Klik tambah gadget/widget
4. Pilih edit > html javascript
5. Masukkan kode ini :
<iframe name="I2" src="http://sms-online.web.id/widget"
     width="270" height="350"> not support </iframe>
     <a href='
http://zendyhafitra.blogspot.com/2013/04/cara-pasang-widget-sms-gratis-pada-blog.html' rel='nofollow'>pasang gadget ini di blog anda</a>
6. Beri judul "sms gratis"
7. Simpan
Berikut Cara Pasang Widget SMS Gratis Pada Blog Kalau Kurang Jelas Silahkan Berkomentar Yang Relvan Dibawah.
Salam Hangat Selalu ~ Rocky Santoso
Semoga Bermanfaat

Cara Membuat Like Fanspage Facebook Melayang di Blog ( Like Box )


Rocky santoso - Cara Membuat Like Facebook Melayang di Blog ( Like Box )Like Box Melayang Di Blog Ini Dilengkapi Dengan Follow Twitter Juga Jadi Gak Usah Ribet Nambahin Script Lainnya Berikut Caranya.

1. Dasboard Blogger lo > Tata Letak > Tambah Gadget
2. Pilih HTML Javascript Lalu Masukan Kode Berikut Ini
<style type='text/css'>
/* Message Box */
#box-message {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#fff;
font:normal Dosis, Georgia, Serif;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#box-message a.close {
position:absolute;
top:-10px;
right:-10px;
background:#fff;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#111;
border:2px solid #333;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:22px;
-moz-border-radius:22px;
border-radius:22px;
cursor:pointer;
}
#twitterx {
background: #EEF9FD;
padding: 10px;
text-align:center;
border: 1px solid #C7DBE2;
border-top: 0;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top Value When Page Loaded Completed
$('#box-message').animate({top:"50px"}, 1000);
// Remove Mailbox When Close Button On Click
$('a.close').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='box-message'>
<!-- HTML Start -->
<center><a class="murub">Jangan Lupa Like ya</a></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Bang-Zendy/548851531797318?ref=hl&amp;width=292&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false&amp;appId=371524026202784" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:258px;" allowtransparency="true"></iframe>
</center>
<!-- HTML End -->
<br/>
<div class="twitter">
<!-- Twitter --> <iframe title="" style="width: 250px; height: 20px;" class="twitterx-follow-button" src="http://platform.twitter.com/widgets/follow_button.html#_=1319978796351&amp; align=&amp;button=blue&amp;id=twitter_tweet_button_0&amp; lang=ID&amp;link_color=&amp;screen_name=GuaTampan&amp;show_count=&amp; show_screen_name=&amp;text_color=" frameborder="0" scrolling="no"></iframe> </div>
<a class='close' href='#'>&times;</a>
</div>

Yang Berwarna Merah Ganti Sesuka lo
Yang Berwarna Hijau Ganti Dengan URL Fanspage Facebook lo
Yang Berwarna Ungu Ganti Dengan nama twitter lo
3. Lalu Simpan Dan lihat Hasilnya


Segitu Saja Cara Membuat Like Facebook Melayang di Blog ( Like Box )  , Kalau Kurang jelas silangkan berkomentar yang baik Terima Kasih.
Semoga Bermanfaat

Cara Membuat Translate dengan Gambar Bendera pada Blog

 Cara Membuat Translate dengan Gambar Bendera pada Blog - Sebenernya tutorial Cara Membuat Translate dengan Gambar Bendera pada Blog sudah banyak beredar di internet, namun tidak salah kalau  mencoba Memposting sekedar mengingatkan saja.

Oh iya, sebelumnya AB juga sudah membuat tutorial bagaimana Cara Memasang Widget Translate Google di Blog. Walau hampir sama, namun postingan kali ini mengenai Cara Membuat Translate dengan Gambar Bendera pada Blog lebih rapi. Penasaran nih mau mencoba?
Beginalah Cara Membuat Translate dengan Gambar Bendera pada Blog, Yang harus kita lakukan:
1. Seperti biasa bukalah Akun Blog anda kawan.
2. Masuklah ke Rancangan / Design Blog anda.
3. Pilihlah Add Widget / Tambah Gadget pada rancangan.
4. Pilih lagi Add HTML/JavaScript
5. Copylah Script berikut di bawah ini.

<style>
.google_translate img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.google_translate:hover img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.google_translatextra:hover img {
filter:alpha(opacity=0.30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
</style>
<div>
<a class="google_translate" href="http://www.blogger.com/post-create.g?blogID=7490537618574143540#" rel="nofollow" target="_blank" title="English"><img align="absbottom" alt="English" border="0" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipdkv4SC6-5JeFiOPqmTjreNXefBwQvIfcf8l6Am1HH3oTXxVkk4T2q00sbtIReOsDYIT-SMGTdxjTAwtoQp34Jdcg1MUN3Hi9fkkvISUuI8b7SMrEXieUkUSrjsN6djOcVn6IuNEl2Nc/?imgmax=800" style="cursor: pointer; margin-right: 10px;" title="English" width="24" /></a>

<a class="google_translate" href="http://www.blogger.com/post-create.g?blogID=7490537618574143540#" rel="nofollow" target="_blank" title="French"><img align="absbottom" alt="French" border="0" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIv370j9_3aK8Utr5mA5KhqwWGnrmsdssi5nqDgAEP6krD-8t4Lnoy06C4cYlYo4X_Q_stWkCvYQMdiS79I7G6bE_w0j_aNyt8Kel8k4lNxzXr2z85xHE29A11nM64N750UKsBa9JTrmk/?imgmax=800" style="cursor: pointer; margin-right: 10px;" title="French" width="24" /></a>

<a class="google_translate" href="http://www.blogger.com/post-create.g?blogID=7490537618574143540#" rel="nofollow" target="_blank" title="German"><img align="absbottom" alt="German" border="0" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzeh4bMJuC_ovnbXV9o1mXLMq-RpQBIcqeGtvGFBFyoKLkReSv_Ao4cKG3YuSVKNGjf-WFidsl4DkvMuFUdM4vmJLu_g7B5Ub4xoWJisSDJyRay88TGF6oNdQ1AWnMbRpYdLq7TkH66wfo/?imgmax=800" style="cursor: pointer; margin-right: 10px;" title="German" width="24" /></a>

<a class="google_translate" href="http://www.blogger.com/post-create.g?blogID=7490537618574143540#" rel="nofollow" target="_blank" title="Spain"><img align="absbottom" alt="Spain" border="0" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg80hp9L6F5jWkghVHwWz6tyUEGX3RzKxm7V_aQagGa58nT7hP3cFvCVGG1C33sdcXUiMbEZ89KqCMQRNLq-v9dJt9eE_Qo9h9qC2SF3cfGDf2hslC63xlYs7lxK_CLX80xFkfZrimT_g2B/?imgmax=800" style="cursor: pointer; margin-right: 10px;" title="Spain" width="24" /></a>

<a class="google_translate" href="http://www.blogger.com/post-create.g?blogID=7490537618574143540#" rel="nofollow" target="_blank" title="Russian"><img align="absbottom" alt="Russian" border="0" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGykBJyhp1ogoIl_CNtwS4IhzCQhOyuR2BgNa7tmipFkqCSEJZiI_NeP5Fl-x3YtjpqMJppBgTzsBxoC2QfOD7e9BFJ-e394p4hUN5Q82lJsE6PB_xijXfZ1S6d1gtuxEi3ewotnRQjQw/?imgmax=800" style="cursor: pointer; margin-right: 10px;" title="Russian" width="24" /></a>

<a class="google_translate" href="http://www.blogger.com/post-create.g?blogID=7490537618574143540#" rel="nofollow" target="_blank" title="Japanese"><img align="absbottom" alt="Japanese" border="0" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUFZl55yTbcQ3WieFVhaYwlZ_KL4_aHhoZZt7MVS4VWuA6oMf0oi-XeS62YCcIrmzcnc943RwFVEczZ5RwI5uuDdFm18X2GqBnTSMRrOe5-wDf0TqjvG05MIpNsd9U75LHdJVH4rnvLc-Q/?imgmax=800" style="cursor: pointer; margin-right: 10px;" title="Japanese" width="24" /></a>

<a class="google_translate" href="http://www.blogger.com/post-create.g?blogID=7490537618574143540#" rel="nofollow" target="_blank" title="Arabic"><img align="absbottom" alt="Arabic" border="0" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirofR9dMMv_BYFvA5uYV4rSQPgOUjummPurvE2aSXeZRZQCGKNcjM3nDn2s-XbMJ2zMW0eZQGzXhODiF9W3g6hxAsicQsomRK2n4KnY_yZTKICgIMFE4ypEm73M_lhFwwfd6QQNnOKU1A/?imgmax=800" style="cursor: pointer; margin-right: 10px;" title="Arabic" width="24" /></a>

<a class="google_translate" href="http://www.blogger.com/post-create.g?blogID=7490537618574143540#" rel="nofollow" target="_blank" title="Chinese Simplified"><img align="absbottom" alt="Chinese Simplified" border="0" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfH6q0TPC4M9Rn4Fy9AGbDWt3LhMkx-d_ovKlU05Jxp5VzCa5zzGTzVrRL2pJ66nc8uASbO7Nq6TM-SKPnVvLIo4WeHu9HjefDmykOsDJZ49K-Taa-GN6mzlO5Nw5QFED_1JOzAbSCHj0/?imgmax=800" style="cursor: pointer; margin-right: 10px;" title="Chinese Simplified" width="24" /></a></div>

6. Simpat Widget dan Template Blog
7. Lihat Hasilnya.

Flag Counter

Flag Counter