Senin, 07 Januari 2013

Cara Membuat Share Button Melayang

Hey Sobb,.!! sekarang saya akan mEngupdate Cara Membuat Share Button Melayang,, karena setiap posting anda pasti ingin selalu di kunjungi oleh pengguna internet,, untuk mencari informasi yang di butuhkan,!! nah sekarang saya memberikan Cara Membuat Share Button Melayang,, yang nantinya bisa di share pada Twitter,dan Facebook,.!!

Contoh Share Button Melayang :


Cara nya Sebagai bErikut :
1. Buka Blog Kalian
2. Tata Letak
3. Tambah Gadget
4. HTML/JavaScript
5. Kemudian Copy Pastekan Script Berikut

Script:
--------------------------------------------------------------------------------------
<!--Widget Share Button Melayang Start-->
<style>
#pageshare {position:fixed; bottom:5%; right:0px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;padding:0 0 2px
0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id='pageshare' title="bagikan ke teman anda">
<div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div>
<div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div>
<br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://1000000cara.blogspot.com/2013/01/cara-membuat-share-button-melayang.html" target="blank"><font color="blue">[Get Widget]</font></a></div>
<!--Widget Share Button Melayang End--></div>
--------------------------------------------------------------------------------------

6. Kemudian Pilih Pratinjau
7. Setelah Sesuai dengan keinginan Anda Pilih Save

nah,, begitulah Cara Membuat Share Button Melayang ,.!! mudah bukan,. ^_^

Selamat Mencoba ,.!!!



Description: Cara Membuat Share Button Melayang
Rating: 4.5
Reviewer: ArisMyou
ItemReviewed: Cara Membuat Share Button Melayang

Minggu, 06 Januari 2013

Cara Membuat Menu Horizontal


Haii sObb,..!! 

sekarang di sini saya gak bahas tentang cheat tapi saya ingin update tentang Cara Membuat Menu Horizontal Drop Down,.. nah,, para pemula blogger pasti ingin sekali memiliki menu yang bagus dan menarik,.!!

nah berikut contoh Menu nya,. :
nah di atas adalah contoh menunya,.!!

cara membuatnya,.. di sini,, heheh

1. Buka Blog kalian
2. Masuk Ke DASHBORE
3. Template dan pilih EditHTML dan klick Expand Template Widgate
4. tekan CTRL+F untuk mencari kede ini  ]]></b:skin>
5. Setelah Ketemu,. letakkan Script berikut di atas kode ]]></b:skin>

Script:

/* Menu Horizontal Dropdown
----------------------------------------------- */
#menuwrapperpic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQWrVPPEu2YIiSmSqC9hlljyYV038JQY3W_k9D2Q993qWu9cHr1jXy4SqYrR276WeJQLsw8ArFvKpW5rWneAGz8tbLQMO8JsroMK78QpD4rSPiNSVJdXBddLJsiLCeVmF6HdJ2kmbyRTE/s1600/nav.png) repeat-x;width:960px;margin:0 auto;padding:0 auto}
#menuwrapper{width:960px;height:30px;margin:0 auto}.menusearch{width:300px;float:right;margin:0 auto;padding:0 auto}
.clearit{clear:both;height:0;line-height:0.0;font-size:0}
#menubar{width:100%}
#menubar,#menubar ul{list-style:none;font-family:Arial, serif;margin:0;padding:0}
#menubar a{display:block;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;text-shadow: 0px 1px 1px #000;color:#f2f1f1;border-right:1px solid #666;padding:9px 10px 8px}
#menubar a.trigger{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3kGlXwi7ZvQ6S4ZwXob42TOy46FewbC18FpVvr9cytMzaA97Y_HQ7gfW0mHZp9Ln60ocW1ByOXFmCyGannPuf7uAcXvBY576C70Y91eFPFNpLS23qVXmTV5HVc4v8ceNjuNSc5R883to/s1600/arrow_white.gif);background-repeat:no-repeat;background-position:right center;padding:9px 24px 8px 10px}
#menubar li{float:left;position:static;width:auto}
#menubar li ul,#menubar ul li{width:170px}
#menubar ul li a{text-align:left;color:#fff;font-size:12px;font-weight:400;text-transform:none;font-family:Arial;border:none;padding:5px 10px}
#menubar li ul{z-index:100;position:absolute;display:none;background:#222;padding-bottom:5px;-moz-box-shadow:0 2px 2px rgba(0,0,0,0.6);-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.6)}
#menubar li:hover a,#menubar a:active,#menubar a:focus,#menubar li.hvr a{background-color:#222;color:#E98C0A}
#menubar li:hover ul,#menubar li.hvr ul{display:block}
#menubar li:hover ul a,#menubar li.hvr ul a{color:#edfdfd;background-color:transparent;text-decoration:none}
#menubar li ul li.hr{border-bottom:1px solid #444;border-top:1px solid #000;display:block;font-size:1px;height:0;line-height:0;margin:4px 0}
#menubar ul a:hover{background-color:#555!important;color:#fff!important;text-decoration:none}

