اهلا وسهلا زوار مدونة مطبخ الاكواد اليوم سنقوم بشرح أضافة نموذج اتصل بنا في مدونات بلوجر فتعتبر هذه الاضافة مهمه جدا من حيث التواصل مع زوار مدونتك وايضا تعتبر مهمه لقبول موقعك في اعلانات قوقل ادسنس .
طريقة اضافة صفحة أتصل بنا لمدونات بلوجر.
وبعد متابعة الشرح خطوة بخطوة ستتمكن من صفحة اتصل بنا احترافية لموقعك.أولاً ، قم بفتح لوحة تحكم بلوجر إضافة نموذج الاتصال إلى مدونتك. في صفحة التخطيط انقر فوق إضافة أداة بعد فتح القائمة ، انقر فوق علامة الجمع في القائمة نموذج جهة الاتصال ، ثم انقر فوق حفظ.
يرجى تخطي هذه الخطوة إذا كنت بالفعل قمت بأضافة نموذج الأتصال Contact Form إلي مدونتك.
بعد ذلك ، انقر فوق "المظهر"> انقر فوق زر "تعديل HTML"> أضف كود CSS التالي قبل </head>
<style type='text/css'>
#ContactForm1,#ContactForm1 br{display:none}
</style>
بعد ذلك انقر على زر حفظ المظهر.
م انقر فوق قائمة الصفحات> ثم انقر فوق زر صفحة جديدة وأضف الكود أدناه في علامة تبويب HTML.
مع التعديل علي الخيارات من القائمة الجانبية مثل الخطوة رقم 3.
<form name="contact-form">
<div class="formcolumn1">
<input id="ContactForm1_contact-form-name" name="name" placeholder="الأسم" size="30" type="text" value="" />
</div>
<div class="formcolumn2">
<input id="ContactForm1_contact-form-email" name="email" placeholder="البريد الألكتروني الألكتروني" size="30" type="text" value="" />
</div>
<div class="formcolumn3">
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="الرسالة" rows="7"></textarea>
</div>
<div class="formcolumn4">
<input class="ripplelink" id="ContactForm1_contact-form-submit" type="button" value="إرسال" />
</div>
<div style="max-width: 100%; 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" type="text/javascript"></script>
<style scoped="" type="text/css">
#ContactForm1,#comments,.post-body form.paypalpay br{display:none}
.post-body form.paypalpay{margin:0;text-align:center}
#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{font-family:'Quicksand',sans-serif;display:inline-block;width:100%;height:auto;margin:10px auto;padding:14px;background:#fff;color:#222;border:1px solid rgba(0,0,0,0.08)}
#ContactForm1_contact-form-email-message{font-family:'Google Sans',sans-serif;width:100%;height:250px;margin:10px auto;padding:14px;background:#fff;color:#222;border:1px solid rgba(0,0,0,0.08)}
#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{background:#fff;outline:none;border-color:rgba(0,0,0,0.18)}
#ContactForm1_contact-form-submit{font-family:'Quicksand',sans-serif;background:#fff;color:#5f6368;font-size:16px;width:161px;height:45px;float:left;padding:0 0 0 20px;margin:10px 0 3px 5px;cursor:pointer;border:none;border-radius:24px;box-shadow:0 1px 2px 0 rgba(60,64,67,0.302),0 1px 3px 1px rgba(60,64,67,0.149);transition:box-shadow .08s linear,min-width .15s cubic-bezier(0.4,0.0,0.2,1)}
.formcolumn4{position:relative}
.formcolumn4:before{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE0QH3li9EIVsqfz0ocALwltPnsuULAuttK3DEJQMRtebGOqMYZ6m1vX9Iafp880V7Kk8a-UdPWRsdOs2_mdqjcnDggdrhIhf4eXSapAhCetrkWJTr78-UqnKTuHMP6DPjgbhhHH6xv6Aj/s1600/mailme.png);background-position:center;background-repeat:no-repeat;background-size:20px;content:'';display:block;height:63px;width:32px;position:absolute;z-index:1;left:15px;top:0}
#ContactForm1_contact-form-submit:hover{background:#fafafb;box-shadow:0 1px 3px 0 rgba(60,64,67,0.302),0 4px 8px 3px rgba(60,64,67,0.149)}
#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{margin-top:35px}
form{color:#888}
.formcolumn1,.formcolumn2{float:left;width:50%}
.formcolumn1,.formcolumn2{margin:0 0 10px 0;padding:0 10px 0 0}
.formcolumn2{padding:0 0 0 10px}
@media only screen and (max-width:768px){.formcolumn1,.formcolumn2{width:100%;padding:0}}
</style>
بعد إضافة كود صفحة اتصل بنا في تبويب html قم بالضغط علي نشر بعد تغير الأسم بما يناسبك.والأن تم إضافة صفحة إتصل بنا إحترافية بشكل جذاب.
هذه هي الطريقة الحديثة لإضافة كود اضافة نموذج اتصل بنا احترافي لمدونات بلوجر ، ونتمنى لك التوفيق ونأمل أن الأداة مفيدة وتم تركيبها بشكل صحيح دمتم سالمين.
تعليقات: 0