أداة إتصل بنا الخاصة ببلوجر المنبثقة من الأسفل

إخواني الكرام كيف حالكم

بعد التطبيق الاول الخاص بأدة إتصل بنا المتطورة وذات الشكل الإحترافي

يمكنك زيارة الموضوع من هنـــــــــــــــــــــــــا

تتوالى الحصريات بشكل آخر لكن هذه المرة ليس في صفحة مستقلة بل على شكل أداة منبثقة من الأسفل

صورة من الأداة

قبل الضغط على زر إتصل بنا

بعد الضغط على زر إتصل بنا

شكل آخر مميز وخفيف وسيعجب الكثير منكم فمثل هذه الطريقة تكون في المواقع الكبرى فقط ;)

المهم لتركيب هذه الخاصية على مدونتك قم بإضافة أداة إتصل بنا ضعها في الفوتر احسن

ثم قم بتحرير قالب مدونتك وابحث عن الوسم التالي ]]></b:skin>

بعد أن تجده ضع فوقه هذا الكود

.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:#0F83A0;
 font-family:tahoma;
 text-size:14px;
 color: white;
 font-weight: bold;
 display: inline-block;
 *display: block;
 zoom: 1;
}
.floating-ct-body {
 height:335px;
 background: white;
 border:5px solid #0F83A0;
 padding: 10px;
 display: none;
}
.floating-ct-head {
 text-align: right;
}
.floating-ct-body .ContactForm {
 margin: 0;
 display: block!important;
}

ثم قم بالبحث مرة أخرى عن الوسم التالي </body>

بعد ان تجده ضع فوقه هذا الكود

<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">إتصل بنا</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>

هذا كل شيئ وتكون إنتهيت من تركيب هذه الخاصية لمدونتك اتمنى ان تكون الطريقة قد لاقت إعجابكم

أي مشكل لا تتردد في طرحه وسنعمل على حله معا بإذن الله

بالتوفيق للجميع ودمتم في رعاية الله وحفظه