حصريا اضافة القائمة البريدية بشكل جديد وبتقنية Flat Ul
هذه الاضافة تمكن الزائر من الاشتراك با القائمة البريدية ويتوصل بجديد المدونة كما ان هذه الاضافة جديدة في منصة بلوجر عند الاشتراك بالقائمة البريدية يجب علي الزائر كتابة اسمه والبريد الاكتروني لكي يتوصل بجديد المدونة الإضافة تم تصميمها بتقنية "Flat Ul" و "CSS3" مما يجعل يجعل مدونتك ذات لمسة جمالية
توجه للتخطيط وافتح اداة Html/JavaScript
واضف الكود التالي :
<div id='byard-emailsubsocial'>
<p>أشترك فى القائمة البريدية ليصلك كل جديد</p>
<div class='emailsub'>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post'target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=msrawy-mix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type='text' name='name' placeholder='الأسم' />
<input type='text' name='email' placeholder='البريد الإلكتروني الخاص بك' />
<input type="hidden" value="msrawy-mix" name="uri"/>
<input type="hidden" name="loc" value="en_US"/>
<input value="اشترك الآن!" class="button" type="submit" />
</form>
</div>
</div>
<style type='text/css'>
#byard-emailsubsocial {
width: 300px;
height: 330px;
border: 1px solid #ddd;
border-radius: 5px 5px 0px 0px;
}
#byard-emailsubsocial .heading {
padding: 15px 25px;
line-height: 35px;
font-size: 25px;
font-weight: 600;
font-family: AraJozoor-Regular;
color: rgb(170, 170, 170);
text-align: center;
text-shadow: 0px 1px rgba(255, 255, 255, 0.75);
background: none repeat scroll 0% 0% rgb(247, 247, 247);
}
#byard-emailsubsocial p {
font-family: AraJozoor-Regular;
font-size: 16px;
color: rgb(170, 170, 170);
line-height: 25px;
padding:10px 20px 0 20px;
margin: 0;
}
#byard-emailsubsocial .emailsub {
padding:0px 20px 10px 20px;
}
#byard-emailsubsocial .emailsub input {
color: rgb(170, 170, 170);
padding: 10px;
margin-top: 10px;
font-size: 18px;
font-family: AraJozoor-Regular;
width: 92%;
border: 1px solid #ccc;
border-bottom: 2px solid #ccc;
border-radius: 5px;
transition:border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
}
#byard-emailsubsocial .emailsub input:focus {
border-color:#F4836A;
outline: none;
box-shadow: 0 0 2px 1px #F4836A;
}
#byard-emailsubsocial .emailsub .button {
background: #F4836A;
color: white!important;
border:none;
outline: none;
border-bottom: 3px solid #B3614E;
transition:background .4s linear;
width: 90%;
margin-left: 5%;
margin-right: 5%;
font-weight: 600;
cursor:pointer;
}
#byard-emailsubsocial .emailsub .button:hover{
background: #DD7761;
}
</style>
غير "msrawy-mix" الى اسم خلاصة مدونتك فى "feedburner"
فى انتظار تعليقاتكم المشجعة على تقديم المزيد