ٌٌإضافة صندوق الإشتراك في القائمة البريدية بإحتراف في بلوجر

القائمة البريدية هي من اهم الاشياء التي تساعد في تطوير الموقع ، و جلب العديد من المشتركين في القائمة البريدية معناه انك حصلت على العديد من الزوار المضمونين لمواضيعك ، و من اجل الحصول على كود القائمة كل ما عليك هو فتح حساب Feedburner ، ومنه سيتصول كل مشترك في القائمة بأي شيء سننشره على موقعنا و كذا نضمن متابعين اوفياء لموقعنا .

طريقة التركيب :

كل ما عليك هو الذهاب الى تخطيط ثم قم بتحرير اداة في السايدبار او الفوتر ، و أضف داة HTML/Javascript و ضع بها احد الاكواد الثلاث التالية حسب الشكل الذي تريد الحصول عليه .

الشكل الاول

  الكود الاول

<style>@import url(http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css); #subscribebox{background:#576269;padding:20px;font-family:'PT Sans',sans-serif;} .widget_follow_subscribe .widget-detail{padding:36px 30px 40px} #subscribebox p{color:#fff;font-size:15px;text-align:center;font-weight:700;font-family: 'Noto Sans Kufi Arabic', sans-serif!important; line-height: 3em;} .follow-subscribe-social{padding:0 0 14px;border-bottom:#858585 solid 1px} .follow-subscribe-social ul{list-style:none;margin:0;padding:0;text-align:center} .follow-subscribe-social ul li{display:inline;margin-left: 20px;border-bottom:none} .follow-subscribe-social ul li:last-child{margin:0} .follow-subscribe-social ul li a{font-size:17px;color:#cacaca;-webkit-transition:color .2s ease-in-out;-moz-transition:color .2s ease-in-out;-ms-transition:color .2s ease-in-out;-o-transition:color .2s ease-in-out;transition:color .2s ease-in-out} .follow-subscribe-social ul li a:hover{color:#fff} form.subscribe{margin-top:-7px} form.subscribe input{display:block;width:100%} .subscribe-email{height:45px;border:none;margin:0 0 10px;font-size:.928571em;background-color:rgba(255,255,255,0.2);text-align:center;color:#fff} .subscribe-email:focus{outline:0} form.subscribe .placeholder{color:#cacaca} form.subscribe input:-ms-input-placeholder{color:#cacaca} form.subscribe input::-webkit-input-placeholder{color:#cacaca} form.subscribe input:-moz-placeholder{color:#fafafa} form.subscribe input::-moz-placeholder{color:#fafafa} .subscribe-button{height: 45px; font-weight: 700; font-size: 16px; color: #fff; text-transform: uppercase; border: none; background-color: #4FC4F6; transition: background-color .2s ease-in-out; font-family: 'Droid Arabic Naskh', serif;} .subscribe-button:hover{background-color:#00A3CE} .subscribe-button:focus{outline:0} </style><div id="subscribebox"><div class="follow-subscribe-social"><ul><li><a href="#" target="_blank"><i class="fa fa-facebook"></i></a></li><li><a href="#" target="_blank"><i class="fa fa-twitter"></i></a></li><li><a href="#" target="_blank"><i class="fa fa-google"></i></a></li><li><a href="#" target="_blank"><i class="fa fa-youtube"></i></a></li><li><a href="#" target="_blank"><i class="fa fa-instagram"></i></a></li></ul></div><p>اشترك للتوصل بكل جديد</p><form class="subscribe" action='http://feedburner.google.com/fb/a/mailverify?uri=amni8' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=amni8, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'><input name='uri' type='hidden' value='اسمك المستخدم'/><input name='loc' type='hidden' value='en_US'/><input class="subscribe-email" type='text' name='email' onblur='if (this.value == "") {this.value = "Your Email";}' onfocus='if (this.value == "Your Email") {this.value = "";}' value='بريدك الالكتروني'/><input class="subscribe-button" type="submit" value="اشترك الان" /></form></div>

الشكل الثاني

الكود الثاني

