إضافة أداة إتصل بنا بشكل جديد وإحترافى

04-28-2015, 02:30 AM

Hady store

مدون جديد

تاريخ التسجيل: Nov 2014

المشاركات: 32

إضافة أداة إتصل بنا بشكل جديد وإحترافى

أنا : Hady store

سجل معنا لتتمتع بهذه الخاصية

بسم الله الرحمن الرحيم || السلام عليكم ورحمة الله وبركاتة

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

معاينة الإضافة

مدونة هادى ستور تنصح باخذ نسخة إحتياطية تحسباً لأى أخطاء لا قدر الله
الدخول على تحرير القالب والبحث عن ]]></b:skin> وضع الكود التالى قبلة مباشرة

اقتباس:

#mbl-contact .ContactForm {
margin: 0px!important;
}
#mbl-contact .contact-form-button-submit {
max-width: none;
width: 100%;
height: 35px;
border: 0;
background-color: #424242;
cursor: pointer;
font:13px;
font-style: normal;
font-weight: 400;
}
.#mbl-contact .contact-form-button-submit:hover {
background-color: #FF9900;
border: 0;
}
#mbl-contact #contact {
position: fixed;
bottom: 0;
right: 1%;
background-color: #EEE;
color: #555;
width: 300px;
z-index: 1.0E+15;
}
#mbl-contact #contact .contact-form-widget {
padding: 30px;
display: none;
}
#mbl-contact #contact {
position: fixed;
bottom: 0;
right: 1%;
background-color: #EEE;
color: #555;
width: 300px;
z-index: 1.0E+15;
}
#mbl-contact #contact h2.title {
margin: 0px;
font-weight: 400;
background-color: #424242;
color: #FFF;
padding: 8px 15px;
font-size: 16px;
cursor: pointer;
letter-spacing: 3px;
text-align: center;
}
#mbl-contact #contact h2.title .fa {
position: absolute;
left: 10px;
top: 12px;
}
#mbl-contact #contact .contact-form-widget {
width: 300px;
padding: 30px;
display: none;
}
#mbl-contact #contact * {
transition: all 0 ease;
-webkit-transition: all 0 ease;
-moz-transition: all 0 ease;
-o-transition: all 0 ease;
}
#mbl-contact #contact .contact-form-name,#contact .contact-form-email,#contact .contact-form-email-message {
text-align: right;
background-color: #DDD;
color: #111;
border: 0;
padding: 5px 5px ;
font: normal normal 13px ;
}
#mbl-contact .contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-widget {
max-width: none;
margin-bottom: 15px;
}

مجدداً نبحث عن الكود التالى <body> ونضع الكود التالى أسفلة مباشرة

اقتباس:

<div id='mbl-contact'>
<b:section class='contact' id='contact' maxwidgets='1' showaddelement='yes'>
<b:widget id='ContactForm2' locked='true' title='إتصل بنا' type='ContactForm'>
<b:includable id='main'>
<b:if cond='data:title != ""'>
<h2 class='title'><i class='fa fa-paper-plane'/> <data:title/></h2>
</b:if>
<div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<input class='contact-form-name' expr:id='data:widget.instanceId + "_contact-form-name"' expr:placeholder='data:contactFormNameMsg' name='name' size='30' type='text' value=''/>
<input class='contact-form-email' expr:id='data:widget.instanceId + "_contact-form-email"' expr:placeholder='data:contactFormEmailMsg' name='email' size='30' type='text' value=''/>
<textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + "_contact-form-email-message"' expr:placeholder='data:contactFormMessageMsg' name='email-message' rows='5'/>
<input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + "_contact-form-submit"' expr:value='data:contactFormSendMsg' type='button'/>
<div style='text-align: center; max-width: 222px; width: 100%'>
<p class='contact-form-error-message' expr:id='data:widget.instanceId + "_contact-form-error-message"'/>
<p class='contact-form-success-message' expr:id='data:widget.instanceId + "_contact-form-success-message"'/>
</div>
</form>
</div>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
<script type='text/javascript'>
//<![CDATA[
$( "#contact h2.title" ).click(function() {$( "#contact .contact-form-widget" ).toggle("fast");});
//]]>
</script>

إحفظ القالب فى رعاية الله

المصدر| مدونة هادى ستور |

إضافة أداة إتصل بنا بشكل جديد وإحترافى | مدونة هادى ستور

__________________

من مواضيع Hady store

05-15-2015, 01:18 PM	#2
Brahim_NaADI مدون جديد تاريخ التسجيل: May 2015 المشاركات: 32	رد: إضافة أداة إتصل بنا بشكل جديد وإحترافى أنا : Brahim_NaADI سجل معنا لتتمتع بهذه الخاصية شكرا لك ............... __________________ من مواضيع Brahim_NaADI الدرس 1 \| دورة الووردبريس: مقدمة الدورة. العرب وأزمة الربح من النت “المواقع تحديدا” (المشاكل والحلول) المفتاح السادس: التوقع “الطريق الى الواقع” المفتاح الثاني: الطاقة “وقود الحياة” أقوى 20 موقع بينج للارشفة السريعة في محركات البحث

05-16-2015, 08:53 PM	#3
Hady store مدون جديد تاريخ التسجيل: Nov 2014 المشاركات: 32	رد: إضافة أداة إتصل بنا بشكل جديد وإحترافى أنا : Hady store سجل معنا لتتمتع بهذه الخاصية أشكرك اخى على مرورك __________________ من مواضيع Hady store قالب Elegant الإحترافى والمطور شرح إضافة كود المشاركات الأكثر تعليقاً لبلوجر إضافة تغذية rss للتدوينات بالسيد بار قالب Hippo mag الإحترافى والمطور من مدونة هادى ستور أكشن blue-evening الجذاب

مواقع النشر (المفضلة)

الكلمات الدلالية (Tags)

أداة, بشكل, إتصل, إضافة

« الموضوع السابق | الموضوع التالي »

الذين يشاهدون محتوى الموضوع الآن : 1 ( الأعضاء 0 والزوار 1)

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

تعليمات المشاركة
لا تستطيع إضافة مواضيع جديدة لا تستطيع الرد على المواضيع لا تستطيع إرفاق ملفات لا تستطيع تعديل مشاركاتك BB code is متاحة الابتسامات متاحة كود [IMG] متاحة كود HTML معطلة قوانين المنتدى

الانتقال السريع

المواضيع المتشابهه
الموضوع	كاتب الموضوع	المنتدى	مشاركات	آخر مشاركة
ازرار المتابعة بشكل جديد وإحترافى	mdwan blog	إضافات وأدوات بلوجر	5	07-02-2013 04:56 PM
إضافة أداة كن من متابعى هذه المدونة بشكل جديد وحصرى	luqmanessam	إضافات وأدوات بلوجر	2	01-19-2013 11:00 AM
إضافة أداة آخر المواضيع لبلوجر بشكل رائع	luqmanessam	دروس بلوجر	0	01-17-2013 09:01 PM
شرح إضافة أداة مواضيع ذات صلة (بشكل صوري) لتقوية الروابط الداخلية على بلوحر	admin	إضافات وأدوات بلوجر	4	08-02-2012 02:34 AM
شرح إضافة أداة مواضيع ذات صلة (بشكل نصي) لتقوية الروابط الداخلية على بلوحر	admin	إضافات وأدوات بلوجر	4	07-29-2012 12:48 AM

إضافة أداة إتصل بنا بشكل جديد وإحترافى

إضافات وأدوات بلوجر