News Update :

Cara Membuat Buku Tamu dan Lencana FB yang Keren Lagi Imut di Blog

11 April 2010

Mengawali Sebuah coretan ketik di layar  monitor,,,mari kita ucapkan rasa syukur Alhamdulilah kepada Sang Pencipta tentunya Yang telah meberikan kita kesehatan sehingga Q Ingin Bisa Hadir untuk 1 tujuan yg pasti sharing ilmu dan pengalaman nya...untuk  Sobat semua, bersyukur pula atas PR1 nya yg telah diberikan mbh google pada blog ini, baru dua bulan ni blog berkelana di dunia maya, masih muda sekali umurnya udah dikasih PR1 ma mbh google,walaupun di kasih PR1 harus tetep semngat pokoknya...dan berterimakasih sekali, nah  habis trauma dengan kejadian kebaran kemaren kali ini hadir lagi dengan postingan baru tentunya!!!maap yah yang nunggu2 postingan baru lama menunggu!!!sobat bloger semua yang ini pasti semua udah pada tau dan mengerti tentang postingan saya kali ini, akan tetapi jika sobat semua mau buku tamu dan juga lencana FB yang bisa nongol ngilang,,,nongol ngilang dan tentunya bikin hemat tempat lah...dan seterusnya....yang pengen2 ajah silahkan sedot ajah ya...h he..he...he..bagi yang udah tau maap mungkin ni postingan udah basi kok diulang ulang,,,,he...he...yah sekedar sharing ilmu ajah nih...buku tamu dan lencana Facebook udah saya moderasi dengan desain saya sampek berbagai ragam desain saya buat...ampek moh moh pokoknya...untuk itu yuk kita ikuti langkah langkahnya.....


Tapi perlu diketahui sebelumnya sobat harus punya dulu BUKU TAMU entah shoutmix, cbox, shoutbox dan lain sebagainya...pokoknya harus punya dulu.
lansung aja ke TKP di bawah ini :

Silahkan Sobat masuk Tata Letak tambah Gadged kemudian HTML/Java Script dan masuk kan kode di bawah ini :

1. kode bawah ini untuk buku tamu yang ke 1

<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:200px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i846.photobucket.com/albums/ab26/arifins/shotmiqq.gif') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #088A08;
background:#000000;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">

<!-- Isi Dengan buku tamu yang sudah sobat punya? entah dari shoutmix,shoutbox,ataupun cbox dls </iframe>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[close]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>

Keterangan :
*untuk top:20px; :merupakan jarak keatas antara bukutamu dengan sidebar
*untuk height:200px; : merupakan panjang dari Ikon buku tamu
*untuk width:30px; : merupakan jarak kesamping ikon dengan buku tamu
*untuk yang ini http://i846.photobucket.com/albums/ab26/arifins/shotmiqq.gif merupakan tombol/ikon buku tamu...jika sobat mau dibawah ini koleksi nya silahkan diambil
-http://i846.photobucket.com/albums/ab26/arifins/Facebook.png
-http://i846.photobucket.com/albums/ab26/arifins/fb.gif
-http://i846.photobucket.com/albums/ab26/arifins/shotmiqq.gif
-http://i846.photobucket.com/albums/ab26/arifins/shotmiqq.gif
-http://i846.photobucket.com/albums/ab26/arifins/SMIX-1.png
-http://i846.photobucket.com/albums/ab26/arifins/OKE.gif
*untuk yang ini merupakan #088A08 warna garis, sesuaikan dengan beground teplate sobat
*untuk yang ini merupakan warna beground buku tamu #000000 silahkan diganti warna sesuai selera sobat, jika belum tau kode warna silahkan cari tau DISINI
*untuk yang ini silahkan isi dengan buku tamu milki sobat <!-- Isi Dengan buku tamu yang sudah sobat punya? entah dari shoutmix,shoutbox,ataupun cbox dls </iframe>

2. Kode yang kedua untuk lencana FB atau pun buku tamu yang kedua juga bisa

kodenya :

<style type="text/css">
#hitsukeFX{
position:fixed;
top:300px;
z-index:+1000;
}
.hitsukeFXtab{
height:200px;
width:30px; float:left;
cursor:pointer;
background:url('http://i846.photobucket.com/albums/ab26/arifins/fb.gif') no-repeat;
}

.hitsukeFXcontent{ float:left;
border:2px solid #088A08;
background:#000000;
padding:10px;
}

</style> <script type="text/javascript">
function showHidehitsukeFX(){
var hitsukeFX = document.getElementById("hitsukeFX");
var w = hitsukeFX.offsetWidth;
hitsukeFX.opened ? movehitsukeFX(0, 30-w) : movehitsukeFX(20-w, 0);
hitsukeFX.opened = !hitsukeFX.opened;
}

