إنشاء صفحة اتصل بنا جاهزة | كود اتصل بنا HTML لمدونات بلوجر

إنشاء صفحة اتصل بنا احترافية جاهزة لبلوجر


يبحث العديد من المدونين عن كيفية إنشاء صفحة اتصل بنا جاهزة وكيفية إنشاء نموذج اتصل بنا لمدونة Blogger حيث يعد هذا شرطًا أساسيًا لإرسال مدونة بلوجر لإعلانات Google Adsense حيث توجه مشكلة في النموذج صفحة الاتصال بنا لا تعمل الوم سوف نشرح كيفية إنشاء صفحة اتصل بنا جاهزة HTML فى مدونات بلوجر .

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

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



طريقة إنشاء صفحة اتصل بنا جاهزة HTML فى مدونات بلوجر


 انتقل إلى لوحة تحكم مدونة blogger من القائمة الجانبية في Blogger 
 أدخل الصفحة ثم انقر فوق صفحة جديدة لإضافة صفحة الاتصال بنا إلى المدونة.
 أدخل عنوان الصفحة  ويفضل أن يكون باللغة الإنجليزية  مثل Contact us.
 في الزاوية العلوية اليمنى من الصفحة ، انقر فوق رمز القلم وحدد عرض HTML.
 افحص أي محتوى على الصفحة وأضف رمز HTML للاتصال بنا لمدونة Blogger. 
في قسم إعدادات الصفحة على اليسار ، انقر فوق خيارات ، ثم انقر فوق تعليقات القارئ ، ثم حدد عدم السماح بالتعليقات.
 أيضًا من إعدادات الصفحة على اليسار ، انقر فوق علامة التبويب Custom Robot ، ثم انقر فوق noindex و noarchive و noodp. ثم اضغط على نشر لحفظ التغييرات كما يمكنك مشاهدة تفعيل علامات رؤوس مخصصة لبرامج الروبوت


كود اتصل بنا HTML لمدونات بلوجر جاهز


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

<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>


قم بنسخ الكود وضع id مدونة بلوجر الخاص بك حيث يكون عباره عن رقم فى أخر رابط صفحة بلوجر الرئيسية لمدونتك.


طريقة إضافة صفحة إتصل بنا إلى الصفحة الرئيسية فى مدونة بلوجر


بعد شرح كيفية إنشاء صفحة اتصل بنا جاهزة وإضافة كود HTML الخاص بالاتصال بنا إلى مدونة Blogger ، كل ما تبقى لنا هو كيفية عرض صفحة اتصل بنا على الصفحة الرئيسية للمدونة بحيث يكون موقع الويب الخاص بك جاهزًا لإرسال Google جهاز استشعار الإعلانات.
 1- انتقل إلى التنسيق من القائمة الجانبية للوحة تحكم مدونة 
Blogger - 2 ابحث عن الصفحة في أداة إدارة قالب المدونة الخاصة بك. إذا لم تتمكن من العثور عليها ، يمكنك النقر فوق "إضافة أداة" وتحديد الصفحة من قائمة ملحقات المدونة.
 3- اضغط على الصفحة ستجد جميع الصفحات التي قمت بإنشائها على المدونة ، اختر صفحة اتصل بنا أو نموذج الاتصال ، أو حسب اسمك السابق في هذه الصفحة. 
4- انقر فوق حفظ لحفظ هذه التغييرات ، وسترى أن صفحة نموذج الاتصال الخاصة بك قد ظهرت على الصفحة الرئيسية لمدونتك. لذلك ، في هذه المرحلة ، انتهينا من موضوع كيفية إنشاء صفحة اتصل بنا لمدونة Blogger. إذا واجهتك أي مشاكل أثناء إضافة نموذج الاتصال يمكنك ترك رسالة في التعليقات وسنساعدك في حل المشكلة .
لتحميل بأقصى سرعة أكتب تعليق أسفل الموضوع لمضاعفة سرعة التحميل
يوسف البرلسي
يوسف البرلسي
تعليقات