Cara Membuat Icon Tombol Kembali Ke Bawah

Minggu, 16 Juni 2013
Posted by Unknown



Sekedar Sharing - Sebelumnya Saya telah posting tutorial  Cara Membuat  Tombol Kembali Ke Atas Di Blog. Dan sekarang saya akan posting Cara Membuat Icon Tombol  Kembali Ke Bawah . untuk membuatnya ikuti langkah berikut ini :

- Pertama Login dulu ke akun blog sobat
- Kemudian masuk ke bagian Tata Letak
- Lalu tambahkan Gadget HTML/Javascript
- Dan Masukan kode berikut :

<!-- Sekedarsharing2.blogspot.com -- >
<div style="display:scroll; position:fixed; top:50px; right:-6px;"> <a href='#footer' title='Ke bawah halaman'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbWkXL8AvVTCldio3A9rI-Lg4A1FCg-T0PLtaPBjE_GLLTBLapssLICtErgN4lBnND3zd3nj4FivUzCBnOqebWtg4zOdxIHVqtvLjSCH25i8ghEanjTc4CWYb2Z1qfTeb6TsDfA957qKpV/s1600/Back_to_bottom.png" /></a><br /> </div> 
<!-- Sekedarsharing2.blogspot.com -- >

- Simpan dan lihat hasilnya

Semoga Bermanfaat !





Sekedar Sharing - Cara Membuat Icon Tombol Kembali Ke Atas Di Blog. Tombol ini berfungsi agar memudahkan pengunjung untuk kembali ke atas halaman pada blog kita. ada baiknya kita membuat tombol otomatis . untuk membuatnya ikuti langkah berikut ini :

- Pertama Login dulu ke akun blog sobat
- Kemudian masuk ke bagian Tata Letak
- Lalu tambahkan Gadget HTML/Javascript
- Dan Masukan kode berikut :

<!-- Sekedarsharing2.blogspot.com -- >
<span style=" red=""><div style="display:scroll; position:fixed; bottom:50px; right:-6px;"> <a href='#' title='Ke Atas halaman'><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjVh_Y0NH_4uF-yfNeJ3uzhuwJeZRXn1iV0g79KbzgHSAywEChOSK-d877UX3qOAth8QyNvV77fttA6uuTf-vziw53S0ppIQ3GeBPCY_yUJw0YN2zVcj970gczznPvO2JTTuTg_voM81qP/s1600/Back_to_top.png" /></a><br /> </div>
<!-- Sekedarsharing2.blogspot.com -- >


- Setelah itu jangan lupa di Simpan dan lihat hasilnya

Semoga Bermanfaat !





Sekedar Sharing - Cara Membuat Widget Monyet Lucu Ngumpet Di Blog . Widget Lucu Monyet ngumpet, apabila di serang pake kursor maka monyet itu akan ngumpet ketakutan,, hhee lucu banget sob.







silahkan bagi yang ingin nyoba. ikuti Langkah - Langkah Sebagai Berikut :

- Login ke akun blog sobat
- Klik template >> Edit HTML
- Kemudian cari kode </body>, lalu letakan kode dibawah ini tepat diatas kode tadi.

<a href='http://sekedarsharing2.blogspot.com/'>
<div id='namanyayoyo' style='position:fixed;bottom:50px;left:0;z-index:1'><embed bgcolor='#FFFFFF' height='125' id='mymovie' name='mymovie' quality='high' src='http://www.cute-factor.com/animation/yoyocici/yoyoduo.swf' style='' type='application/x-shockwave-flash' width='50' wmode='transparent'/></div></a>

- Kemudian Simpan Template

Semoga Bermanfaat !


Sumber : Om Google


Sekedar Sharing - Cara Membuat Loading Blog Keren. Kali Ini Sobat Sekedar Sharing akan Men Share Tutorial Membuat Loading Keren dan menarik di Blog. Loading ini sangat bagus bagi para Blogger yang suka Hal-hal yang menarik untuk mempercantik Blogger. ada 2 warna yaitu Merah sama Biru, Tapi Terserah Sobat Pilih Sesuai Selera.
udahl jangan kebanyakan cing-cong hheee, kita langsung aja ke Langkah-Langkahnya :

Sebelum Melakukan Perubahan Di harap membacup terlebih dahulu.

Untuk Loading Yang Berwarna Merah

- Langkah Pertama Login Dulu Ke akun sobat.
- Klik Template >> Edit HTML
- Masukan Kode CSS berikut ini di atas ]]></b:skin>