<style>@import url(http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css); /* Subscribe Box */ .widget-content{padding:0} .subscribe-wrapper h3{font-weight: 700; margin: 0 auto 10px auto; text-align: center; font-size: 20px; line-height: 1.8; font-family: 'Noto Sans Kufi Arabic', sans-serif!important;} .subscribe-wrapper h3 span{display:inline-block;font-weight:bold;font-size:33px;} .subscribe-wrapper p{margin:0 auto;opacity:.95;text-align:center;font-family: 'Droid Arabic Naskh', serif; font-size: 14px;} .subscribe-wrapper{color:#fff;background:#e83e3b;margin:0;padding:20px;} .subscribe-form{clear:both;display:block;margin:5px 0 10px 0;overflow:hidden} form.subscribe-form{clear:both;display:block;margin:10px 0 0;width:auto;overflow:hidden} .subscribe-css-email-field{background:rgba(0,0,0,0.2);color:#fff;margin:0 0 15px;padding:0.962em 1.847em;width:100%;border:none;text-align:center;outline:0} .subscribe-css-button{background: #fff!important; color: #E83E3B!important; cursor: pointer; font-weight: 700; padding: 7px; width: 100%; border: 0; font-size: 15px; text-transform: uppercase; transition: all .3s; font-family: 'Noto Sans Kufi Arabic', sans-serif!important;} .subscribe-css-button:hover{color:#aaa!important;transition:all 0.3s ease-in;} </style><div id="subscribe-css"><div class="subscribe-wrapper"><h3>احصل على أحدث مواضيعنا <span>أول بأول</span></h3><p>اشترك للتوصل بكل جديد</p><div class="subscribe-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=amni8" class="subscribe-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=amni8', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="amni8" /><input name="loc" type="hidden" value="en_US" /><input class="subscribe-css-email-field" name="email" autocomplete="off" placeholder="ادخل بريدك الإلكتروني" /><input class="subscribe-css-button" title="" type="submit" value="اشترك الآن" /></form></div></div></div>الشكل الثالث</h4><div class="separator" style="clear: both; text-align: center;"><a href="https://1.bp.blogspot.com/-X3qrrBA2kFU/WAElrAma0lI/AAAAAAAAEp4/ndowXxhVPFkFSwDIBstl9ffpOLjfjwGiwCEw/s1600/subscribe-box1.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://1.bp.blogspot.com/-X3qrrBA2kFU/WAElrAma0lI/AAAAAAAAEp4/ndowXxhVPFkFSwDIBstl9ffpOLjfjwGiwCEw/s1600/subscribe-box1.png" /></a></div><blockquote class="tr_bq"> <style><br />@import url(http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css);<br />#subscribe-box {background-color:<span style="color: blue;">#47cf73</span>;}<br />#subscribe-box p {font-size: 18px; color: #fff; padding: 10px 20px 0 20px; margin: 0; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; text-align: center;    font-weight: bold;}<br />#subscribe-box .emailfield {padding:0px 20px 10px;}<br />#subscribe-box .emailfield input {background: #f9f9f9; color: #bbb; padding: 10px; margin-top: 10px; font-size: 13px; width: 100%; border: 0; transition: all 0.4s ease-in-out; font-family: tahoma; border-radius: 2px!important;}<br />#subscribe-box .emailfield input:focus {background:#fff;outline:none;color:#888;}<br />#subscribe-box .emailfield .submitbutton {background: #4D504F; color: #fff;font-weight: 700; font-size: 16px; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; border: none; outline: none; width: 100%; cursor: pointer; border-radius: 3px!important; transition: all 0.4s ease-in-out;}<br />#subscribe-box .emailfield .submitbutton:active {outline:none;border:none;background:#fff;color:#e25734;}<br />#subscribe-box .emailfield .submitbutton:hover{background:#fff;color:#444;}<br /></style><br /><div id="subscribe-box"><br /><p class="<span style="color: blue;">amni8</span>sub"><br /><span style="color: blue;">اشترك لتصلك احدث مواضيعنا...</span></p><br /><div class="emailfield"><br /><form action="http://feedburner.google.com/fb/a/mailverify?uri=<span style="color: blue;">amni8</span>" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=<span style="color: blue;">amni8</span>, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><br /><input name="name" onblur="if (this.value == "") {this.value = "Your Name";}" onfocus="if (this.value == "Your Name") {this.value = "";}" type="text" value="الاسم الكريم" /><br /><input name="email" onblur="if (this.value == "") {this.value = "Your Email";}" onfocus="if (this.value == "Your Email") {this.value = "";}" type="text" value="البريد الالكتروني" /><br /><input name="uri" type="hidden" value="<span style="color: blue;">amni8</span>" /><br /><input name="loc" type="hidden" value="en_US" /><br /><input class="submitbutton" type="submit" value="اشترك الآن" /><br /></form><br /></div><br /></div></blockquote>غير كل ما هو ازرق بما يناسبك .  </div>

By glok

Similiar tagsاضافاتبلوجرمدونة هاردوير