إضافة صفحة إتصل بنا بلوجر ماتريال ديزاين

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

معاينة

نمر إلى الشرح :

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

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

mdwab.blogspot.com/p/blog-page.html

هده طريقة خاطئة لتجنب الرابط افتراضي اكتب عنوان الصفحة بالانجليزية متلا نحن نريد صفحة إتصل بنا سنكتب
Contact-us

لا تكتب اي شيء داخل صفحة تم ضع لها نشر ستلاحظ بعد النشر ان الرابط بهدا الشكل

mdwab.blogspot.com/p/contact-us.html

بعد النشر قم بإعادة تحريرها وغير ما تريد باي لغة

إضافة صفحة إتصل بنا على بلوجر

الان بعد انشاء صفحة نقوم بإضافة كود التالي داخل الصفحة طبعا بضغط على html

<style>/* Contact Form */
#comments{display:none}form{color:#666} #contact-form-mnajiri{margin:auto;max-width:640px} #ContactForm1_contact-form-name,#ContactForm1_contact-form-email{height:auto;margin:5px auto;padding:15px 12px;background:#fff;color:#444;border:1px solid #1d2129;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;width:100%;min-width:100%;transition:all 0.5s ease-out}#ContactForm1_contact-form-email-message{width:100%;height:175px;margin:5px 0;padding:15px 12px;background:#fff;color:#444;border:1px solid #1d2129;box-shadow:inset 0 1px 1px rgba(0,0,0,0.075);border-radius:3px;resize:none;transition:all 0.5s ease-out} #ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{outline:none;background:#fff;color:#444;border-color:#0076fe;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,0.6)}#ContactForm1_contact-form-submit{float:right;background:#0076fe;margin:auto;vertical-align:middle;cursor:pointer;padding:12px 20px;font-size:14px;text-align:center;letter-spacing:.5px;border:0;width:100%;max-width:140px;border-radius:3px;color:#fff;font-weight:500;transition:all .8s ease}#ContactForm1_contact-form-submit:hover{background:#1d2129;color:#fff}#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:100%;margin-top:35px}.contact-form-error-message-with-border{background:#1d2129;border:none;box-shadow:none;color:#fff;padding:5px 0}.contact-form-success-message{background:#4fc3f7;border:none;box-shadow:none;color:#fff}img.contact-form-cross{line-height:40px;margin-right:5px}.post-body input{width:initial}form#contact-form-mnajiri input,textarea{font-family: inherit;}
</style>
<form id="contact-form-mnajiri" name="contact-form">
<input id="ContactForm1_contact-form-name" name="name" placeholder="اسم" size="30" type="text" value="" />
  <input id="ContactForm1_contact-form-email" name="email" placeholder="البريد الإلكتروني" size="30" type="text" value="" />
  <textarea 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="max-width: 222px; text-align: center; width: 100%;">
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
<script src="https://www.blogger.com/static/v1/widgets/2271878333-widgets.js"></script>
<script>//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '7465458308870827208';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d7465458308870827208','//mdwab.blogspot.com/','7465458308870827208');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': 'إرسال...', 'contactFormMessageSentMsg': 'تم ارسال رسالتك.', 'contactFormMessageNotSentMsg': 'Message could not be sent. Please try again later.', 'contactFormInvalidEmailMsg': 'مطلوب عنوان بريد إلكتروني صالح.', 'contactFormEmptyMessageMsg': 'لا يمكن ترك حقل الرسالة فارغًا.', 'title': 'Contact Form', 'blogId': '7465458308870827208', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));
//]]></script>

تم إضغط على تحديث

ما يجب تغيره

غير id مدونة محدد ب أحمر
7465458308870827208
Id خاص بك ستجده على هدا الشكل في لوحة التحكم

غير رابط مدونة محدد بأخضر
mdwab.blogspot.com

و ما بقي لي الا ان اتمنى لك كل التوفيق ونرجو منك أعطانا رايك في إضافة و سلام عليكم ورحمة الله وبركاته ❤️

شارك Share Tweet Share Share Share

انقر هنا

محمد نجيري (mnajiri@) مشرف على مدونة ماتريال ويب تحت الرابط التالي :https://mdwab.blogspot.com/ مند 2018 و أدعوك لمتابعتي عبر حسابي على أنستغرام