Demo
1.Css kodlarımızı ]]</b:skins> kodunun üstüne aşağıdaki kodları eklemek..
2. Yerleşim bölgesinden sidebar kısmına Gadged ekle diyip bloggerin kendi iletişim formunu eklemek.
3. En son kodu </body> üstüne ekliyiceksiniz. ve kaydedip çıkacaksınız. hepsi bu kadar :)
Css kodu
/*Floating Contact Form by BloggerItems.com*/
.ContactForm, .ContactForm .title {
display: none;
}
.floating-ct {
position: fixed;
width: 250px;
right: 0;
bottom: 0;
z-index: 999;
}
.floating-ct-head a {
padding: 5px 10px;
background: #09f;
color: white;
font-weight: bold;
display: inline-block;
*display: block;
zoom: 1;
}
.floating-ct-body {
height: 345px;
background: white;
border: 1px solid #09f;
padding: 10px;
display: none;
}
.floating-ct-head {
text-align: right;
}
.floating-ct-body .ContactForm {
margin: 0;
display: block!important;
}
Body kodunun üstüne
<script type='text/javascript'>
//<![CDATA[
/*Floating Contact Form by BloggerItems.com*/
$('body').append('<div class="floating-ct"><div class="floating-ct-head"><a href="#no-move">Contact</a></div><div class="floating-ct-body"></div></div>');
$('.ContactForm').appendTo('.floating-ct-body');
var slide_up_ct = false;
$('.floating-ct-head a').click(function(){
if (!slide_up_ct) {
slide_up_ct = true;
$('.floating-ct-body').slideDown();
} else {
slide_up_ct = false;
$('.floating-ct-body').slideUp();
}
});
//]]>
</script>
0 yorum: