2004208294886110954325409063536887128329624670425385324432245973212528005025830060231069210172575973800025421858557245242000716169297327861555

اضافة جميلة نحت الهيدر (اشترك معنا-تابعنا)

السلام عليكم و رحمة الله

عدنا اليكم ياخواني مع اضافة جد جميلة بل روعة ياصديقي هده الاضافة ستضاف تحت الهيدر ويمكنك رؤية متال للاضافة انطلاقا من الصورة


طريقة الاضافة

1.اولا ادهب الى القالب تم الى تحرير html 
2.ابحت عن هدا الكود
"<div class='main-outer'>"
3 بعد ايجاده ضف قبله هدا الكود
"<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='navhead'>
<div id='byard-topsubsbox'>
            <div id='subscriptionsection'>
              <div class='subsbox-heading'>
                اشترك معنا وتوصل بأخر المستجدات !
              </div>
              <form action='http://feedburner.google.com/fb/a/mailverify?uri=pro-ayoub' class='byard-subsbox-form' method='post' target='_new'>
                <input class='topsubsboxname' name='name' onblur='if (this.value == &apos;&apos;) {this.value = &apos;أسمك هنا&apos;;}' onfocus='if (this.value == &apos;أسمك هنا&apos;) {this.value = &apos;&apos;;}' value='أسمك هنا'/>
                <input class='topsubsboxemail' name='email' onblur='if (this.value == &apos;&apos;) {this.value = &apos;ضع إميلك هنا &apos;;}' onfocus='if (this.value == &apos;ضع إميلك هنا ;) {this.value = &apos;&apos;;}' value='ضع إميلك هنا '/>
                <input class='topsubsboxbutton' type='submit' value='أشترك الأن!'/>
              </form>
              <p style='margin-top: 8px;font-size: 14px;text-align: center;font-family: Source Sans Pro;font-style: italic;font-weight: 600;'>
               
              </p>
            </div>
            <div class='socialicons'>
              <div class='socialheading'>
                تابعنا على مواقع التواصل الأجتماعي!
              </div>
              <ul>
                <li>
                  <a href='https://www.facebook.com/BlogProAyoub' rel='nofollow' target='_blank'>
                    <img src='http://3.bp.blogspot.com/-fTm8V4c7I4I/UbmkFgnfuSI/AAAAAAAABeM/hl-VvPTxfWo/s1600/facebook_64.png' title='Facebook'/>
                  </a>
                </li>
                <li>
                  <a href='https://twitter.com/blogproayoub' rel='nofollow' target='_blank'>
                    <img src='http://2.bp.blogspot.com/-jJM83OvIJKM/UbmkGg5pkkI/AAAAAAAABeo/IG-O322i3rI/s1600/twitter_64.png' title='Twitter'/>
                  </a>
                </li>
                <li>
                  <a href='https://plus.google.com/+ayoubboulaich' rel='nofollow' target='_blank'>
                    <img src='http://2.bp.blogspot.com/-2lVQmyWbF5o/UbmkFA6CF8I/AAAAAAAABeA/EseO3zCM5VQ/s1600/google-plus_64.png' title='Google +'/>
                  </a>
                </li>
                <li>
                  <a href='http://feeds.feedburner.com/pro-ayoub' rel='nofollow' target='_blank'>
                    <img src='http://2.bp.blogspot.com/-VmxHGYvYk4M/UbmkF9MBONI/AAAAAAAABeU/IgRVvCJAdGo/s1600/rss_64.png' title='Rss'/>
                  </a>
                </li>
                <li>
                  <a href='https://www.youtube.com/user/BlogProAyoub' rel='nofollow' target='_blank'>
                    <img src='https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcSTBd38d53uWAo3ELfSgkR61JOWAlGTGdFwxYChvKZ0pkEzdBOo' title='youtube'/>
                  </a>
                </li>
              </ul>
            </div>
          </div>
  </div> 
  </b:if>"
لا تنسى تغيير الروابط بما يناسب
4 ابحت عن هدا الكود   ]]></b:skin>

بعد ايجاده تضف هدا الكود فوقه


#navhead{
margin-top: 10px;
margin-bottom: -10px;
}
#byard-topsubsbox {background: #fff;
background: #fff;
width: 961px!important;
height: 90px!important;
margin-top: 20px;
padding: 10px;
border: 1px solid #ddd;
overflow: hidden;
margin: 0 auto;}
#subscriptionsection {float: right;
border-left: 1px solid rgb(168, 168, 168);
padding-left: 56px;
margin-top: -3px;
padding-top: 9px;}
.subsbox-heading {font-size: 20px;
font-family: droidkufi-bold;
text-align: center;
font-weight: bold;}
.topsubsboxname {background:#fff url(http://2.bp.blogspot.com/-bNZePDihTPU/UZ-lhWAHXqI/AAAAAAAAJuo/aSVVE_A6HpE/s320/name.png) no-repeat 7px 8px;border:1px solid #ddd; font-family:droidkufi-bold; font-size:14px; font-weight:bold;color:hsla(0,0%,27%,0.69); width:150px; margin-top:10px; height:24px; padding:5px 28px 5px 15px; vertical-align:top; display:inline-block;margin-right:15px;}
.topsubsboxemail {background:#fff url(http://3.bp.blogspot.com/-Wf_IBW4cEts/UZ-li4SsnvI/AAAAAAAAJuw/qYAi9lghY1E/s320/email.png) no-repeat 7px 10px; border:1px solid #ddd; font-family:droidkufi-bold; font-size:14px; font-weight:bold; color:hsla(0,0%,27%,0.69); width:150px; height:24px; margin-right:5px; margin-top:10px; padding:5px 28px 5px 15px;vertical-align:top; display:inline-block;}
.topsubsboxname:hover,.topsubsboxemail:hover {border:1px solid #bebebe; box-shadow:0.5px 1.5px 2px rgba(5,95,255,.1);}
.topsubsboxbutton {-moz-box-shadow:inset 0px 1px 0px 0px #bbdaf7;-webkit-box-shadow:inset 0px 1px 0px 0px #bbdaf7;box-shadow:inset 0px 1px 0px 0px #bbdaf7;background:-webkit-gradient( linear, right top, right bottom, color-stop(0.05, #00B3FF), color-stop(1, #349ECB) );background:-moz-linear-gradient( center top, #00B3FF 5%, #349ECB 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#00B3FF&#39;, endColorstr=&#39;#349ECB&#39;);background-color:#00B3FF;  margin-top:10px;  margin-right:5px;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;border:1px solid #84bbf3;display:inline-block;color:#ffffff;font-family:droidkufi-bold;font-size:13px;font-weight:bold;padding:5px 10px;text-decoration:none;text-shadow:1px 1px 0px #528ecc;}.topsubsboxbutton:hover {background:-webkit-gradient( linear, right top, right bottom, color-stop(0.05, #349ECB), color-stop(1, #00B3FF) );background:-moz-linear-gradient( center top, #349ECB 5%, #00B3FF 100% );filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#349ECB&#39;, endColorstr=&#39;#00B3FF&#39;);background-color:#349ECB;}.topsubsboxbutton:active {position:relative;top:1px;}
#socialsection {float:right;margin-top:20px;}
.socialheading{font-size: 20px;
font-family: droidkufi-bold;
text-align: center;
font-weight: bold;}
.socialicons ul {list-style: none;
display: inline;
float: left;
margin-top: 10px;
margin-left: 38px;}
.socialicons li {opacity: 1;float:right;padding:0px 0px 0px 10px;}
.socialicons li:nth-child(6) {padding: 0;}
.socialicons li a img{height:49px;width:49px} 
<----- by pro-ayoub.com ------>"
الان مبروك الاضافة 
تعليقات فيسبوك
0 تعليقات بلوجر

ليست هناك تعليقات:

إرسال تعليق

إتصل بنا

الإسم الكريم البريد الإلكتروني مهم الرسالة مهم
كافة الحقوق محفوظةلـ مدونة مابرو للمعلوميات 2016 / تصميم : آر كودر