#loadhalaman {position:fixed;opacity:0.93;top:0;left:0;background-color:#000;z-index:9999;text-align:center;width:100%;height:100%;padding-top:20%;color:#000;display:none;}
.loadball {background-color: transparent;border:5px solid rgb(240 ,0 , 0);border-right:5px solid transparent;border-left:5px solid transparent;border-radius:50px;box-shadow: 0 0 35px rgb(255 ,0 , 0);width:50px;height:50px;margin:0 auto;-moz-animation:spinPulse 1s infinite ease-in-out;-webkit-animation:spinPulse 1s infinite linear;}
.loadball-2 {background-color: transparent;border:5px solid rgb(240 ,0 , 0);border-left:5px solid transparent;border-right:5px solid transparent;border-radius:50px;box-shadow: 0 0 15px rgb(255 ,0 , 0);width:30px;height:30px;margin:0 auto;position:relative;top:-50px;-moz-animation:spinoffPulse 1s infinite linear;-webkit-animation:spinoffPulse 1s infinite linear;}
@-moz-keyframes spinPulse {0% { -moz-transform:rotate(160deg); opacity:0; box-shadow:0 0 1px rgb(255, 0, 0)}50% { -moz-transform:rotate(145deg); opacity:1; }100% { -moz-transform:rotate(-320deg); opacity:0; }}
@-moz-keyframes spinoffPulse {0% { -moz-transform:rotate(0deg); } 100% { -moz-transform:rotate(360deg); }}
@-webkit-keyframes spinPulse {0% { -webkit-transform:rotate(160deg); opacity:0; box-shadow:0 0 1px rgb(255, 0, 0)} 50% { -webkit-transform:rotate(145deg); opacity:1;} 100% { -webkit-transform:rotate(-320deg); opacity:0; }}
@-webkit-keyframes spinoffPulse {0% { -webkit-transform:rotate(0deg); } 100% { -webkit-transform:rotate(360deg); }}

- Kemudian tambahkan kode Jquery ini diatas kode </head, jika dalam template sudah terpasang Jquery maka tidak perlu lagi tambahan Jquery tersebut, agar proses efek loading lancar.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>

- dan langkah yang terakhir, pasang kode berikut diatas tag </body>