6. setelah selesai meng COPAS script ini Cari Kede </head>
7. biasanya terdapat dua kata </head> pilih kode yang kedua,.. kemudian Copy Paste script Berikut di bawah Kode </head>

Script :

<div id='menuwrapperpic'>
<div id='menuwrapper'>
<ul id='menubar'>
<li><a href='#'>Home</a></li>
<li><a href='#'>About Us</a></li>
<li><a class='trigger' href='#'>Contact Us</a>
<ul>
<li><a href='#'>Goggle +</a></li>
<li class='hr'/>
<li><a href='#'>Contact on Facebook</a></li>
<li class='hr'/>
<li><a href='#'>Contact on Twitter</a></li>
</ul>
</li>
<li><a href='#'>Sport</a></li>
<li><a href='#'>Culture</a></li>
<li><a class='trigger' href='#'>Entertainment</a>
<ul>
<li><a href='#'>Music</a></li>
<li class='hr'/>
<li><a href='#'>Movie</a></li>
<li class='hr'/>
<li><a href='#'>Television</a></li>
</ul>
</li>
<li><a href='#'>Health</a></li>
<li><a class='trigger' href='#'>More</a>
<ul>
<li><a href='#'>Themes</a></li>
<li class='hr'/>
<li><a href='#'>Tutorial</a></li>
<li class='hr'/>
<li><a href='#'>Resource</a></li>
<li class='hr'/>
<li><a href='#'>Advertise</a></li>
<li class='hr'/>
<li><a href='#'>Javascript</a></li>
</ul>
</li>
</ul>
<div class='menusearch'>
<div style='float:right;padding:4px 8px 0 0;'>
<form action='http://www.google.com/search' method='get' target='_blank'>
<input name='sitesearch' style='display:none;' value='http://cheaterpandaan2.blogspot.com'/>
<input id='search-box' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;;' style='width:170px;border:none;padding:4px 10px; font:12px Arial;color:#666; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0ECczcAdwAS9nItjR4ZP18Cmx8aWHio27OEj7ZHJ_k9aRZmXAYJAYesXEdNLJDXGU79KDyrhiTUZgpn8UwmknTshi80BcbYeLo2rZzcfBxUCM79cIuAerQ9E4MsJB8Vtp3g4Pq-K0ZbU/s1600/field-bg.gif) no-repeat;' type='text' value='Search on this site...'/><input align='top' id='search-btn' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjscEw0gvp6FzEa3Rw6x6eUYOGkhN4vkMg5LPs8R7FlmEAmwhVb80hUz9ruIuV2LwV8mqKfC8t9ydwskTMEv0bOWQJQkX9jzLjfMqwvvnv5xeT_9FdvSgnwdh6magHOS9PCd7XgeJzMHOk/s1600/bg_search.gif' type='image' value='Search'/>
</form>
</div>
</div>
<br class='clearit'/>
</div>
<div style='clear:both;'/>
</div> 

8. Sebelum Menyimpan Script tadi,, pilih PRATINJAU terlebih dahulu apakah cript sudah benar-benar memang benar,, hehe
9. Setelah benar,, Klick SAVE

Note : 
Warna Kuning = isikan dengan link yang anda inginkan
Warna Hijau = judul menu
Warna Biru = ganti dengan alamat blogger sobat

Description: Cara Membuat Menu Horizontal Drop Down
Rating: 4.5
Reviewer: ArisMyou
ItemReviewed: Cara Membuat Menu Horizontal Drop Down
 
eXTReMe Tracker

Copyright 2012 1000000 Cara Template by Bamz Templates