• انشاء صفحة أتصل بنا بشكل احترافي ومميز




    مرحبا بكم اصدقائي اليوم في تدوينة جديدة احضرت لكم اضافة خاصة وجميله •
    اجعل  مدونتك رائعه ومميزة وفريده من نوعها ومن منى لايريد ان تكون مدونته مميزه ورائعه اذا اليوم سوف اشرح طريقة اضافة صفحة اتصل بنا بشكل احترافي ومميز يحتاج فقط الى تركيز قليل منك نبدا بالشرح



    شرح طريقة التركيب
    1. اذهب الى التخطيط وقم باضافة نموذج اتصال فى الشريط الجانبى " السايدبار "

    2. من داخل القالب ابحث عن ]]></b:skin>  ثم ضع الكود التالي فوقه
    #ContactForm1 {display:none;}
    

    اضغط على حفظ النموذج
     3. انتقل الى قسم الصفحات واضغط على صفحة جديدة ضع في العنوان Contact (يمكنك تغييره للعربية بعد أن تنشر الصفحة) 
    4. انتقل من وضع تأليف الى HTML وضع الكود التالى 


     <div dir="rtl" style="text-align: right;" trbidi="on">
    <form name="contact-form">
    <span style="font-family: cursive,droid arabic kufi;"><i class="fa fa-user"></i> الإسم الكريم </span>
    <input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />  
    
    <span style="font-family: cursive,droid arabic kufi;"><i class="fa fa-envelope"></i> البريد الإلكتروني <span style="background: #595656; border-radius: 3px; color: white; font-family: ge_ss_threeregular; font-size: x-small; font-weight: normal; line-height: normal; margin-left: 5px; padding: 0 3px 3px 3px;"> مهم </span></span> 
    <input id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />  
    
    <span style="font-family: cursive,droid arabic kufi;"><i class="fa fa-pencil"></i> الرسالة <span style="background: #595656; border-radius: 3px; color: white; font-family: ge_ss_threeregular; font-size: x-small; font-weight: normal; line-height: normal; margin-left: 5px; padding: 0 3px 3px 3px;"> مهم </span></span>
    <textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" 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>
    <div class="social_network wow bounceInDown animated" style="visibility: visible;">
    <h3 class="cnt-title">
    وسائل اتصال اخرى</h3>
    <div id="social_networks">
    <ul>
    <li class="sorting-01 facebook" title="Follow us on Facebook"><a href="https://www.blogger.com/blogger.g?blogID=1662072996028568162#" target="_blank"><i class="fa fa-facebook"></i><span class="inv"></span></a></li>
    <li class="sorting-02 youtube" title="Follow us on Youtube"><a href="https://www.blogger.com/blogger.g?blogID=1662072996028568162#" target="_blank"><i class="fa fa-youtube"></i><span class="inv"></span></a></li>
    <li class="sorting-03 twitter" title="Follow us on Twitter"><a href="https://www.blogger.com/blogger.g?blogID=1662072996028568162#" target="_blank"><i class="fa fa-twitter"></i><span class="inv"></span></a></li>
    <li class="sorting-05 googleplus" title="Follow us on Google+"><a href="https://www.blogger.com/blogger.g?blogID=1662072996028568162#" target="_blank"><i class="fa fa-google-plus"></i><span class="inv"></span></a></li>
    <li class="sorting-04 pinterest" title="الرئيسية"><a href="https://www.blogger.com/"><i class="fa fa-home"></i><span class="inv"></span></a></li>
    </ul>
    <div class="other-cnt">
    <div class="phone">
    06 38 897 79 962+ </div>
    <div class="emailtxt">
    assadalqaisi77@gmail.com
    </div>
    </div>
    </div>
    </div>
    </div>
    <style>
    /*  CSS Contact qaisi1web */
    #ContactForm1,#ContactForm1 br{display:none;}
    #ContactForm1_contact-form-name, #ContactForm1_contact-form-email{
    width:96.5%;height:auto;margin:5px auto;padding:10px;background:#fff;color:#444;border:1px solid #e3e3e3;border-radius:3px;transition:all 0.5s ease-out;}
    #ContactForm1_contact-form-email-message{width:96%;height:175px;margin:5px 0;padding:10px;background:#fff;color:#444;font-family:droid arabic kufi;border:1px solid #e3e3e3;border-radius:3px;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:#BEBEBE;}
    #ContactForm1_contact-form-submit {width:100%;font-family:droid arabic kufi;;float:left;background:#fff;color:#aaa;margin:10px auto;vertical-align:middle;cursor:pointer;padding:10px 18px!important;font-weight:700;font-size:14px;text-align:center;text-transform:uppercase;letter-spacing:0.5px;border-radius:3px;background-image:linear-gradient(110deg, #FC4F3F 0%, #FC4F3F 50%, transparent 50%, transparent 100%);background-size:200%;background-position:120% 0;background-repeat:no-repeat;border:1px solid #e3e3e3;transition:all .8s ease, background-position .8s ease, color .8s ease;}
    #ContactForm1_contact-form-submit:hover {color:#fff;background-position:0 0;border-color:#DD4537;}
    #ContactForm1_contact-form-error-message, #ContactForm1_contact-form-success-message{width: 100%;margin-top: 35px;font-family: cursive;font-size: 14px;color: #FFF;
    background: #FC4F3F;}
    .contact-form-error-message-with-border {background: #ED5345;border: none;box-shadow: none;color: #fff;padding: 5px 10px;font-family: cursive;}
    .contact-form-success-message {background:#4fc3f7;border:none;box-shadow:none;color:#fff;}
    img.contact-form-cross {line-height:40px;margin-left:5px;}
    form i.fa.fa-pencil, form i.fa.fa-user,form i.fa.fa-envelope,form i.fa.fa-bars {padding:3px 5px;border-radius:3px;font-weight:normal;font-size:120%;float: right;
      margin-left: 10px;}
    form i.fa.fa-user {background:#7986cb;color:#fff;}
    form i.fa.fa-envelope {background:#ffa726;color:#fff;}
    form i.fa.fa-pencil{background:#FC4F3F;color:#fff;}
    .social_network {margin: 8px -10px;padding: 10px;overflow: hidden;width: 100%;border: 1px solid #eee;border-right: none;border-left: none;border-bottom: none;
    margin-bottom: -10px;}
    h3.cnt-title {font-family: droid arabic kufi;background: #676565;color: #fff;padding: 10px;margin-top: -10px;width: 102%;margin-left: -20px;text-align: center;}
    #social_networks{  text-align: center;display: block;clear: both;padding: 15px;}
    #social_networks ul {display:block;margin:0 auto;padding:0;list-style:none;}
    #social_networks li{text-align:center;display:inline-block;margin:0 5px;width:36px;
    height:36px;transition:All 0.6s ease-out;}
    #social_networks li:hover{color:#eee;cursor:pointer;}
    #social_networks li:hover a{color:#fff;}
    #social_networks li a{display:inline-block;color:#aaa;line-height:36px;font-size:1.2em;transition:All 0.3s ease-out;}
    #social_networks li a:hover{color:#fff;}
    #social_networks li a span{display:none;}
    #social_networks li.facebook,#social_networks li.twitter,#social_networks li.youtube,#social_networks li.googleplus,#social_networks li.pinterest{text-align:center;background:none;cursor:pointer;box-shadow:0 0 0 1px #eee;background-image: linear-gradient(110deg, #FC4F3F 0%, #FC4F3F 50%, transparent 50%, transparent 100%);background-size:200%;background-position:150% 0;background-repeat:no-repeat;
    transition: background-position .4s ease, color .4s ease;}
    #social_networks li a.facebook:hover,#social_networks li a.twitter:hover,#social_networks li a.youtube:hover,#social_networks li a.googleplus:hover,#social_networks li a.pinterest:hover{color:#fff;}
    #social_networks li.facebook:hover,#social_networks li.twitter:hover,#social_networks li.youtube:hover,#social_networks li.googleplus:hover,#social_networks li.pinterest:hover{color:#fff;background-position:0 0;box-shadow:0 0 0 1px #f56954;}
    </style>
    
    الان قم بحفظ الصفحة ومعاينتها ومبروك عليك نموذج اتصل بنا احترافي لمدونتك

    إذا واجهت مشكلة في المظهر لا تتردد في وضعه بالتعليقات . بالتوفيق ...

    مرحبا بكم اصدقائي اليوم في تدوينة جديدة احضرت لكم اضافة خاصة وجميله • اجعل  مدونتك رائعه ومميزة وفريده من نوعها ومن منى لايريد ان ...

    روابط الموضوع للنسخ

    رابط
    HTML
    BBCode
    يسمح بنقل الموضوع لكن مع ذكر المصدر في نهاية الموضوع المنقول ووضع رابط الموضوع الأصلي
    انشاء صفحة أتصل بنا بشكل احترافي ومميز

    مرحبا بكم اصدقائي اليوم في تدوينة جديدة احضرت لكم اضافة خاصة وجميله • اجعل  مدونتك رائعه ومميزة وفريده من نوعها ومن منى لايريد ان ...

    19 تعليقات
    كيف تعلق ؟

    1. استفد منه والله

      ردحذف
      الردود
      1. اتمنى دائما ان تستفيد من مواضيعنا

        حذف
    2. مووووووضوع رائع

      ردحذف
    3. لا يعمل جررب http://tridwn.blogspot.com/p/contact.html

      ردحذف
    4. ممكن الموجود عندك فى المدونة

      ردحذف
    5. اخي ممكن تذخل تتاكد بنفسك http://tridwn.blogspot.com/p/contact.html ابعت رساله

      ردحذف
    6. استاذ اسعد لدى شيئين فى المدونة اتمنى ايجاد لهم حل
      عندما اقوم بانشاء صفحة جديدة تظهر بشكل ردئ هكذا على عكس باقى القالب
      http://www.eishelkora.com/p/blog-page_61.html
      وايضا القالب لا يدعم كتابة الارقام باللغة العربية يعنى عندما اكتب رقم سبعه لايكتب بالانجليزية يكتب بالعربى وهذا امر سيئ

      ردحذف
      الردود
      1. اخي اتمنى المره القادمة ان تضع سؤالك في ركن الاسئله,لانه خارج موضوع التدوينة
        http://qaisi1web.blogspot.com/2015/09/do-you-have-problem-in-blogger.html

        بالنسبه لمشكلة صفحات مدونتك قم بالبحث في قالب مدونتك عن
        هذه الكود
        #main-wrapper {
        overflow: hidden;
        position: relative;
        margin-top: 22px;
        float: right;
        width: 100%;
        }
        واستبدله بهذه

        #main-wrapper {
        overflow: hidden;
        position: relative;
        margin-top: 22px;
        float: right;
        width: 71%;
        }

        اما مشكله الارقام قم بتغير خط مدونتك حتى يعمل بالاجنبي

        حذف
    7. اعتقد انه لايعمل جرب من هنا http://www.eishelkora.com/2016/02/Contact-us.html
      +ان كان يعمل ف اظن انه يذهب الى جميل لاتذهب اى رسائل ال جميل

      ردحذف
      الردود
      1. نعم صديقي سوف يذهب الى الجيميل , الرابط الذي زودتني به لا يعمل

        حذف
    8. اخي ركبته لاكن لا يرسل الرسائل

      ردحذف
      الردود
      1. اخي اقراء الشرح جيدا ولا تنسى ان تضيف نموذج اتصل بنا من صفحة التخطيط

        حذف
    9. غير معرف6/12/2016

      كيف أمسح النمرة والأيميل

      ردحذف
      الردود
      1. لتغير رقم الهاتف ابحث عن 06 38 897 79 962+ وغيره
        لتغير البريد الالكتروني ابحث عن assadalqaisi77@gmail.com وغيره بما تريد

        حذف
    10. السلام عليكم
      الطريقة شغالة ونجحت بس اكو شغلة خطأ الاسم والايميل الكتابة مابي لون يعني بالتحديد يبين النص والرقم والايميل هم نفس الشي بالون الابيض يعني ميبين
      ارجو حل المشكلة وشكرا
      sftu98@gmail.com

      ردحذف
    11. يا اخي زر الارسال لا يعمل

      ردحذف
    12. لو شخص ارسل لي رساله عبر اتصل بها .. اين استطيع ايجادها

      ردحذف

    contact-us

    الاسم

    بريد إلكتروني *

    رسالة *