ABoUt SiteLink

ABoUt SiteLink

Google Sitelink merupakan hadiah dari mbah google untuk sebuah blog/web, Mendapatkan sitelink mungkin adalah harapan setiap Blogger, karena dengan mendapatkan sitelink berarti blog kita oleh Mbah Google dianggap sedikit berkualitas. Apa itu Google sitelink? Menurut definisi saya sitelink adalah tautan-tautan atau sub link yang muncul dibawah link utama (Link Homepage) dari sebuah Blog pada pencarian Google search. Dan sitelink tersebut merupakan navigasi (tautan) yang langsung menuju ke halaman (Posting) tertentu tanpa melalui Link Home page.

Bagaimana sih cara mendapatkan sitelink? Untuk mendapatkan sitelink itu hal yang tidak mudah, mungkin dengan membuat/menulis artikel yang bermanfaat (don't Copas artikel 100%) kalau bisa original, buatlah blog itu seringan mungkin (jangan terlalu berat) hindari pemasangan javascript yang berlebihan, Widget yang menumpuk, dan cobalah Submit Blog ke Google, Yahoo, Bing dll.

Keep SiteLink

Nah untuk yang saya bahas kali ini bukanlah bagaimana cara mudah mendapatkan sitelink, Namun bagaimana mempertahankan sitelink atau menjaga sitelink blog yang sudah kita dapat agar tidak hilang dari Google search. Karena beberapa waktu lalu Blog kesayangan saya ini pernah mengalami kehilangan SiteLink, akibat dari penghapusan beberapa artikel dalam blog , dan mungkin artikel yang saya hapus tersebut masuk dalam rangking teratas pencarian Mbah Google search. Jadi menurut kesimpulan saya, menghapus postingan yang sudah dipublikasikan akan membuat Mbah Google Lupa dan gak kenal lagi dengan Blog kita (dampaknya SiteLink Hilang).

Berikut ini adalah Tips sederhana Menjaga SiteLink :

• Keep Update (selalu Update blog sobat dengan artikel-artikel yang mungkin menurut mbah google bermanfaat dan yang pastinya original, karena postingan yang 100% Copas itu sama sekali tidak akan di endus oleh mbah google karena dianggap SPAM/sampah).
• Jangan terlalu sering ganti template, karena dengan seringnya mengganti template akan mempengaruhi pengelihatan mbah google apalagi tanpa memperhatikan meta-tag yang terpasang sebelumya.
• Jangan mengganti atau merubah meta-tag, ini adalah salah satu peyebab paling vital hilangnya sitelink blog.
• Jangan sekali-kali menghapus postingan yang sudah dipublikasikan, karena hal tersebut akan menyebabkan Error Crawl (kesalahan pecarian penelusuran oleh mbah google spider) karena Google spider tiap hari mengubek-ubek blog kita secara detail.

Oke sobat sekian dulu sedikit Tips sederhana dari saya tentang bagaimana caranya menjaga sitelink (mempertahankan sitelink) Blog kita, agar tidak hilang dari penulusuran mbah Google search. (write by : Me 4 U All)

Create Fixed Widget Sponsor

Langsung aja deh Sob Berikut tips membuat widget iklan melayang,Udah lihat demonya kan? tadi waktu buka postingan ini. Widget Iklan melayang ini dilengkapi dengan tombol Close, dan akan menghilang dengan sekali klik. Bagi  sobat yang berminat berikut ini kodenya.

Kodenya

<style type="text/css"> * html #iklan{position:relative;} #iklan{position:fixed;right:23%;top:0;z-index:+1000; background:#ddd ;width:50%;height:96%;padding:5px;border:8px solid #ddd;-moz-box-shadow: 0 0 50px #000,inset 0 0 50px #000;-webkit-box-shadow: 0 0 50px #000,inset 0 0 50px #000;box-shadow: 0 0 50px #000,inset 0 0 50px #000;} </style><script type='text/javascript'> function showHideiklan(){ var iklan = document.getElementById("iklan"); var w = iklan.offsetWidth; iklan.opened ? moveiklan(0, 30-w) : moveiklan(20-w, 0); iklan.opened = !iklan.opened; } function moveiklan(x0, xf){ var iklan = document.getElementById("iklan"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir-100; iklan.style.top = x.toString() + "px"; if(x0!=xf){setTimeout("moveiklan("+x+", "+xf+")", 10);} } </script> <div id='iklan'> <div style='-background:#ddd ;height:90%;padding:5px;overflow:auto;'> <center> KODE IKLAN LOE LETAKKAN DISINI SOB </center> </div> <center> <a href="javascript:void(0);" onclick="showHideiklan()"><input class="close" style="-moz-box-shadow: 0 0 50px #000,inset 0 0 50px #000; -webkit-box-shadow: 0 0 50px #000,inset 0 0 50px #000; background: #A4A4A4; border: 4px solid #ddd; box-shadow: 0 0 50px #000,inset 0 0 50px #000; color: white; font: 16px Verdana; padding: 5px; width: auto;" type="button" value="Click Here to Close" /></a> <script type="text/javascript"> var iklan = document.getElementById("iklan"); iklan.style.center = (30-iklan.offsetWidth).toString() + "px"; </script></center> </div>

Pemasanganya :

1. Login ke Blog sobat, Masuk Elemen Laman
2. Klik tambah gadget pilih HTML/javascript
3. Pastekan Kode diatas,Ganti tulisan berwarna biru dengan kode iklan sobat.
4. Lalu simpan

KODE IKLAN SOBAT LETAKKAN DISINI

CSS Red Menu Horisontal

Demo Red Menu Horisontal

• Home
• Menu 1
• Menu 2
• Menu 3
• Menu 4
• Menu 5

Kode CSSnya

<style type="text/css"> #binkbenkPositioner {width:100%; position:relative; float:left; top:-40px; margin-bottom:-40px;z-index:999; } #binkbenkHolder {position:relative; float:left; left:50%;} #binkbenk, #binkbenk ul {padding:0; margin:0; list-style:none; font: 15px Comic Sans MS, sans-serif; background: -moz-linear-gradient(center top, #9f9f9f, #686868 25%, #2a2a2a 45%, #686868 85%, #9f9f9f); background: -webkit-gradient(linear, center top, center bottom, from(#9f9f9f), color-stop(25%, #686868), color-stop(45%, #2a2a2a), color-stop(85%, #686868), to(#9f9f9f)); position:relative; z-index:100;} #binkbenk {height:45px; float:left; padding:0 ;-moz-border-radius: 10px 10px 10px 10px; background: -moz-linear-gradient(center top, #9f9f9f, #686868 25%, #2a2a2a 45%, #686868 85%, #9f9f9f); background: -webkit-gradient(linear, center top, center bottom, from(#9f9f9f), color-stop(25%, #686868), color-stop(45%, #2a2a2a), color-stop(85%, #686868), to(#9f9f9f)); border: 4px inset red; position:relative; right:50%;} #binkbenk ul {position:absolute; left:-9999px; top:-9999px;} #binkbenk table {border-collapse:collapse; margin:-1px; padding:0; width:0; height:0;} #binkbenk li {float:left;} #binkbenk li a {display:block; float:left; color:#fff; height:30px; padding:0px 10px 0px 0px; line-height:30px; text-decoration:none; -moz-border-radius: 10px 10px 10px 10px; background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); border: 4px inset white; } #binkbenk li a.sub {-moz-border-radius: 10px 10px 10px 10px; background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); border: 3px inset white; } #binkbenk li a b {display:block; float:left; height:40px; padding:0px 0px 0px 10px; cursor:pointer;} #binkbenk li:hover {position:relative; z-index:100;} #binkbenk a:hover {position:relative; z-index:100; color:#fc0;} #binkbenk a.sub:hover {background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); } #binkbenk li:hover > a {color:#fc0;} #binkbenk li:hover > a.sub {background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); } #binkbenk :hover ul {left:0; top:40px; z-index:300; width:130px; padding-top:4px; background:url(trans.gif);} #binkbenk :hover ul li a {height:25px; width:120px; padding:0 0 0 10px; line-height:25px; background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); color:#fff; border-bottom:1px solid #a3b6c4; font-size:11px;} #binkbenk a:hover { background: -moz-linear-gradient(center top, #9f9f9f, #686868 25%, #2a2a2a 45%, #686868 85%, #9f9f9f); background: -webkit-gradient(linear, center top, center bottom, from(#9f9f9f), color-stop(25%, #686868), color-stop(45%, #2a2a2a), color-stop(85%, #686868), to(#9f9f9f)); transform:rotate(10deg); -moz-transform:rotate(10deg); -webkit-transform:rotate(10deg); -o-transform:rotate(10deg); font-size: 18px;} </style> <div id="binkbenkPositioner"> <div id="binkbenkHolder"> <ul id="binkbenk"> <li><a href="http://URL BLOG SOBATl"><b>Home</b></a></li> <li><a href="http://URL BLOG SOBAT"><b>Menu 1</b></a></li> <li><a href="http://URL BLOG SOBAT"><b>Menu 2</b></a></li> <li><a href="http://URL BLOG SOBAT"><b>Menu 3</b></a></li> <li><a href="http://URL BLOG SOBAT"><b>Menu 4</b></a></li> <li><a href="http://URL BLOG SOBAT"><b>Menu 5</b></a></li> </ul> </div> </div>

Copy Kode CSS diatas dan Letakan Dalam Gadget HTML/Javascript

CSS3 Gradient Menu Buttons

Tombol-tombol Menu Gradient ini terlihat menarik terlihat seperti tombol yang terbuat dari gambar, Namun sebenarnya hanya menggunakan kode CSS3. Untuk Lebih jelasnya Lihat Demonya dibawah dan Bagi Sobat Yang mau memasangnya Silahkan Pilih ada beberapa pilihan Warna 
Cara pemasanganya sebagai berikut

1. Masuk ke Blog Sobat
2. Klik Rancangan pilih tambah Gadget HTML/Javascript
3. Copy kode CSS nya Rubah nama menunya dan Alamat URLnya
4. Biar Tambah Cantik Utak-atik Pada Font teksnya juga Kode Warnanya
5. Untuk membuat miring kekiri saat dicursor Rubah kode (5deg) menjadi (-5deg)
6. Lalu simpan dan letakan dibagian atas Blog Sobat atau diatas genteng rumah Sobat hehehe...bercanda Sob   

• Home
• Game
• Facebook
• Tips
• Chat Box
• Forums

Kode CSS nya

<style type="text/css"> /* ======================= Salam hangat & happy Blogging ======================= */ .gradientbuttons ul{ padding: 3px 0; margin-left: 0; margin-top: 1px; margin-bottom: 0; font: bold 13px Verdana; list-style-type: none; text-align: center; /*set to left, center, or right to align the menu as desired*/ } .gradientbuttons li{ display: inline; margin: 0; } .gradientbuttons li a{ text-decoration: none; padding: 5px 7px; margin-right: 5px; border: 1px solid #778; color: white; border:1px solid gray; background: #3282c2; -moz-border-radius: 8px; /*w3c border radius*/ box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* w3c box shadow */ -moz-border-radius: 8px; /* mozilla border radius */ -moz-box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* mozilla box shadow */ background: -moz-linear-gradient(center top, #a4ccec, #72a6d4 25%, #3282c2 45%, #357cbd 85%, #72a6d4); /* mozilla gradient background */ -webkit-border-radius: 8px; /* webkit border radius */ -webkit-box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* webkit box shadow */ background: -webkit-gradient(linear, center top, center bottom, from(#a4ccec), color-stop(25%, #72a6d4), color-stop(45%, #3282c2), color-stop(85%, #357cbd), to(#72a6d4)); /* webkit gradient background */ } .gradientbuttons li a:hover{ color: lightyellow; } .gradientbuttons ul a:hover { background: #FF0000; transform:rotate(5deg); -moz-transform:rotate(5deg); -webkit-transform:rotate(5deg); -o-transform:rotate(5deg); font-size: 18px;font-family: Viner Hand ITC; }</style> <div class="gradientbuttons"> <ul> <li><a href="http://blogsobat.com/">Home</a></li> <li><a href="http://blogsobat.com/">Game</a></li> <li><a href="http://blogsobat.com/">Facebook</a></li> <li><a href="http://blogsobat.com/">Tips</a></li> <li><a href="http://blogsobat.com/">Chat Box</a></li> <li><a href="http://blogsobat.com/">Forums</a></li> </ul> </div>

• Home
• Game
• Facebook
• Tips
• Chat Box
• Forums

Kode CSS nya

<style type="text/css"> /* ====================== Salam hangat & happy Blogging =======================*/ .gradientbuttons ul{ padding: 3px 0; margin-left: 0; margin-top: 1px; margin-bottom: 0; font: bold 13px Verdana; list-style-type: none; text-align: center; /*set to left, center, or right to align the menu as desired*/ } .gradientbuttons li{ display: inline; margin: 0; } .redtheme li a{ font-size:18px; background: darkred; background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); } .gradientbuttons ul a:hover { background: #FF0000; transform:rotate(5deg); -moz-transform:rotate(5deg); -webkit-transform:rotate(5deg); -o-transform:rotate(5deg); font-size: 18px;font-family: Viner Hand ITC; }</style> <div class="gradientbuttons orangetheme redtheme"> <ul> <li><a href="http://blogsobat.com/">Home</a></li> <li><a href="http://blogsobat.com/">Game</a></li> <li><a href="http://blogsobat.com/">Facebook</a></li> <li><a href="http://blogsobat.com/">Tips</a></li> <li><a href="http://blogsobat.com/">Chat Box</a></li> <li><a href="http://blogsobat.com/">Forums</a></li> </ul> </div>

CSS Menu Pull Up Multi Sub Menu

Masih Tentang CSS yang saya share kali ini Sobat..Coba arahkan cursor Sobat pada demo dibawah.Nah itulah yang saya Share kali ini Cara membuat CSS Menu Pull Up Multi Sub Menu,Untuk Menu ini kelihatan Begitu atraktif dan menarik Dengan menu utama yang memuat beberapa sub-sub menu diatasnya .Bagi Sobat yang berminat untuk mencoba yup.. Langsung aja Kita Menuju TKP.

Berikut Langkah-langkahnya Sobat:

1. Login ke Blog Sobat
2. Masuk Rancangan Pilih tambah gadget HTML/javascript
3. Copy Kode dibawah ini
4. Rubah nama menu-menunya dan Alamt URLnya
5. Untuk membuat posisinya pas sesuaikan kode berwarna merah margin: 0 20px ;
6. Dan Biar lebih menarik Utak-atik pada kode-kode lainnya Sobat
7. Lalu Simpan dan letakkan dibagian Bawah/footter Blog Sobat Atau bisa juga letakkan dibawah kolong tempat tidur... he..he..he..he...becanda Sob  

 Demo CSS Menu Pull Up

• Home
• Menu
  • Cameras
    • Nikon
    • Minolta
    • Pentax
  • Lenses
    • Wide Angle
    • Standard
    • Telephoto
    • Zoom
      • standart
      • large
      • x-large
    • Mirror
    • Non standard
      • Bayonet mount
      • Screw mount
  • Flash Guns
  • Tripods & Monopods
  • Filters
• Services
  • Printing
  • Photo Framing
  • Retouching & Renovation
  • Archiving
• Contacts
  • Support
  • Sales
    • USA
    • Canadian
    • South American
    • European
      • British
        • London
        • Liverpool
        • Glasgow
        • Bristol
          • Redland
          • Hanham
          • Eastville
        • Cardiff
        • Belfast
      • French
      • German
      • Spanish
    • Australian
    • Asian
  • Buying
  • Photographers
  • Stockist
  • General
• Tips n Triks
  • Merayu Cewek
  • Meperkosa Cewek
  • Bercinta
  • Playboy
• Chat Box

Selamat Mencoba Semoga Bermanfaat

<style type="text/css"> /* ================================ Originals Version: http://www.stunicholls.com./ Salam Hangat & Happy Blogging Don't Remove this Code ================================ */ #binkbenks {padding:0; margin:0 ; list-style:none; height:36px;-moz-border-radius: 5px 5px 20px 20px ;;-webkit-border-radius: 5px 5px 20px 20px ;-o-border-radius: 5px 5px 20px 20px ; border:4px inset red; background: black; background: -moz-linear-gradient(center top, #9f9f9f, #686868 25%, #2a2a2a 45%, #686868 85%, #9f9f9f); background: -webkit-gradient(linear, center top, center bottom, from(#9f9f9f), color-stop(25%, #686868), color-stop(45%, #2a2a2a), color-stop(85%, #686868), to(#9f9f9f)); position:relative; z-index:500; font-family:Comic Sans MS;} #binkbenks li.top {display:block; float:left; padding-top:5px;} #binkbenks li a.top_link {display:block; float:left; height:37px; line-height:24px; color:#ddd; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 12px; cursor:pointer;} #binkbenks li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:36px;} #binkbenks li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:36px; background:none;} #binkbenks li a.top_link:hover {color:none; background: url(blank_over.gif) no-repeat;} #binkbenks li a.top_link:hover span {background:none; line-height:29px;} #binkbenks li a.top_link:hover span.down {background:none; line-height:20px;} #binkbenks li:hover > a.top_link {color: grey;} #binkbenks li:hover > a.top_link span {background:none; line-height:24px;} #binkbenks li:hover > a.top_link span.down {background:none) ; line-height:29px;} #binkbenks li:hover {position:relative; -moz-border-radius: 5px 5px 10px 10px;-webkit-border-radius: 5px 5px 10px 10px; ;-o-border-radius: 5px 5px 10px 10px; border:3px inset #fff;background: darkred; background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); } #binkbenks ul, #binkbenks li:hover ul ul, #binkbenks li:hover ul li:hover ul ul, #binkbenks li:hover ul li:hover ul li:hover ul ul, #binkbenks li:hover ul li:hover ul li:hover ul li:hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:5px; padding:0; list-style:none;} #binkbenks li:hover ul {left:0; bottom:40px; top:auto; padding:2px;-moz-border-radius: 5px;-webkit-border-radius: 5px ;-o-border-radius: 5px; border:2px inset red;background:background: black; background: -moz-linear-gradient(center top, #9f9f9f, #686868 25%, #2a2a2a 45%, #686868 85%, #9f9f9f); background: -webkit-gradient(linear, center top, center bottom, from(#9f9f9f), color-stop(25%, #686868), color-stop(45%, #2a2a2a), color-stop(85%, #686868), to(#9f9f9f)); ; white-space:nowrap; width:auto; height:auto; z-index:300;} * html #binkbenks li:hover ul {width:0;} #binkbenks li:hover ul li {display:block; position:relative; float:left; font-weight:normal; clear:left;} #binkbenks li:hover ul li a {display:block; font-size:12px; height:20px; line-height:20px; padding:0 5px; color:#fff; text-decoration:none;} #binkbenks li ul li a.fly {color:#fff; font-weight:bold;} #binkbenks li:hover ul li:hover.fly > a.fly {color:#fff;} #binkbenks li:hover ul li:hover ul, #binkbenks li:hover ul li:hover ul li:hover ul, #binkbenks li:hover ul li:hover ul li:hover ul li:hover ul, #binkbenks li:hover ul li:hover ul li:hover ul li:hover ul li:hover ul {left:-5px; margin-left:100%; bottom:-4px; top:auto; padding:3px;-moz-border-radius: 5px ;-webkit-border-radius: 5px ;-o-border-radius: 5px ; border:3px inset red; white-space:nowrap; width:auto; z-index:500; height:auto;} </style> <ul id="binkbenks"> <li class="top"><a href="URL BLOG SOBAT" class="top_link"><span>Home</span></a></li> <li class="top"><a id="menu" href="URL BLOG SOBAT" class="top_link"><span class="down">Menu</span></a> <ul class="sub"> <li class="fly"><a href="URL BLOG SOBAT" class="fly">Cameras</a> <ul> <li><a href="URL BLOG SOBAT">Nikon</a></li> <li><a href="URL BLOG SOBAT">Minolta</a></li> <li><a href="URL BLOG SOBAT">Pentax</a></li> </ul> </li> <li class="fly"><a href="URL BLOG SOBAT" class="fly">Lenses</a> <ul> <li><a href="URL BLOG SOBAT">Wide Angle</a></li> <li><a href="URL BLOG SOBAT">Standard</a></li> <li><a href="URL BLOG SOBAT">Telephoto</a></li> <li class="fly"><a href="URL BLOG SOBAT" class="fly">Zoom</a> <ul> <li><a href="URL BLOG SOBAT">standart</a></li> <li><a href="URL BLOG SOBAT">large</a></li> <li><a href="URL BLOG SOBAT">x-large</a></li> </ul> </li> <li><a href="URL BLOG SOBAT">Mirror</a></li> <li class="fly"><a href="URL BLOG SOBAT" class="fly">Non standard</a> <ul> <li><a href="URL BLOG SOBAT">Bayonet mount</a></li> <li><a href="URL BLOG SOBAT">Screw mount</a></li> </ul> </li> </ul> </li> <li><a href="URL BLOG SOBAT">Flash Guns</a></li> <li><a href="URL BLOG SOBAT">Tripods & Monopods</a></li> <li><a href="URL BLOG SOBAT">Filters</a></li> </ul> </li> <li class="top"><a id="services" href="URL BLOG SOBAT" class="top_link"><span class="down">Services</span></a> <ul class="sub"> <li><a href="URL BLOG SOBAT">Printing</a></li> <li><a href="URL BLOG SOBAT">Photo Framing</a></li> <li><a href="URL BLOG SOBAT">Retouching & Renovation</a></li> <li><a href="URL BLOG SOBAT">Archiving</a></li> </ul> </li> <li class="top"><a id="contacts" href="URL BLOG SOBAT" class="top_link"><span class="down">Contacts</span></a> <ul class="sub"> <li><a href=""url blog sobat>Support</a></li> <li class="fly"><a href="URL BLOG SOBAT" class="fly">Sales</a> <ul> <li><a href="URL BLOG SOBAT">USA</a></li> <li><a href="URL BLOG SOBAT">Canadian</a></li> <li><a href="URL BLOG SOBAT">South American</a></li> <li class="fly"><a href="URL BLOG SOBAT" class="fly">European</a> <ul> <li class="fly"><a href="URL BLOG SOBAT" class="fly">British</a> <ul> <li><a href="URL BLOG SOBAT">London</a></li> <li><a href="URL BLOG SOBAT">Liverpool</a></li> <li><a href="URL BLOG SOBAT">Glasgow</a></li> <li class="fly"><a href="URL BLOG SOBAT" class="fly">Bristol</a> <ul> <li><a href="URL BLOG SOBAT">Redland</a></li> <li><a href="URL BLOG SOBAT">Hanham</a></li> <li><a href="URL BLOG SOBAT">Eastville</a></li> </ul> </li> <li><a href="URL BLOG SOBAT">Cardiff</a></li> <li><a href="URL BLOG SOBAT">Belfast</a></li> </ul> </li> <li><a href=""url blog sobat>French</a></li> <li><a href="URL BLOG SOBAT">German</a></li> <li><a href="URL BLOG SOBAT">Spanish</a></li> </ul> </li> <li><a href="URL BLOG SOBAT">Australian</a></li> <li><a href="URL BLOG SOBAT">Asian</a></li> </ul> </li> <li><a href="URL BLOG SOBAT">Buying</a></li> <li><a href="URL BLOG SOBAT">Photographers</a></li> <li><a href="URL BLOG SOBAT">Stockist</a></li> <li><a href="URL BLOG SOBAT">General</a></li> </ul> </li> <li class="top"><a id="shop" href="URL BLOG SOBAT" class="top_link"><span class="down">Tips n Triks</span></a> <ul class="sub"> <li><a href="URL BLOG SOBAT">Merayu Cewek</a></li> <li><a href="URL BLOG SOBAT">Meperkosa Cewek</a></li> <li><a href="URL BLOG SOBAT">Bercinta</a></li> <li><a href="URL BLOG SOBAT">Playboy</a></li> </ul> </li> <li class="top"><a id="chatbox" href="URL BLOG SOBAT" class="top_link"><span>Chat Box</span></a></li> </ul>

Auto Image Zoom With CSS Ease-Out

Demonya

Langsung aja Sobat berikut Langkah2 nya ;

COPAS CODE NYA

.post-body img { padding: 8px;-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-o-transform:scale(0.8);-webkit-transition:all 2s ease-out;-moz-transition:all 2s ease-out;-o-transition:all 2s ;opacity:0.4;margin:0 10px 5px 0;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;border:2px inset #424242;box-shadow:0px 0px 30px #fff;-webkit-box-shadow:0px 0px 30px #fff;-moz-box-shadow:0px 0px 30px #fff; } .post-body img:hover{border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;border:2px dotted #FF0000;box-shadow:0px 0px 30px #F80505;-webkit-box-shadow:0px 0px 30px #F80505;-moz-box-shadow:0px 0px 30px #F80505;-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);opacity:1; }

Berikut Cara pemasangannya : Login ke Blog Sobat Pilih Rancangan Lalu Klik Edit HTML Cari kode .post-body img Lalu ganti dengan Kode diatas Bila kode .post-body img tidak ada, Letakkan saja Kodenya, diatas kode ]]></b:skin>

Rubah Variabel2nya dan kode2 warnanya biar lebih menarik Lalu Simpan

Animasi menu pullup

Animasi menu pullup

 Menu Slide/Animation Pullup ini menggunakan CSS3 dibuat untuk menghasilkan animasi dan transisi ketika Mouse diarahkan pada link atau gambar besar horisontal. Gambar latar belakangnya dibagi menjadi tiga bagian gambar vertikal,Dan masing-masing gambar tersebut dibagi lagi menjadi tiga sebelum diupload dan dijadikan background. Gambar dapat shrink sebelum digantikan dengan tiga bagian gambar lainnya dan diikuti dengan menampilkan menu pullup yang dapat bergeser ke bawah di atas gambar dan berhenti membentuk kolom link. Setiap link telah dikaitkan dengan tiga gambar vertikal dengan dikombinasikan dalam satu bagian gambar besar

Langsung aja Sobat Perhatikan Kode dibawah ini 

<style type="text/css"> /* ==================================== Styler : http://cuerosbhelatos.blogspot.com/ Don't Remove This Text =====================================*/ .menuplus {width:600px; height:350px; padding:0; margin:30px; list-style:none; border-radius: 5px 5px 5px 5px;border: 4px inset red; position:relative; z-index:100; background:#000; overflow:hidden;} .menuplus li {float:left; height:400px;} .menuplus ul {padding:0; margin:0; list-style:none; position:absolute; z-index:100; top:0; left:0;} .menuplus ul ul {position:absolute; left:0; top:auto; bottom:900px; width:200px; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out; transition-delay: 1s; -o-transition-delay: 1s; -moz-transition-delay: 1s; -ms-transition-delay: 1s; -webkit-transition-delay: 1s; } .menuplus ul li.p2 ul {left:200px;} .menuplus ul li.p3 ul {left:400px;} .menuplus img {width:200px; height:400px; position:absolute; display:block; opacity:1; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out; } .menuplus ul li {float:left;} .menuplus ul img {width:0; height:0; top:200px; z-index:-1;} .menuplus img.leftPic1 {left:0; top:0; width:200px; height:400px;} .menuplus img.midPic1 {left:200px; top:0; width:200px; height:400px; transition-delay: 0.5s; -o-transition-delay: 0.5s; -moz-transition-delay: 0.5s; -ms-transition-delay: 0.5s; -webkit-transition-delay: 0.5s; } .menuplus img.rightPic1 {left:400px; top:0; width:200px; height:400px; transition-delay: 1s; -o-transition-delay: 1s; -moz-transition-delay: 1s; -ms-transition-delay: 1s; -webkit-transition-delay: 1s; } .menuplus ul img.set1a {top:150px;} .menuplus ul img.set1b {top:150px; transition-delay: 0.5s; -o-transition-delay: 0.5s; -moz-transition-delay: 0.5s; -ms-transition-delay: 0.5s; -webkit-transition-delay: 0.5s; } .menuplus ul img.set1c {top:150px; transition-delay: 1s; -o-transition-delay: 1s; -moz-transition-delay: 1s; -ms-transition-delay: 1s; -webkit-transition-delay: 1s; } .menuplus ul img.set2a {top:250px; transition-delay: 0.5s; -o-transition-delay: 0.5s; -moz-transition-delay: 0.5s; -ms-transition-delay: 0.5s; -webkit-transition-delay: 0.5s; } .menuplus ul img.set2b {top:250px;} .menuplus ul img.set2c {top:250px; transition-delay: 0.5s; -o-transition-delay: 0.5s; -moz-transition-delay: 0.5s; -ms-transition-delay: 0.5s; -webkit-transition-delay: 0.5s; } .menuplus ul img.set3a {top:350px;transition-delay: 0.5s; -o-transition-delay: 1s; -moz-transition-delay: 1s; -ms-transition-delay: 1s; -webkit-transition-delay: 1s; } .menuplus ul img.set3b {top:350px; transition-delay: 0.5s; -o-transition-delay: 0.5s; -moz-transition-delay: 0.5s; -ms-transition-delay: 0.5s; -webkit-transition-delay: 0.5s; } .menuplus ul img.set3c {top:350px;} .menuplus ul img.leftPic {left:100px;} .menuplus ul img.midPic {left:300px;} .menuplus ul img.rightPic {left:500px;} .menuplus .menuInner {width:600px;} .menuplus .menuInner li a {border-radius: 15px 15px 15px 15px;display:block; width:190px; height:30px; padding-left:10px; background: black; background: -moz-linear-gradient(center top, #9f9f9f, #686868 25%, #2a2a2a 45%, #686868 85%, #9f9f9f); background: -webkit-gradient(linear, center top, center bottom, from(#9f9f9f), color-stop(25%, #686868), color-stop(45%, #2a2a2a), color-stop(85%, #686868), to(#9f9f9f)); margin-top:300px; font:bold 14px/30px Comic Sans MS, sans-serif; color:#300; text-align: center; text-decoration:none;} .menuplus li:hover img.leftPic1 {left:100px; top:50px; height:0; width:0;} .menuplus li:hover img.midPic1 {left:300px; top:50px; height:0; width:0} .menuplus li:hover img.rightPic1 {left:500px; top:50px; height:0; width:0;} .menuplus ul li:hover img.leftPic {left:0; top:0; height:400px; width:200px;} .menuplus ul li:hover img.midPic {left:200px; top:0; height:400px; width:200px} .menuplus ul li:hover img.rightPic {left:400px; top:0; height:400px; width:200px;} .menuplus ul li:hover {zoom:1;} .menuplus ul li:hover > a {background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%, #e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to(#f5795d)); color:#fff;} .menuplus ul ul li {height:25px; float:left;} .menuplus .menuInner ul li a {height:25px; line-height:25px; font-weight:normal; color:#fff;} .menuplus ul li:hover ul {top:auto; bottom:400px;} </style> <div id="info"> <ul class="menuplus"> <li class="topLi"><a href="http://alamat blog sobat"></a> <img alt="" class="leftPic1" src="http://i1206.photobucket.com/albums/bb455/binkbenk/images.jpg" /> <img alt="" class="midPic1" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Copyofimages.jpg" /> <img alt="" class="rightPic1" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Copy2ofimages.jpg" /> <ul class="menuInner"> <li class="p1"><a href="http://alamat blog sobat">Game Zone</a> <img alt="" class="leftPic set1a" src="http://i1206.photobucket.com/albums/bb455/binkbenk/IMG_0582-1.jpg" /> <img alt="" class="midPic set1b" src="http://i1206.photobucket.com/albums/bb455/binkbenk/CopyofIMG_0582.jpg" /> <img alt="" class="rightPic set1c" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Copy2ofIMG_0582.jpg" /> <ul> <li><a href="http://alamat blog sobat">Action</a></li> <li><a href="http://alamat blog sobat">Fantasy</a></li> <li><a href="http://alamat blog sobat">Racing</a></li> <li><a href="http://alamat blog sobat">Sport</a></li> </ul> </li> <li class="p2"><a href="http://alamat blog sobat">Rooms &amp; Suites</a> <img alt="" class="leftPic set2a" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Copy2ofWaterlilies.jpg" /> <img alt="" class="midPic set2b" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Copy3ofWaterlilies.jpg" /> <img alt="" class="rightPic set2c" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Copy4ofWaterlilies.jpg" /> <ul> <li><a href="http://alamat blog sobat">Sofware</a></li> <li><a href="http://alamat blog sobat">Healthy</a></li> <li><a href="http://alamat blog sobat">Special Breaks</a></li> <li><a href="http://alamat blog sobat">News day</a></li> <li><a href="http://alamat blog sobat">Chat Box</a></li> </ul> </li> <li class="p3"><a href="http://alamat blog sobat">Tips &amp; Tricks</a> <img alt="" class="leftPic set3a" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Manga-Girl-Mysterious-Black-1-1.jpg" /> <img alt="" class="midPic set3b" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Copyofth_Manga-Girl-Mysterious-Black-1.jpg" /> <img alt="" class="rightPic set3c" src="http://i1206.photobucket.com/albums/bb455/binkbenk/Copy2ofth_Manga-Girl-Mysterious-Black-1.jpg" /> <ul> <li><a href="http://alamat blog sobat">Tips Blogger</a></li> <li><a href="http://alamat blog sobat">Tips Komputer</a></li> <li><a href="http://alamat blog sobat">Tips Menipu Orang</a></li> <li><a href="http://alamat blog sobat">Tips Merayu Cewek</a></li> <li><a href="http://alamat blog sobat">Tips Bercinta</a></li> <li><a href="http://alamat blog sobat">Tips Selingkuh</a></li> </ul></li></ul></li></ul></div>

Mau Menu seperti ini

• Login ke Blog Sobat
• Masuk Rancangan Pilih Ad Gadget HTML/Java script
• Copy Kode Diatas
• Rubah Nama Menu- menunya dan alamat URLnya Pada Warna Biru Juga Gambar Backgroundnya Pada Kode warna kuning
• Selanjutnya Klik Simpan dan Taruh Gadget tadi dibagian footer atau diatas body blog Sobat
• Catatan tidak semua Template Bisa dipasang Menu ini

Keterangan :
Ubah Warna Merah dengan Alamat Blog Sobat
Ubah Warna Biru dengan Foto Background yang ingin Sobat Taruh
Save Widget Dan Lihat Hasil Nya ^_^

Demo Animasi menu pullup

• 
  • Game Zone
    • Action
    • Fantasy
    • Racing
    • Sport
  • Rooms & Suites
    • Sofware
    • Healthy
    • Special Breaks
    • News day
    • Chat Box
  • Tips & Tricks
    • Tips Blogger
    • Tips Komputer
    • Tips Menipu Orang
    • Tips Merayu Cewek
    • Tips Bercinta
    • Tips Selingkuh

Cara Membuat Share Button Yang Bisa di Putar

Masuk ke dalam Login Blog Sobat
Pilih TataLetak > Layout > HTML / Java Script

Masukan Code Widget Berikut Ini ;

<style> #social a:hover {background-color: transparent;opacity:0.7;} #social img { -moz-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } #social img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } </style> <center><div id="social"> <!--Start Rss Icon--> <a title="Grab Our Rss Feed" href=" http://feeds.feedburner.com/PhotographyGalleryEphphathaIndonesia " target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSsDPI_7_erNI1ge1hWLukHVy53I01pZysBm6hgbXb97BbBqC6kTWThMQ82qJjDrSzhNJ_unRyKKK4PEdALM5CFUGzzEGU8tPMUGQ43EjPk3nwnGBPX7KTXsQkH-qeq8cqXTFJEtov8_3P/s1600/RSS-48x48.png" style="margin-right:1px;" alt="Icon"/></a> <!--End Rss Icon--> <!--Start Email Rss Icon--> <a rel="nofollow" title="Get Free Updates Via Email" href="http://feeds.feedburner.com/PhotographyGalleryEphphathaIndonesia" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilFKxQt69rBoagQUEZOux1bqkL26RUJvCVtQ_iww_SAQg0RYP_l16Tc3Saz2iRWzFLbRkpHmos5dKExTM-tFoUyGZ3EDDQ4b73ZDfEF9AdUA0Gy11U0A7RIUtP2Zs9J8xvHwNhY36zZbWG/s1600/RSS-EMAIL-48x48.png" style="margin-right:1px;" alt="Icon"/></a> <!--End Email Rss Icon--> <!--Start Facebook Icon--> <a rel="nofollow" title="Like Our Facebook Page" href="https://www.facebook.com/franky.raymond.jacob" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYWmV89Kzg91pMwanKOAuwV3tdcQvzMYArz4R9rxxSbH-4RWHkMomIn1blDxdwyj2JDVOAByO8lcKVPgW9GEb4P2kMxQE7rJhYQxjzTrPBVzMvNnD0pbLEaaZB7m-gpK_pHImBbNS8AYDm/s1600/FACEBOOK-48x48.png" style="margin-right:1px;" alt="Icon"/></a> <!--End Facebook Icon--> <!--Start Twitter Icon--> <a rel="nofollow" title="Follow Our Updates On Twitter" href="http://twitter.com/RaYMonD_QT " target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9a1dHUJT-WdJaeIdhIm7L7Zrytz0GQc6kF4BRJZYtwSidcQM9mMQkSBxpgrrCiPG00zNG0VXXoasYGD-vTTrrGdHxFhpZ6N91xjg_Tnr0bdNjOlczUPrSJK0yanaFJ4JxCgofFg3FlSXc/s1600/TWITTER-48x48.png" style="margin-right:1px;" alt="Icon"/></a> <!--End Twitter Icon--> <!--Start Google+ Icon--> <a title="Follow Us On Google+" rel="nofollow" href="https://plus.google.com/113739160431780404177 " target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLGeYKUjjJXtbs93juBvIvD79cUnEcZuWsE87L-BaKKrJjzk47kdcq9iHRkY2LAyqzvyt4rqEyDn477YhgdoU1cMkXOZ1bdFo_NUYpNluwqFJf3l4XXw8n8_0tRiuCAlim2CbeBFOralGX/s1600/GOOGLE-PLUS-48x48.png"/></a></div></center>

KETERANGAN ;

Ubah Rss Feed : http://feeds.feedburner.com/PhotographyGalleryEphphathaIndonesia 

Ubah ID FB : https://www.facebook.com/franky.raymond.jacob

Ubah ID Twitter : http://twitter.com/RaYMonD_QT

Ubah ID Google+ : https://plus.google.com/113739160431780404177

 Save Widget Dan Lihat Hasil Nya ^_^

DEMO SHARE BUTTON

Cara Memberi Lagu di Blog Dengan Format SWF

Mhhh. Penasaran kan kenapa disetiap blog yang kita kunjungi ada music yang berputar sendiri. Padahal kita cari dimana asal music itu malah tidak ada. Mauu trik-y seperti apa ?? Ayoo kita next az ke TKP.

Langkah-langkahnya :
1. Pilih lagu kesukaan kalian dalam bentuk format Mp3 dan convert menjadi format Swf. Musik tidak akan berputar di blog secara otomatis jika format musik yang digunakan adalah dalam bentuk format mp3.
Download aplikasi convert mp3 to swf portablenya disini

2. Jika sudah di download solahkan jalankan aplikasi tersebut dan convert musiknya. Jangan lupa untuk mengupload music yang tadi kita convert menjadi swf ke 4shared atau link apa saja yang bisa menyimpan data atau musik kita.  Klik disini jika kalian belum join di 4shared. 

3. Setelah terdaftra upload atau unggah musik format .swf nya, nanti akan muncul notifikasi dan kamu tinggal copas saja link alamat musiknya, kemudian edit kode tersebut, misalnya kode yang kamu dapat yaitu :

http://www.4shared.com/document/cHgCV_kz/Aviation_You_Were_My_Everyth.html
Note : Ganti "document" dengan "embed". dan "html" dengan "swf".
Sehingga hasilnya akan tampak seperti di bawah ini :
http://www.4shared.com/embed/cHgCV_kz/Aviation_You_Were_My_Everyth.swf

4. Setelah mendapatkan URL yang sudah di edit di atas, copas kedalam kode dibawah ini gantikan kode yang berwarna biru dengan url yang tadi jamu dapat dan rubah.

<embed
scr="http://www.4shared.com/embed/cHgCV_kz/Aviation_You_Were_My_Everyth.swf"
autostart="true" loop="true" width="0" heigh="0"/><embed>

Kemudian masukan kedalam blog yang sudah kalian punya, Langkah-langkahnya :
1. Masuk ke Rancangan baru dan pilih HTML
2. Copas link yang sudah kalian rubah tadi ke box rancangan HTML

<embed
scr="http://www.4shared.com/embed/cHgCV_kz/Aviation_You_Were_My_Everyth.swf"
autostart="true" loop="true" width="0" heigh="0"/><embed>

3. Looping boleh true untuk ulang lagu saat selesai dan harap autostart di true saja, agar musiknya langsung play mode.
4. Save dan lakukan peninjauan untuk melihat hasilnya.

Note : Bila lagu tidak muncul mungkin flash bermasalah atau coba main-mainkan width dan heighnya, misalnya angkanya di rubah menjadi 3 dll. Bila masih tidak bisa mungkin bisa restart broowsernya atau restart komputer kalian.

Selesai..
Silahkan selamat mencoba ..... ^_^

Cara Membuat ChatBox Keren

COPY SOURCE CODE DI BAWAH INI

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzODAxMzAzOTc*NTkmcHQ9MTM4MDEzMDU*MjE2MiZwPTUzMTUxJmQ9Jmc9MiZvPTE4NzQyZDU2NmQ2YzQ3MWJhMDk2/Y2RmMzE1Y2EwNmEyJm9mPTA=.gif" /><embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" bgcolor="#000000" width="540" height="405" name="chat" FlashVars="id=201194552" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /><br><small><a target="_BLANK" href="http://xat.com/web_gear/?cb">Get your own Chat Box!</a> <a target="_BLANK" href="http://xat.com/web_gear/chat/go_large.php?id=201194552">Go Large!</a></small><br>

DEMO CHATBOX

Get your own Chat Box! Go Large!

Cara Membuat Like Fanpage Beda Dari Yang Lain Nya

Berikut Cara Membuat Like Fanpage Beda Dari Yang Lain Nya

1. Pertama - tama yang harus anda lakukan adalah login ke account blogger
2. Kemudian masuk ke Dashboard lalu pergi ke Layout/Tata letak
3. Klik Add a Gadget => HTML/JavaScript.

COPY CODE HERE

<!-- FB melayang tombol close --!> <style type='text/css'> #kotak-facebook { position:fixed !important; position:absolute; /* IE6 */ bottom:-1000px; right:10%; margin:0px 0px 0px -182px; width:300px; height:auto; padding:16px; -webkit-box-shadow: 0px 0px 7px #00FF00; -moz-box-shadow: 0px 0px 7px #00FF00; box-shadow: 0px 0px 7px #00FF00; background-color:#000000; font:normal 1em Cambria,Georgia,Serif; color:#00FF00; -webkit-border-top-left-radius: 20px; -webkit-border-bottom-right-radius: 20px; -moz-border-radius-topleft: 20px; -moz-border-radius-bottomright: 20px; border-top-left-radius: 20px; border-bottom-right-radius: 20px;} #kotak-facebook a.close { position:absolute; top:-10px; right:-10px; background:#333; font:bold 16px Arial,Sans-Serif; text-decoration:none; line-height:22px; width:22px; text-align:center; color:#00FF00; border:2px solid #00FF00; -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; cursor:pointer; } </style> <script type='text/javascript'> $(window).bind("load", function() { // animasikan nilai top saat halaman telah selesai dimuat $('#kotak-facebook').animate({bottom:"50px"}, 1000); // hilangkan kotak pesan saat tombol (x) di klik $('a.close').click(function() { $(this).parent().fadeOut(); return false; }); }); </script> <div id='kotak-facebook'> <center><a href="http://archive-doc.blogspot.com/" target="_blank"><img src="http://i838.photobucket.com/albums/zz302/raymond_085/d_group_zpsdb0d0b12.gif" /></a></center> <center>LIKE FANPAGE DIBAWAH INI UNTUK MENDAPATKAN ARTIKEL TERBARU VIA FACEBOOK</center> <br/> <!-- Mulai --!> <iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fsyber.hacker.net&amp;width=290&amp;height=258&amp;colorscheme=dark&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false&amp;appId=223426824353309" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:290px; height:258px;" allowtransparency="true"></iframe><!-- Selesai --!> <a class='close' href='#'>&times;</a> </div>

"SAVE WIDGET DAN LIHAT HASIL NYA,,, "

KETERANGAN :
Warna Merah yang di Blok di ubah ke alamat Link Sobat
Warna Kuning yang di Blok di ubah ke Alamat Link IMG Sobat
Ubah Color Code Yang Di "Garis Bawahi" di Atas Dengan Color Code Sobat Sukai
Untuk Background Color dan Font Text Color dapat Sobat Ganti "Color Code" nya Dengan Cara Click Here

Cara Membuat Link Banner Gambar

COPY CODE HERE

<a href="http://doc-ephphatha.blogspot.com/" target="_blank"><img src="http://i838.photobucket.com/albums/zz302/raymond_085/hacker_editing_community_logo_png_by_najib_by_najib0-d4k5k8l_zpsa80e7cb9.png" /></a>

Keterangan : Ganti Alamat Link di Atas dengan Alamat "Link Blog" dan Alamat "Link Banner"

LIKE FANPAGE DIBAWAH INI UNTUK MENDAPATKAN ARTIKEL TERBARU VIA FACEBOOK
×

Cara Membuat One Click Text Area

COPY CODE

<code><span ><div><form name="copy"><div align="center"><input value="CLICK" onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button"> </div><div align="center"></div><p align="center"><textarea rows="3" cols="30" style="border: 8px inset rgb(104, 104, 204); padding: 0pt 1px; background: rgb(100, 100, 200) none repeat scroll 0% 50%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(255, 255, 255); line-height: 1.5em; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px;" name="txt" wrap="VIRTUAL"> &lt;a href=&quot;http://archive-doc.blogspot.com/&quot; target=&quot;_blank&quot;&gt;&lt;img src=&quot;http://i838.photobucket.com/albums/zz302/raymond_085/d_group_zpsdb0d0b12.gif&quot; /&gt;&lt;/a&gt; </textarea></form></div></span></code>

Demo One Click Text Area

<a href="http://archive-doc.blogspot.com/" target="_blank"><img src="http://i838.photobucket.com/albums/zz302/raymond_085/d_group_zpsdb0d0b12.gif" /></a>

KETERANGAN :

Warna Merah dapat di rubah sesuka hati sobat :) contoh "One Click" "Select All" "Block All" etc
Warna Biru Sobat Isikan TEXT yang ingin Sobat Taruh ::D