صندوق اشترك عبرالبريد طريقه جديده

السلام عليكم ورحمه الله وبركاته اضافه صندوق اشترك  با البريد  الى مدونه بلوجر من الاشياءالمهم التى ينبغى علينا ان تكون موجوده فى كل مدونه .مميزات الاداه ايضاً بها ايقونات المواقع الاجتماعيه مثل فيس بوك وتويتر ويتيوب و الخدمه RSS لا اضافه هذه الاداه الاكثر من رائعه فقط اتبع الخطوات فى الاسفل 
هذا هو شكل الاده الجديد 


طريقة وضع الاداه  :

1 - قم بـالدخول إلى مدونتك بلوجر.
2 - من لوحة التحكم الخاصة بمدونتك توجه إلى تصميم القالب .
3 -ابحث عن :
]]></b:skin>
أضف فوقه هذا الكود :

----------------------Social Newsletter Widget By www.5hair.blogspot.com-----------------------------
/* Social &Newsletter Widget *//* Social */.social {
background:#fcfcfc;
height:80px;
padding:0 15px;
border-bottom:1px solid #f0f0f0;
}
.social li {
float:right;
width:52px;
margin-left:15px;
text-align:center;
}
.social li.last {
margin-right:0;
}
.social li a {
opacity:0.6;
filter:alpha(opacity=60);
font-size:11px;
color:#666;
padding-top:42px;
line-height:34px;
}
.social li a:hover {
opacity:1.0;
filter:alpha(opacity=100);
color:#666;
text-decoration:none;
}
.social .social-feed {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0akwwLgMkCzU_erbtoPQ55JCBkK3QGGniyrPrfYW25NzspeMCotpzvjGN4VOqrOYEvtJHsOoBQ4l5zxUi2eMtgNlbJJVMTTBWTu9jbPvrCQgE4mIiBC79I5dOlORlIkouf4iiVe6Q1ZE/s1600/ico-social-rss.png) no-repeat;
}
.social .social-twitter {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvAHxy1G9eqPSVvDuhbYMajZfixa9cEmH4ObhUifT-fiFWlWVx6FBZSH-pRYDzZI2AHkLzUL0js8xgd_yNKkj2Tjx7naLB4WI7LOa2pBXWw3VsNZluEtzqyPAZbctWvpzQacfH7UiQlfA/s1600/ico-social-twitter.png) no-repeat;
}
.social .social-facebook {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7q1exqrOdAYinDs5PkMxHglVUSk655N_khdcohGy4Qfq_nubjxu-LfOxnI39kv9elviDNrJpLbnvn1oqC3sljCd530CUtFZ3gAc_A8BJvE7mySnBQdUniV3Ln20JSth-HEyi5a4ULhh8/s1600/ico-social-facebook.png) no-repeat;
}
.social .social-youtube {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKvATTqW1cIeH-FHQ_hWIEtngn-fPC2yCP0FM4bLHHMiKhcq5XzBw8RYYWofakn4t7XfB_zMX-cPS_cP7SaokggP1nwXTBgBHcffdSvbYY8SvV7V72Jxh_gCZcsB61DsERsVJ6y33YWf4/s1600/ico-social-youtube.png) no-repeat;
margin-right:0;
}
form.emailform {
margin:20px 0 0;
display:block;
clear:both;
}
.emailtext {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu-oDLG0na24dL5cjsU7LyGAGaXQKlYb3KmkzAULoa1npWuodhYuV7hl0thlHROBC-UXQF08H4H5qd-jISPIoB1k-Z5O_2VKS-tJl19X2GMf1Crywx3vttifJrsId2tcdN-Igra_uaGc1B/s28/w2b-mail.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 33px;
color:#444;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
-moz-box-shadow:1px 1px 2px #CCC inset;
-webkit-box-shadow:1px 1px 2px #CCC inset;
box-shadow:1px 1px 2px #CCC inset;
}
.ebutton {
color:#444;
font-weight:bold;
text-decoration:none;
padding:6px 15px;
border:1px solid #D3D3D3;
cursor:pointer;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-goog-ms-border-radius:4px;
border-radius:4px;
background:#fbfbfb;
background:-moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fbfbfb), color-stop(100%, #f4f4f4));
background:-webkit-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background:-o-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background:-ms-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4', GradientType=0 );
background:linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
}
4 -احفظ  واذهب الى  إلى التخطيط.
5 - ثم إضافة أدة.HTML/JavaScript .
6 -اختاراسم الى الاداه .. ثم ضع  هذا الكود :
<div class="widget-content">
<div style="border: 1px solid DodgerBlue; padding: 1mm;">
<center><img src="http://im19.gulfup.com/QmIt1.png" /></center>
<center><span style="font-size:16px;font-weight: bold;;">توصل بكل المواضيع الجديدة ،كن السبّاق وقم بإدخال بريدك الإلكتروني و إنتظر الجديد</span>
<ul class="social">
<li><a class="social-facebook" href="https://www.facebook.com/5khair" rel="nofollow" target="_blank">Facebook</a></li>
<li><a class="social-twitter" href="http://twitter.com/5khair" rel="nofollow" target="_blank">Twitter</a></li>
<li><a class="social-feed" href="http://feeds2.feedburner.com/5khair" rel="nofollow" target="_blank">RSS</a></li>
<li><a class="social-youtube" href="http://www.youtube.com/user/5khair" rel="nofollow" target="_blank">YouTube</a></li>
</ul>
</center>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" class="emailform" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="softechnogeek" name="uri" />
<input type="hidden" name="loc" value="en_US" />
<input type="text" value="أدخل بريدك الإلكتروني..." name="email" class="emailtext" onblur="if (this.value == &quot;&quot;) {this.value = &quot;أدخل بريدك الإلكتروني...&quot;;}" onfocus="if (this.value == &quot;أدخل بريدك الإلكتروني...&quot;) {this.value = &quot;&quot;}" />
<input type="submit" class="ebutton" value="إشترك" title="" alt="" />
</form>
<center>
<span class="Apple-style-span" style="color: rgb(51, 51, 51); font-family: 'trebuchet ms', Trebuchet, Arial, Verdana, sans-serif; font-size: 10px; font-style: italic; background-color: rgb(255, 255, 255); "></span>
</center>
<div dir="ltr" style="text-align: left;" trbidi="on">
<a href="http://5khair.blogspot.com/" target="_blank" title="اضف هذه الاداه الى مدونتك"><span style="font-size: xx-small;">اضف هذه الاداه الى مدونتك »</span></a></div>
</div>
</div>
ملحوظه :- قم بتغير ما با اللون الاحمر با الخاص بك 

ايضاً يمكنك تغير اى لون بما يحلو لك و يمكنك مشاهد اكواد الالوان 

تعليقات

المشاركات الشائعة من هذه المدونة

موقع جديد يهتم بتكنلوجيا المعلومات

تحميل قالب مدونه طمان سينتر الى مدونات بلوجر

تحميل قالب مدونه محترف لاب توب الاحترافى