عدد مشاهدات الموضوع:
مرحبا بكم فى مدونة أبو إياد لدعم بلوجر, اليوم سنتطرق قليلا الى نماذج الاتصال لأنها حلقة الوصل الفعلية والرسمية بين زائري المدونة وصاحب المدونة أو من يقوم بالإشراف وحل مشكلات الزوار والرد عليها أو سهولة ارسال الزائر رسالة شكر للموقع اذا استفاد منه وكذلك التبليغ عن مشكلة داخل الموقعه.
أحيانا كثرة الأكواد تُفقد مبتدئ بلوجر تركيزة ويفقد نقطة نموذج الاتصال داخل مدونته بالرغم انها نقطة قوية وهامة جدا لبناء مدونة ناجحة. وهنا سنقدم طريقة إضافة نموذج الاتصال المخصص لبلوجر وهو الافتراضي المبين بالصورة الأولى بمقدمة الموضوع ولكن ليس على هيئة إضافة تظهر بكل الموضوعات بل فى صفحة باسم Contact form أو نموذج اتصال ويتم ادراجها فى أداة الصفحات بالأعلى لتكون أمام الزائر دائما لأى تساؤل. والرائع بالإضافة إمكانية إضافتها داخل أى موضوع.
اقرأ أيضا
خمس تصميمات أنيقة لنماذج الاتصال المخصصة لمدونات بلوجر كيف يمكنك أن تنشئ نموذج اتصال مطور باستخدام جوجل درايف خطوة بخطوة
والأن كما عودناكم بشرح سريع بالفيديو على قناتنا الخاصة باليوتيوب شاهد المعاينة والتنفيذ خلال الفيديو التالى
الخطوة الأولى: الدخول الى لوحة تحكم بلوجر الخاصة بك وانشاء موضوع جديد بعنوان نموذج اتصال أو اتصل بنا أو Contact form. وقم بالضغط على الوضع HTML وإضافة الكود التالى كما بالفيديو السابق ونلاحظ جيدا تعطيل التعليقات من إعدادات الموضوع. بعد ذلك نقوم بنشر الموضوع
<form name="نموذج اتصال">
<div dir="rtl" style="text-align: right;">
اسمك :</div>
<div dir="rtl" style="text-align: right;">
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
</div>
<div dir="rtl" style="text-align: right;">
بريدك الالكترونى : <span style="color: red;"> (مطلوب)</span></div>
<div dir="rtl" style="text-align: right;">
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
</div>
<div dir="rtl" style="text-align: right;">
اكتب رسالتك : <span style="color: red;">(مطلوب)</span></div>
<div dir="rtl" style="text-align: right;">
<textarea class="contact-form-email-message" id="ContactForm1_contact-form-email-message" name="email-message" rows="5" style="height: 87px; margin: 2px; width: 213px;"></textarea>
</div>
<div dir="rtl" style="text-align: right;">
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="ارسال" />
</div>
<div style="max-width: 450px; text-align: center; width: 100%;">
<div class="contact-form-error-message" id="ContactForm1_contact-form-error-message">
</div>
<div class="contact-form-success-message" id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
</div>
<div dir="rtl" style="text-align: right;">
اسمك :</div>
<div dir="rtl" style="text-align: right;">
<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />
</div>
<div dir="rtl" style="text-align: right;">
بريدك الالكترونى : <span style="color: red;"> (مطلوب)</span></div>
<div dir="rtl" style="text-align: right;">
<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
</div>
<div dir="rtl" style="text-align: right;">
اكتب رسالتك : <span style="color: red;">(مطلوب)</span></div>
<div dir="rtl" style="text-align: right;">
<textarea class="contact-form-email-message" id="ContactForm1_contact-form-email-message" name="email-message" rows="5" style="height: 87px; margin: 2px; width: 213px;"></textarea>
</div>
<div dir="rtl" style="text-align: right;">
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="ارسال" />
</div>
<div style="max-width: 450px; text-align: center; width: 100%;">
<div class="contact-form-error-message" id="ContactForm1_contact-form-error-message">
</div>
<div class="contact-form-success-message" id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
</div>
الخطوة الثانية: نذهب الى تخطيط Layout ونضيف أداة نموذج إتصال مخصص Contact form كما بالفيديو السابق ونحفظ الأداة. نلاحظ اذا قمنا بمعاينة المدونة بوجود نموذج اتصال كأداة على الجانب أو فى المكان الذي خصصنا الأداة له وكذلك نموذج إتصال داخل موضوع كأى موضوع يتم تدوينة. ولحل هذه المشكلة نقوم بإجراء الخطوة التالية.
الخطوة الثالثة: الذهاب الى قالب ثم تحرير HTML ونبحث عن الكود التالى
]]></b:skin>
اذا لم تستطيع البحث عنه شاهد الفيديو التالى لتتعلم كيفية البحث عنه
حسنا قم بإضافة الكود التالى فوقه لمنع ظهور أداة نموذج الاتصال بصفحات المدونة
#ContactForm1
{
display: none;
}
قم بحفظ القالب وعاين بنفسك :) , الأن يمكنك تغيير تاريخ الموضوع بتاريخ قديم جدا لإخفائة عن الزوار واستخدام رابط الموضوع فى أداة الصفحات ويمكننا إستخدام الكود داخل أى موضوع الأن مثل موضوعات المسابقات وحجز دورات تعليمية وغيرها. أى سؤال ضعه فى تعليقك.. شكر خاص للرائع Nitin Maheta. والأن قم بدعمنا بالإعجاب والنشر لنضمن الاستمرار.
شكرا جزيلا
ردحذفموضوع رائع واستفدت منه بل لقد طبقته في مدونتي
http://alraeyelhour.blogspot.com/
لكن ما أريده الآن هو أن أضع الموضوع ثابتا على الجانب، أي يكون بجانب المشاركة
هل هذا ممكن ؟
ولك جزيل الشكر
لو سمحت يا هندسه ممكن شرح مبسط عن كيفيه اخفاء الموضوع عن الزائرين وايضا كيفيه ربط هذا النموذج بالموضوعات التى تم نشرها من قبل او حتى التى سوف يتم نشرها
ردحذف@الحسين
ردحذفاذا اردت ان تضع الموضوع ثابتا فمن الأولى تقوم باضافة نموذج الاتصال كإضافة عادية على الجانب وسيصبح ثابتا حينها بدون تحويل الزائر الى موضوع به نموذج الاتصال
@Said Ebeid
ردحذفاهلا بيك يا سعيد
بالنسبة لاخفاء اداة معينة عن الزوار
الموضوع دا هيفيدك ان شاء الله
@طريقة ظهور أداة معينة للأدمن وإخفائها عن الزوار على مدونات بلوجر
اما بالنسبة لربط نموذج الاتصال بالموضوعات من الافضل ان تقوم بوضعه أسفل محتوى الموضوع والموضوع دا هيفيدك
@مجموعة أكواد ترشدك الى مكان وضع أدواتك فى قوالب مدونات بلوجر
بانتظار النتيجة
جزاك الله كل خير وهجرب وشكرا لاهتمامك
ردحذفموضوع جميل
ردحذفممكن تعطونا كود اطعم السلاحف
السلام عليكم اخي ممكن طريقة لانشاء صفحة ارسل لنا خبر او مقال وجزاكم الله خيرا
ردحذفشكرا لك تدوينة رائعة
ردحذف