Blogger Açılır İletişim Kutusu

İletişim formu tüm siteler için gerekli olan bir eklentidir. Bu eklentimizde blogger sitemiz için sağ alt köşede açılır bir iletişim kutusu yapmak eminimki ziyaretçilerinizin sizinle iletişime geçmesi daha kolaylaşacaktır.bu eklentimiz için öncelikle..aşağıdaki bilgileri inceliyerek sırasıyla gerçekleştirmek.

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: 285px;
 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>

Bu Yazıyı Beğendinizmi?