📩 نموذج اتصال احترافي لبلوجر
يمكنك استخدام هذا النموذج لإنشاء صفحة "اتصل بنا" احترافية على مدونتك بلوجر. كل ما عليك هو نسخ الكود التالي، ثم لصقه داخل صفحة ثابتة جديدة. لا تنس تعديل blogId ووضع رقم مدونتك الصحيح.
<div dir="rtl" style="text-align: right;" trbidi="on">
<div id="contact-form">
<form name="contact-form">
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" placeholder="الاسم" size="30" type="text" value="" />
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" placeholder="بريد إلكتروني" size="30" type="text" value="" />
<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="الرسالة" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="إرسال" />
<br />
<div style="text-align: center;">
<div id="ContactForm1_contact-form-error-message"></div>
<div id="ContactForm1_contact-form-success-message"></div>
</div>
</form>
</div>
<style type="text/css">
#contact-form{background:#ececec;padding:10px;box-shadow:0 0 0 1px #d9dce1}
#ContactForm1_contact-form-name,#ContactForm1_contact-form-email,#ContactForm1_contact-form-email-message{
margin:5px auto;border:1px solid #e3e3e3;transition:all .5s ease-out;width:100%;
border-radius:10px;padding:8px 15px;margin-bottom:10px;font-family:'bein',Roboto,sans-serif}
#ContactForm1_contact-form-submit{
border:1px solid #e3e3e3;font:unset;text-shadow:1px 1px 5px #111;
font-weight:700;font-size:14px;padding:5px 15px;background-color:#06de15;
border-radius:5px;color:#fff;font-family:'bein',Roboto,sans-serif;
letter-spacing:1px;cursor:pointer}
#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{
outline:none;border-color:rgba(81,203,238,1);box-shadow:0 0 5px rgba(81,203,238,0.7)}
.contact-form-error-message-with-border{color:#b90000;font-weight:700}
</style>
<script src="https://www.blogger.com/static/v1/widgets/2227587253-widgets.js" type="text/javascript"></script>
<script type="text/javascript">
_WidgetManager._Init('');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo(
'ContactForm1', 'contact-sec', null, document.getElementById('ContactForm1'),
{'contactFormMessageSendingMsg': 'جارٍ الإرسال...',
'contactFormMessageSentMsg': 'تم إرسال رسالتك.',
'contactFormMessageNotSentMsg': 'تعذر إرسال الرسالة، يرجى المحاولة مرة أخرى في وقت لاحق.',
'contactFormInvalidEmailMsg': 'يلزم إدخال عنوان بريد إلكتروني صالح.',
'contactFormEmptyMessageMsg': 'لا يمكن أن يكون حقل الرسالة فارغًا.',
'title': 'نموذج الاتصال',
'blogId': 'ضع هنا id بلوجر الخاص بك',
'contactFormNameMsg': 'الاسم إجباري',
'contactFormEmailMsg': 'بريد إلكتروني إجباري',
'contactFormMessageMsg': 'رسالة',
'contactFormSendMsg': 'إرسال',
'submitUrl': 'https://www.blogger.com/contact-form.do'},
'displayModeFull'));
</script>
</div>
⚠️ تأكد من أنك قمت بوضع رقم معرف المدونة الصحيح مكان blogId. يمكنك إيجاده في شريط الرابط داخل لوحة التحكم بلوجر.
✅ بعد نسخ الكود وتعديله، انتقل إلى صفحات في بلوجر → صفحة جديدة → ثم اختر "HTML" والصق الكود، واضغط "نشر". وهكذا تحصل على صفحة تواصل احترافية وجاهزة بالكامل.