شرح كامل لكيفيه انشاء صفحه اتصل بنا في بلوجر|كود اتصل بناHTML جاهز لمدونات بلوجر
اهلا و سهلا بكم زوار موقع المتميزalmutamayiz للشروحات الحصريه سوف نتكلم اليوم عن كيفيه انشاء صفحه اتصل بنا في بلوجر تكلمنا الشرح السابق حول كيفيه انشاء مدونه بلوجر من الالف الي الياء استكمالا للشرح الماضي سوف نتعرف اليوم عن كيفيه انشاء صفحه اتصل بنا في بلوجر|كود اتصل بناHTML جاهز لمدونات بلوجر يجب أن تحتوي المدونة على صفحة اتصل بنا. يساعد المستخدمين على الاتصال بمسؤول الموقع والمسؤول. هناك عدة طرق لإضافة صفحة اتصل بنا في Blogger. سيساعدك هذا المنشور في إعداد صفحة اتصل بنا لـ Blogger أو Blogspot . من السهل إضافة HTML لصفحة الاتصال بنا في الصفحة. هناك طريقة للحصول على نموذج اتصال مجاني لـ Blogger على الشريط الجانبي لمدونتك. دعنا نتحقق من كيفية إنشاء صفحة اتصل بنا في Blogger.
كيفيه اضافه صفحة اتصل بنا في مدونات بلوجر Blogger
يمكنك إنشاء صفحة اتصل بنا في Blogger. تريد أن تعرف - كيف تضيف صفحة اتصل بنا في Blogger؟ إنه بسيط للغاية ولا يتطلب خبرة فنية. اتبع فقط الخطوات المعطاه ادناه.
- انتقل إلى لوحة تحكم Blogger > حدد مدونة> تخطيط
- أضف نموذج الاتصال إلى الشريط الجانبي للمدونة
- إخفاء نموذج الاتصال في الشريط الجانبي للمدونة
تحذير: يلزم إضافة نموذج الاتصال إلى مدونتك حتى يعمل نموذج الاتصال هذا على صفحة الاتصال بنا في Blogger. إذا لم تقم بإضافة نموذج اتصال وتحديد خانة الاختيار "إظهار نموذج الاتصال" ، فلن يعمل نموذج الاتصال.
سنخفي نموذج الاتصال لـ Blogger sider باستخدام كود CSS. تحتاج إلى اتباع الخطوات لإخفاء أداة نموذج الاتصال من الشريط الجانبي للمدونة.
أ. انتقل إلى السمات> انقر فوق النقاط الرأسية الثلاثة> تحرير HTML
ب. ابحث عن الكود التالي-
]]></b:skin>
إليك كيفية البحث باستخدام Blogger HTML.
ج. الصق كود CSS التالي فوقه مباشرة.
div # ContactForm1 {display: none! important؛}
تحقق من لقطة الشاشة حول كيفية تنفيذها.
إخفاء نموذج الاتصال لـ Blogger css
د. الآن ، انقر فوق الرمز المرن لحفظ التغييرات.
إخفاء نموذج الاتصال حفظ التغييرات
بعد الانتهاء من جميع الخطوات المذكورة في النقطة الثالثة. سيكون نموذج الاتصال الخاص بك موجودًا في الشريط الجانبي ولكنه لن يكون مرئيًا لزائر المدونة.
بعد ذلك ، انتقل إلى قسم الصفحات
انقر على أيقونة ⊕ البرتقالية لإنشاء صفحة جديدة. (ليست وظيفة)
قم بإنشاء صفحة على بلوجر Blogger واضف اسم اتصل بنااا
4. الصق كود HTML التالي (نموذج صفحة اتصل بنا) وانشر الصفحة. إنه نموذج اتصال أنيق لـ Blogger.
<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>
صفحة اتصل بنا لـ بلوجر Blogger
افتح الصفحة في متصفح الويب الخاص بك وتحقق مما إذا كانت الصفحة تعمل بشكل صحيح ويمكن للمستخدمين إرسال رسائل إليك.
انتقل إلى قسم الصفحات وانقر على أيقونة العين لعرض صفحة الاتصال بنا.
عرض صفحة الاتصال بنا في المدون
اتصل بنا مثال الصفحة
ستبدو صفحة الاتصال بنا الخاصة بـ Blogger مشابهة لهذا المثال.