<div id='loadhalaman'>
<div class='loadball'/>
<div class='loadball-2'/>
</div>
<script type='text/javascript'>
$(function() {
var siteURL = &quot;http://&quot; + top.location.host.toString();
var $internalLinks = $(&quot;a[href^=&#39;&quot;+siteURL+&quot;&#39;], a[href^=&#39;/&#39;], a[href^=&#39;./&#39;], a[href^=&#39;../&#39;]&quot;);
$internalLinks.click(function() {
$(&#39;#loadhalaman&#39;).fadeIn(1500).delay(6000).fadeOut(1000);
});

// Hilangkan overlay saat diklik untuk mengatasi gangguan, terutama jika link internal diset dengan target=&#39;_blank&#39;
$(&#39;#loadhalaman&#39;).click(function() {
$(this).hide();
});
});

</script>



- Jangan Lupa Simpan Template

Untuk Loading Yang Berwarna Biru 

untuk caranya sama seperti merah

Kode HTML

<div class="ball"></div>
<div class="ball1"></div>

Kode CSS

 .ball {
background-color: rgba(0,0,0,0);
border:5px solid rgba(0,183,229,0.9);
opacity:.9;
border-top:5px solid rgba(0,0,0,0);
border-left:5px solid rgba(0,0,0,0);
border-radius:50px;
box-shadow: 0 0 35px #2187e7;
width:50px;
height:50px;
margin:0 auto;
-moz-animation:spin .5s infinite linear;
-webkit-animation:spin .5s infinite linear;
}
.ball1 {
background-color: rgba(0,0,0,0);
border:5px solid rgba(0,183,229,0.9);
opacity:.9;
border-top:5px solid rgba(0,0,0,0);
border-left:5px solid rgba(0,0,0,0);
border-radius:50px;
box-shadow: 0 0 15px #2187e7;
width:30px;
height:30px;
margin:0 auto;
position:relative;
top:-50px;
-moz-animation:spinoff .5s infinite linear;
-webkit-animation:spinoff .5s infinite linear;
}
@-moz-keyframes spin {
0% { -moz-transform:rotate(0deg); }
100% { -moz-transform:rotate(360deg); }
}
@-moz-keyframes spinoff {
0% { -moz-transform:rotate(0deg); }
100% { -moz-transform:rotate(-360deg); }
}
@-webkit-keyframes spin {
0% { -webkit-transform:rotate(0deg); }
100% { -webkit-transform:rotate(360deg); }
}
@-webkit-keyframes spinoff {
0% { -webkit-transform:rotate(0deg); }
100% { -webkit-transform:rotate(-360deg); }
}


Semoga Bermanfaat !!


Sumber : Om Google

Sekedar Sharing - Cara Membuat Popular Post Tampil Keren. Kali ini Sekedar Sharing akan Share sebuah tutorial yaitu Membuat Tampilan Popular Post menjadi keren dan Menarik.
Langsung aja Kita Lihat ScreenShootnya :





Dan Berikut adalah Langkah-Langkah Untuk Membuatnya :

- Langkah Pertama Login Ke akun Blogger Sobat
- Kemudian Masuk Dasbor >> Tata Letak >> Tambah Gadget >> HTML/Javascript
- Lalu Masukan Kode Di Bawah ini

<!-- Sekedarsharing2.blogspot.com -->

<script
language='Javascript'>document.write(unescape('%3C%73%74%79%6C%65%3E%0A%2E%50%6F%70%75%6C%61%72%50%6F%73%74%73%20%2E%69%74%65%6D%2D%74%69%74%6C%65%7B%64%69%73%70%6C%61%79%3A%6E%6F%6E%65%7D%0A%2E%50%6F%70%75%6C%61%72%50%6F%73%74%73%20%75%6C%20%6C%69%20%7B%62%61%63%6B%67%72%6F%75%6E%64%3A%20%6E%6F%6E%65%20%72%65%70%65%61%74%20%73%63%72%6F%6C%6C%20%30%20%30%20%74%72%61%6E%73%70%61%72%65%6E%74%3B%66%6C%6F%61%74%3A%20%6C%65%66%74%3B%6C%69%73%74%2D%73%74%79%6C%65%3A%20%6E%6F%6E%65%20%6F%75%74%73%69%64%65%20%6E%6F%6E%65%3B%6D%61%72%67%69%6E%3A%20%33%70%78%20%21%69%6D%70%6F%72%74%61%6E%74%3B%70%61%64%64%69%6E%67%3A%20%30%20%21%69%6D%70%6F%72%74%61%6E%74%3B%7D%0A%2E%50%6F%70%75%6C%61%72%50%6F%73%74%73%20%75%6C%20%6C%69%20%69%6D%67%20%7B%70%61%64%64%69%6E%67%3A%33%70%78%3B%62%61%63%6B%67%72%6F%75%6E%64%3A%23%66%65%66%65%66%65%3B%2D%77%65%62%6B%69%74%2D%62%6F%78%2D%73%68%61%64%6F%77%3A%30%20%31%70%78%20%31%70%78%20%23%33%65%37%38%62%33%3B%2D%6D%6F%7A%2D%62%6F%78%2D%73%68%61%64%6F%77%3A%30%20%31%70%78%20%31%70%78%20%23%33%65%37%38%62%33%3B%62%6F%78%2D%73%68%61%64%6F%77%3A%30%20%31%70%78%20%31%70%78%20%23%33%65%37%38%62%33%3B%66%6C%6F%61%74%3A%6C%65%66%74%3B%6D%61%72%67%69%6E%3A%30%20%36%70%78%20%30%20%30%3B%70%6F%73%69%74%69%6F%6E%3A%72%65%6C%61%74%69%76%65%3B%6F%76%65%72%66%6C%6F%77%3A%68%69%64%64%65%6E%3B%2D%77%65%62%6B%69%74%2D%62%6F%72%64%65%72%2D%72%61%64%69%75%73%3A%31%30%30%70%78%3B%2D%6D%6F%7A%2D%62%6F%72%64%65%72%2D%72%61%64%69%75%73%3A%31%30%30%70%78%3B%62%6F%72%64%65%72%2D%72%61%64%69%75%73%3A%31%30%30%70%78%3B%20%2D%6F%2D%74%72%61%6E%73%69%74%69%6F%6E%3A%61%6C%6C%20%31%2E%35%73%20%65%61%73%65%3B%2D%6D%6F%7A%2D%74%72%61%6E%73%69%74%69%6F%6E%3A%61%6C%6C%20%31%2E%35%73%20%65%61%73%65%3B%2D%77%65%62%6B%69%74%2D%74%72%61%6E%73%69%74%69%6F%6E%3A%61%6C%6C%20%31%2E%35%73%20%65%61%73%65%7D%0A%2E%50%6F%70%75%6C%61%72%50%6F%73%74%73%20%75%6C%20%6C%69%20%69%6D%67%3A%68%6F%76%65%72%20%7B%70%61%64%64%69%6E%67%3A%33%70%78%3B%62%6F%72%64%65%72%2D%72%61%64%69%75%73%3A%35%70%78%3B%2D%6F%2D%74%72%61%6E%73%66%6F%72%6D%3A%73%63%61%6C%65%28%31%2E%32%29%20%20%74%72%61%6E%73%6C%61%74%65%28%30%70%78%29%3B%2D%6D%6F%7A%2D%74%72%61%6E%73%66%6F%72%6D%3A%73%63%61%6C%65%28%31%2E%32%29%74%72%61%6E%73%6C%61%74%65%28%30%70%78%29%3B%2D%77%65%62%6B%69%74%2D%74%72%61%6E%73%66%6F%72%6D%3A%73%63%61%6C%65%28%31%2E%32%29%74%72%61%6E%73%6C%61%74%65%28%30%70%78%29%3B%2D%6F%2D%74%72%61%6E%73%69%74%69%6F%6E%3A%61%6C%6C%20%31%2E%35%73%20%65%61%73%65%3B%2D%6D%6F%7A%2D%74%72%61%6E%73%69%74%69%6F%6E%3A%61%6C%6C%20%31%2E%35%73%20%65%61%73%65%3B%2D%77%65%62%6B%69%74%2D%74%72%61%6E%73%69%74%69%6F%6E%3A%61%6C%6C%20%31%2E%35%73%20%65%61%73%65%3B%2D%6D%6F%7A%2D%62%6F%78%2D%73%68%61%64%6F%77%3A%20%30%70%78%20%30%70%78%20%35%30%70%78%20%23%35%35%35%35%35%35%3B%2D%77%65%62%6B%69%74%2D%62%6F%78%2D%73%68%61%64%6F%77%3A%30%70%78%20%30%70%78%20%35%30%70%78%20%23%35%35%35%35%35%35%3B%62%6F%78%2D%73%68%61%64%6F%77%3A%20%30%70%78%20%30%70%78%20%35%30%70%78%20%23%35%35%35%35%35%35%3B%7D%0A%3C%2F%73%74%79%6C%65%3E%0A%3C%64%69%76%20%73%74%79%6C%65%3D%22%70%6F%73%69%74%69%6F%6E%3A%20%66%69%78%65%64%3B%20%62%6F%74%74%6F%6D%3A%20%30%70%78%3B%20%72%69%67%68%74%3A%20%30%70%78%3B%22%3E%0A%3C%61%20%68%72%65%66%3D%22%68%74%74%70%3A%2F%2F%68%65%72%6D%61%6E%62%61%67%75%73%2E%62%6C%6F%67%73%70%6F%74%2E%63%6F%6D%22%20%72%65%6C%3D%22%64%6F%66%6F%6C%6C%6F%77%22%20%74%61%72%67%65%74%3D%22%5F%62%6C%61%6E%6B%22%20%73%74%79%6C%65%3D%22%6D%61%72%67%69%6E%2D%74%6F%70%3A%2D%32%35%70%78%22%3E%2E%3C%2F%61%3E%0A%3C%61%20%68%72%65%66%3D%22%68%74%74%70%3A%2F%2F%68%65%72%6D%61%6E%62%61%67%75%7A%2E%62%6C%6F%67%73%70%6F%74%2E%63%6F%6D%22%20%72%65%6C%3D%22%64%6F%66%6F%6C%6C%6F%77%22%20%74%61%72%67%65%74%3D%22%5F%62%6C%61%6E%6B%22%20%73%74%79%6C%65%3D%22%6D%61%72%67%69%6E%2D%74%6F%70%3A%2D%32%35%70%78%22%3E%2E%3C%2F%61%3E%0A%3C%2F%64%69%76%3E'));</script>

<!-- Sekedarsharing2.blogspot.com -->

- Jangan Lupa Simpan

Semoga Bermanfaat !



Sumber : Om Google
Selamat Datang Di Blog Saya
English French German Spain Italian Dutch

Russian Portuguese Japanese Korean Arabic Chinese Simplified

Flag Counter

Statistik

Diberdayakan oleh Blogger.

Copyright © 2013 Sekedar Sharing - Edited By |Imam Ainudin Firmansyah | 12.12.6815