Assalamualaikum wr.wb.
Pada postiingan kali ini saya akan membahas tentang bagaimana caranya membuat menu sekilas di layar blog anda... jadi anda bisa memudahkan pengunjung untuk melihat profil tanpa menekan tombol apapun....
Jadi kita tinggal geser saja pasti dia akan muncul... untuk contohnya anda bisa lihat di blog ini (geser saja oleh anda menu sekilas di sebelah kiri ..... maka dia akan muncul...
untuk membuatnya ada beberapa cara yang dibutuhkan :
1.Pilih Rancangan -> edit HTML
2.Ceklis tulisan Expand Template widget
3.tekan tombol Ctrl+F
4.cari kata <body>
5.copy pastekan kode berikut dibawah <body>
<style type='text/css'>#info-konoe {z-index: 1000;background:-moz-linear-gradient(top, #1F2326, #000);background: -webkit-gradient(linear, left top, left bottom, from(#1F2326), to(#000));box-shadow:-2px -2px 8px #FF0000, 2px 2px 20px #FF0000;-moz-box-shadow:-2px -2px 8px #FF0000, 2px 2px 20px #FF0000;-webkit-box-shadow:-2px -2px 8px #FF0000, 2px 2px 20px #FF0000;width:400px;position: fixed;top:50px;left:0;margin-left:-330px;border:1px solid #444;background-position:top right no-repeat;height:35px;font:11px Arial;color:#eee;border-top-right-radius:8px;border-bottom-right-radius:8px;-moz-border-radius-topright:8px;-moz-border-radius-bottomright:8px;-webkit-border-top-right-radius:8px;-webkit-border-bottom-right-radius:8px;}#info-konoe{-o-transition: all 1s ease-in;-moz-transition: all 1s ease-in;-webkit-transition: all 1s ease-in;} #info-konoe:hover{width:400px;opacity:1.0;margin-left:0;}.Konoeinbox {border:1px solid #444;width:290px; margin:0px 90px 10px 10px;background:#000;color:#ffffff; border-radius :20px; padding:5px 0;-moz-border-radius:20px; -webkit-border-radius:20px;-o-transition:all 2s ease-in;-moz-transition:all 2s ease-in;-webkit-transition:all 2s ease-in;opacity:0.2;}.Konoeinbox:hover{opacity:1.0;box-shadow:1px 1px 15px #000; -moz-box-shadow: 1px 1px 15px #000; -webkit-box-shadow: 1px 1px 15px #000;background: #000;}.Konoeinbox2 {margin:5px 10px;padding:0px 8px 10px;color:#FFFFFF;overflow:hidden;height:410px;}.Konoe15 {border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;}.Konoe2 ul.bom {margin: 0; padding: 0;}.Konoeinbox2 li {margin-left:20px;}.Konoeinbox2 li a {color: #FFFFF; line-height: 4px; font-size: 11px;font-weight: bold; text-decoration:none;}.Konoeinbox2 li a:hover {color: red;text-shadow: 0 1px 1px #000;}.Konoeinbox2 h2 { font: 18px Droid Serif;font-weight:bold;padding:0 8px;color: #FF0000;text-shadow: 0px 1px 1px #ddd;border-bottom: 1px solid #FF0000;}.Konoetouch {font-size:22px;font-weight:bold;font-family:Arial Narrow;float:right;margin: 3px 10px 0 0;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;text-decoration:blink;}.Konoetouch:hover{-o-transform: scale(2) rotate(720deg) translate(0px);-moz-transform: scale(2) rotate(720deg) translate(0px);-webkit-transform: scale(2) rotate(720deg) translate(0px);color: red;}</style>
<div id='info-konoe'><span class='Konoetouch'>Sekilas</span>
<div class='Konoeinbox'><div class='Konoeinbox2 konoe15'>
<h2>ASSALAMUALAIKUM WR.WB</h2>
Selamat datang di Raafi Ramadhan - Saya Senang dengan anda mengklik informasi ini, berarti anda peduli dengan keberadaan blog ini, saya berharap ini bukan untuk kali pertama anda mengunjungi blog ini.
Mudah-mudahan blog ini bermanfaat.
<h2>Sekilas Tentang Raafi Ramadhan</h2>
<img height='130x' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh844iy1tjnFhFqVrjahYNmwMp0fU1a8sJM0JQuXZP209v3snQs3nsOQa1rkN5Snpb0k3EzOjOGwkLDA7WYDDpOAv3FWS6xpqfD33BY6FKi1E5S66uS805pvvJPYhvE_Ga546WcbQagFw4/s1600/islam+kartun.jpg' width='100px'/>
<p style='text-align:justify'>Nama saya Raafi Ramadhan, Saya seorang pelajar di SMK BPPI Baleendah, kelas X TKJ. Janganlah kau berputus asa dalam melakukan sesuatu karna datangnya kegagalan adalah awal dari kesuksesan.(' ',)</p>
</div>
</div></div>
6.Ganti tulisan berwarna merah sesuai info biodata anda
7.Pada tulisan berwarna biru ganti URL menjadi alamat URL photo anda..
8.Save template kemudian lihat hasilnya.
Tidak ada komentar:
Posting Komentar