اقدم لكم اضافة رائعة جدا للاشتراك بالمدونة عبر البريد الالكتروني
الاضافة هامة جدا تمكن الزائر بعد الاشتراك بالمدونة تمكنه من الحصول على اشعارات عبر
بريده الالكتروني بما تقوم بنشره على مدونتك
لذلك هي هامة و الاضافة منبثقة تظهر عند الضغط على الزر المخصص
معاينة الاضافة
شرح التركيب
نبحث عن ]]b:skin و نلصق الكود التالي فوقه
.enve{background:#00aa9f;color:#fff;width:50px;height:50px;display:block!important;line-height:50px!important;text-align:center;font-size:24px!important;-webkit-border-radius:50px;-moz-border-radius:50px;border-radius:50px;margin:0 auto}.newsletter-sm{background:#fff;width:100%;margin:0;padding:20px;box-sizing: border-box;}.newsletter-sm h3,.newsletter-sm p{color:#555;font-family:"Maven Pro",sans-serif}.newsletter-sm h3{font-weight:400;text-align:center;margin-bottom:10px;font-size:24px}.newsletter-sm p{font-size:14px;line-height:20px}.newsletter-sm .newsletter-input-sm{border:0;box-sizing: border-box;padding:5px 10px;width:360px;float:left;height:40px;color:#555;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px}.newsletter-sm .newsletter-sm-bot{background:#00aa9f url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFfTXliSjpUFscUpEr3klvRdSVPSv1mwzs0CRqJ8wSNOSeMs04iMdOeAgH3gMfjXr1W9sRdRDxbuAd9SGi_JufwrS-blB5b2wd3aVdws7GUfy6AKiy8csBGC518HyPx6Ep_6EpJbtz7tA/s1600/bg.png) no-repeat;box-sizing: border-box;padding:20px;margin:0 -20px -20px;height:80px}.newsletter-sm .newsletter-button-sm{float:right;height:40px;display:inline-block;font-size:14px;box-sizing: border-box;padding:5px 10px;position:relative;color:#fff;text-align:center;background:#00aa9f;border:1px solid #fff;cursor:pointer;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px}.modalDialog{position:fixed;font-family:Arial,Helvetica,sans-serif;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.6);z-index:99999;opacity:0;-webkit-transition:opacity 200ms ease-in;-moz-transition:opacity 200ms ease-in;transition:opacity 200ms ease-in;pointer-events:none}.modalDialog:target{opacity:1;pointer-events:auto}.modalDialog:target>div{margin:8% auto}.modalDialog>div{-webkit-transition:all 100ms ease-in;-moz-transition:all 100ms ease-in;transition:all 100ms ease-in;width:500px;position:relative;margin:5% auto;background:#fff;min-height:200px}h2.signup{background:#00aa9f;border-bottom:1px solid #008d84;font-weight:400;text-align:center;box-sizing: border-box;padding:10px;color:#fff;font-size:18px}.close{color:#888;position:absolute;top:1px;right:1px;width:30px;height:30px;line-height:30px;text-align:center;font-size:16px}.close:hover{text-decoration:none;color:#555}
#likebutton {
text-decoration: none;
position: relative;
float: left;
display: inline-block;
width: 47px;
height: 45px;
z-index: 20;
color: #f2f2f2;
font-size: 24px;
line-height: 42px;
cursor: pointer;
margin: -1px 16px;
padding: 0;
transition: color .3s;
background: rgba(0,0,0,0.2);
text-align: center;
border-radius: 0px; border-radius: 4px;
}
#likebutton:hover {opacity: 0.7;}
ثم نبحث عن /body و نلصق الكود التالي فوقه
<div class='modalDialog' id='signup'>
<div><a class='close' href='#close' title='Close'><i class='fa fa-times'/></a>
<div class='signup-container'>
<div class='newsletter-sm'>
<i class='fa fa-envelope-o enve'/>
<h3>الأشتراك بالقائمة البريدية</h3>
<p style='text-align:center'>أشترك برسائل المدونة الألكترونية ليصلك جديد مدونتنا.</p>
<form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('https://feedburner.google.com/fb/a/mailverify?uri=*********', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
<div class='newsletter-sm-bot'>
<input class='newsletter-input-sm' name='email' placeholder='Enter Your Email' type='text'/>
<button class='newsletter-button-sm' type='submit'>Subscribe</button></div>
<input name='uri' type='hidden' value='*********'/>
</form></div></div></div></div>
و اخيرا هذا الكود مسؤل عن ظهور الزر
يمكنك لصقه في المكان اللذي تراه مناسب
<span style='text-align:center; display:block;margin: 0% 0;'><a href='#signup' id='likebutton'>الأشتراك</a></span>
ملاحظة
قم بتغير رابط الخلاصة الموجود ستجده بهذا الشكل ********* برابط الخلاصة الخاص بك
و هو موجود مرتين
و شكرا
شكرًا لوقتكم واهتمامكم بقراءة موضوع اضافة منبثقة زر للاشتراك بالمدونة عبر البريد الالكتروني . إذا صادفتكم أي مشكلة أثناء استخدام الكود أو كان لديكم أي استفسار، فلا تترددوا في طرحه ضمن التعليقات أو التواصل معنا عبر صفحة الاتصال بنا . ولا تنسوا الانضمام إلى متابعي مدونة هلا تك ليصلكم كل ما هو جديد.
