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

مرحبا أعزائي زوار مدونة ماي مور، أعود إليكم من جديد ضمن قسم  إضافات بلوجر لأشرح لكم 

اضافة صندوق اشترك الان بخاصية جد مذهلة مثل موقع المستجد

 

سلام عليكم

اليوم مع اضافة اشترك الان بخاصية رائعة جداااااااا

  من ناحية الشكل و الضغطة

 

صورة الإضافة

 

إضافة أداة الصندوق إلى تصميم المدونة 

 الآن توجه إلى عناصر الصفحة ثم اضغط رابط إضافة أداة في أي مكان تشاء و في النافذة المنبثقة اختر أداة

 HTML/Javascript

ضع الكود الآتي مع إجراء التعديلات الضرورية.

هو تغيير ماكتب  باللون احمر  برابطكم و اسم مدونتكم

 

<center><div class="sub">
<h5>ضع إيميلك ليصلك كل جديد موقع المستجد</h5>
<div class="ins">
<div id="sleek-subscribe">
<form action="http://feedburner.google.com/fb/a/mailverify?uri=MymOur/abcdx&amp" class="signform" method="post" target="_new">
<input class="txt2" name="email" onblur="if (this.value == &#39;&#39;) {this.value = &#39;ضع اميلك هنا&#39;;}" onfocus="if (this.value == &#39;ضع اميلك هنا&#39;) {this.value = &#39;&#39;;}" value="ضع اميلك هنا" />

<input class="btn2" type="submit" value=" " />
</form>
</div>
</div>

</div>
<style>
.sub{
width:300px;
height:130px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIXi7Gf6AeGBaw0bAKBh4I2jwm-jEpIJILAx7hyHav97H2_Zh7ftGB1gM-DJoK2M_BMT9ZoZdazoIvD_CU5CMNEgc2VEdZEIpVNaADckocVkoO7AEvQV5Rq42s6T-V1bG9o6pHKP7SjI8/s1600/bg.png);
}
.sub h5{
color:#2d2d2d;
font:22px arial;
margin: 0;
padding:25px 0 0 0;
text-align:center;
}
.sub .ins{
width:261px;
height:35px;
margin: 12px auto 0;
}
.sub .ins .txt2{
border: 1px solid #E1E1E1;
background: white;
font: 12px Tahoma, Geneva, sans-serif;

color: silver;

padding: 10px 7px 9px 7px;
margin: 0px;
float: right;
text-align: right;
width: 136px;
}
.sub .ins .btn2{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTxg6SS8vXgAySwRbd_qwvjmWG2ANQvjMg0mw1propde-yRBnSdqncZT9IZ_8_2pEjfje9q9_bj7wWsgAIV0GS3QRJEhg1qTXducqrQgW4oF5lUMYTYd0bbQXFzGd0Vqe7A5J1F_TiHMM/s1600/send.png);
float:left;
border:none;
width:104px;
height:33px;
cursor:pointer;
margin-top:1px;
}
</style></center>

 إنتهى  الدرس إحفظ الأداة ثم  قم بالمعاينة

في آمان الله و حفظه

 

 

 

 

هل اعجبك الموضوع ؟

Share

Tweet