الرئيسية إضافات انشاء صفحه اتصل بي بشكل اكثر من رائع لبلوجر

انشاء صفحه اتصل بي بشكل اكثر من رائع لبلوجر

انشاء صفحه اتصل بي بشكل اكثر من رائع لبلوجر

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


  • الشكل الجديد لصفحة الأتصال بنا  Contact-Form :-  هنالك اكثر من كود جاهز اتصال بنا ولكن ما يهمنا هو الشكل بالطبع جميعنا نريد ان نجعل مواقعنا مريحه وجميله للزوار لذلك الاضافة التي سوف نضيفها الى مدونة  بلوجر blogger أضافة فريده من نوعها لن ترى مثلها في بقية مدونات  


                                للمعاينة اضغط هنا


طريقه التركيب 

  1. ننشاء صفحه جديده
  2.  نغير الوضع من تاليف اليHTML  
  3. احذف اي كود موجود ومن ثم كتابه الكود التالي


<div dir="rtl" style="text-align: right;" trbidi="on">
<div dir="rtl" style="text-align: right;" trbidi="on">
<div class="contact_form"><div class="contact_form-left"><div class="form" style="float: left;">ضع رسالتك هنا<div class="widget ContactForm" id="ContactForm2"><div class="contact-form-widget"><div class="form"><form name="contact-form">أسمك<input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" />أيميلك *<input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />رسالتك *<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
<input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="أرسال" /><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></form></div></div></div></div></div><div class="contact_form-right"><div style="float: left;"><div dir="ltr" style="text-align: left;" trbidi="on"><div class="asidebar" style="clear: both; text-align: left;"><a href="http://www.compromath.com/p/about.html" imageanchor="1"><img border="0" src="https://scontent-cai1-1.xx.fbcdn.net/v/t1.0-9/22815376_1958706037787588_6869139813003492978_n.jpg?_nc_cat=0&amp;oh=f23d2c7ee09a11e78530b051b02a84f3&amp;oe=5B719302" /></a></div>
محمد الافندي مدون ومبرمج مصري من القاهره , المنصورهللتواصل معي</div></div><div class="contact-social-title">مشاركة على صفحات تواصل</div><div class="contact-social"><ul><li title="Be Facebook Fan"><a href="http://facebook.com/MElafndey/" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9TwHxStJdOagGklcykPP70awNRaFOYwgbLjvLrmhcyK_x_ioI9cvknh3exHQIX3JzyPQ5bu8VnsBeXdRoTeIgizBU-nqmnCqtK4YVbN8ta32ZRLnzHApIcxQ21TZ13qx-iYag3U7xWtqY/s1600/facebook+icon.png" /></a></li><li title="Follow on Twitter"><a href="https://twitter.com/m7mdelafndey" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYRRJwPwr7OX97gPgS-3bGnKRyFFVFbhWWAQpmp8Dp2UE14ac2zSnlQF0Qs1DUAP6y6HodJNPO_WqYigpFGnxA2B-09D164JSEgZG81siXQBT9UzLYbY9IcdBgZdF7JtlgFNEN6_No7RiS/s1600/twitter+icon.png" /></a></li><li title="Follow on Google Plus"><a href="https://plus.google.com/u/0/103162501711151443618" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2OCuUnikuUQhncvLg0b6M98M7prLSqtkla57AZpov3TgHcSVCnfOmajtQwvSiL-6-9optzeyub7IsI1RLy8GjvPvGZL8v2MdnMnL-EtCdNwKfFZVxUaY2jydOD_01rVuYAPJBEwherWEP/s1600/google+plus+icon.png" /></a></li><li title="Connection on Linkedin"><a href="https://www.linkedin.com/in/mohamed-elafndey-a9aab3b5/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkpz3zz6h13N8ICrAYRslp8Ask95G6gDFzLne1UjAOw1F8h9ciIoT1i1S8XKqocIbYLkU5tBsfeQW8Tjb_TWVVCUojSBPNM7ssENSM1oragjF-feyAcOrNl-km6v5scTCHhUKe3weLazQS/s1600/linkedin+icon.png" /></a></li><li title="Follow on RSS"><a href="https://www.blogger.com/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKmLXMSkUUgaaRxaEBN5EsnWd3QN5O_yRaYSM34RNu34NDp3Em0HURySxIsMd4QrYJ7L1U9j26YjSlHHZ07cIgB1kVywnQZg2J0sD9uSx0012jeJHufoKFKSsqlXovA-4XrxcP5gJpDlFC/s1600/rss+icon.png" /></a></li></ul></div></div></div>
<style>#ContactForm2 {    background: #4b4747;}        .contact_form {    border: 1px solid #f5f5f5;    padding: 0px 10px 20px 0;    overflow: hidden;    background: #e1e1e1;}    .contact_form-left {    padding: 2%;    float: left;    width: 376px;}    .contact_form-right {    width: 278px;    float: left;    padding: 2%;}        .contact-form-widget {    margin: 0 auto;    padding: 5%;    width: 100%;    max-width: 100%;}    .contact-form-email-message {        width: 100%;        max-width: 100%;        margin-bottom: 10px;    }.form p {    color: #5cb85c;}.asidebar img {    border-radius: 70px;    border: 2px solid #949e9e;    width: 57%;    padding: 1%;}.contact-social {    float: left;    background: black;    padding: 5px;    width: 250px;}.contact-social img {    max-width: 40px;}.contact-social ul {    list-style: none;    display: inline;}.contact-social ul li {    float: left;    padding: 4px;}.contact-social ul li a{}.contact-social-title p {    float: left;    background: #191919;    color: #ffdb00;    padding: 3px;}</style></div></div>
طريقه التعديل علي الكود
  1. غير اسم محمد الافندي الي اسمك او اسم مدونتك
  2. مبرمج ومدون مصري غيرها الي اختصاصك
  3. القاهرة ,المنصوره غيرها الي بلدك
  4. غير روابط التواصل الاجتماعي بموقعك الشخصي في الفيس بوك او تويتر وغيره..
الي هنا قد انتهينا نلقاكم في شرح اخر 

0 Comments

الاشتراك في: تعليقات الرسالة (Atom)