Cara Membuat Shoutmix Tersembunyi

oriCara Membuat Shoutmix Tersembunyi

Mamas Ipenk masih menerangkan seputar Tutorial Blogger yang kali ini membahas tentang Cara Membuat Shoutmix Tersembunyi, kegunaannya adalah agar gedget atau konten kita terlihat terlalu banyak. langsung saja,

Cara Membuat Shoutmix Tersembunyi :

1. Login di blogger dengan ID anda
2. Klik menu Layout
3. Klik Page Elements
4. Klik Add a Page Element
5. Klik ADD TO BLOG pada menu HTML
6. Lalu CopyPaste kode dibawah ini Pada kotak HTML

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhb7KLABUmvo4OUCGNAdzB1O0oJFneGccxYn8aGJ41Dig6B_oMeXJFi360pg7UWCUv8PGQhGj9ajawkBVY1eLe47D9l3VkabH0Jd7LD8TQAVKrKJ9cxGE1ZI8-hrNuPepia6UstL_PDxxCg/') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
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">

< Letakkan disini kode Shoutbox Anda>

<div style="text-align:right">
<a href="http://latihanbae.blogspot.com">
[Tutorial Blogger]
</a>|<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>



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

Note: Warna Merah diganti dengan Kode HTML Shoutmixnya Sobat.

7. Save atau simpan, Selesai

Selamat Mencoba