function movehitsukeFX(x0, xf){ var hitsukeFX = document.getElementById("hitsukeFX"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; hitsukeFX.style.right = x.toString() + "px"; if(x0!=xf){setTimeout("movehitsukeFX("+x+", "+xf+")", 10);} }


</script>
<div id="hitsukeFX"> <div class="hitsukeFXtab" onclick="showHidehitsukeFX()"> </div>
<div class="hitsukeFXcontent">

<!-- img src="http://i846.photobucket.com/albums/ab26/arifins/facebook-2.png" <!-- Facebook Badge END -->

<div style="text-align:right">
<a href="javascript:showHidehitsukeFX()"> [close] </a>
</div>
</div>
</div>

<script type="text/javascript"> var hitsukeFX = document.getElementById("hitsukeFX"); hitsukeFX.style.right = (40-hitsukeFX.offsetWidth).toString() + "px"; </script>

keterangan :
*untuk top:300px; :merupakan jarak keatas antara bukutamu dengan sidebar
*untuk height:200px; : merupakan panjang dari Ikon buku tamu
*untuk width:30px; : merupakan jarak kesamping ikon dengan buku tamu
*untuk yang ini http://i846.photobucket.com/albums/ab26/arifins/fb.gif merupakan tombol atau ikon lencana fbnya jika ingin lebih bagus lagi silahkan sobat berkarya sendiri
*untuk yang ini merupakan #088A08 warna garis seuaikan dengan template sobat,agar lebih indah dan menarik
*untuk yang ini merupakan warna beground buku tamu #000000 silahkan diganti warna sesuai selera sobat, jika belum tau kode warna silahkan cari tau DISINI
*untuk yang ini <!-- img src="http://i846.photobucket.com/albums/ab26/arifins/facebook-2.png" <!-- Facebook Badge END --> silahkan isi dengan lencana FB anda, jika sobat belum punya silahkan membuat lencana di Fb sobat , dan perlu diketahui sobat jika sobat membuat lencana Fb untuk sekarang ini gak tau kenapa gak muncul gambar foto seperti punya saya, kenapa bisa begitu...ya gak taulah....!!!tapi sobat pasti bertanya kenapa bisa punyaku ada fotonya? gini saya punya trik seketika itu bikin lencana Fb kok gak muncul2 terus gambarnya, saya akal aja gambar di lencana Fb waktu buat simpan dulu aja gambarnya jadi JPEG dan silahkan sobat simpan di photobucket cari aja kodenya seperti punya ku seperti ni  http://i846.photobucket.com/albums/ab26/arifins/facebook-2.png dan ganti aja kode yang sudah sobat simpan tadi di photobucket,lihat hasilnya...

Seperti Ini Gambar Yang Saya Maksud

Jika masih bingung tinggalkan komentar, udah yah aku udaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaah ngantuk banget niiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiih udah jam02.30 pagi WIT masih ngeposting belum tidur,,,huh ngantuk polll, udah tak bobok dulu by..by..




SELAMAT MENCOBA SEMOGA ANDA BERHASIL

Cara diatas saya dapatkan dari berbagai sumber dan telah saya moderasi sendiri dr Mbah google
Share this Article on :

13 komentar:

Mahapatih allways mengatakan...

bleh gag q copy link u/ kalimat yg berkilau-kilau i2 kak?
:)
bleh ia....

Q Ingin Bisa mengatakan...

Mahapatih@selamat datng di blog simpel ku sobat, apa yang sobat mau jika posting diatas bermanfaat silahkan di ambil ajah boleh kok....he...he...

- mengatakan...

Hmm, sepertinya boleh juga dicoba. Terima kasih...

kolom ponsel mengatakan...

Mantap sob !, dicoba dl ya..

Q Ingin Bisa mengatakan...

eka@saya ucapkan selamat datang di blog simple saya, artikel diatas jika berguna buat sobat silahkan dicoba,ok salam kenal dari saya
kolom ponserl@ok sob coba ajah, jika butuh bantuan silahkan tanya

KeNTHUZ mengatakan...

Salam knal sob

fairus mengatakan...

saya nggak paham. tolong panduan untuk orang awan dan kalo perlu disertai gambar

WARUENG ONLINE mengatakan...

wah mantap gan q sedot dlu dah!!!hehe
oh ya mari maen2 ke blog q hanya di www.waruengonline.co.cc
tapi maaf mash dalam Under Construction

Unknown mengatakan...

gmna sic caranya?

Q Ingin Bisa mengatakan...

taufan@caranya ya seperti diatas sob, silahkan di coba dulu jika lom berhasil silahkan datang kemari untuk bertanya

BlUe mengatakan...

mantap..salkomsel

KISAH KU mengatakan...

(y) ka

KISAH KU mengatakan...

mantaaapppp :)

Posting Komentar

Assalamu'alaikum sobat semua...jika sobat sudah mampir di blog saya jangan lupa komentarnya ya,,,mohon saran dan kritiknya, karena setetes komentar anda sangat berarti untuk kemajuan blog ini, Terima kasih semua. SALAM BLOGGER

 

© Copyright Q Ingin Bisa 2010 -2011 | Design by Herdiansyah Hamzah | Published by Borneo Templates | Powered by Blogger.com.