بسم الله الرحمن الرحيم

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






شرح تركيب الاضافة :
1. افتح لوحة تحكم بلوجر ثم حدد المدونة التي تريد تركيب عليها الاضافة. اذا كنت تملك اكثر من واحدة.
2. اختر من القائمة الجانبية >> المضهر >> ثم تعديل HTML.
3. ابحث باستعمال "ctrl+f" على وسم </head>

<style type='text/css'>
/* Subscribe Box */
@keyframes rotate{100%{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
.rainbow{position:relative;z-index:0;overflow:hidden;padding:3px}.rainbow::before{content:&#39;&#39;;position:absolute;z-index:-2;left:-50%;top:-50%;width:200%;height:200%;background-color:#2ecc71;background-repeat:no-repeat;background-size:50% 50%,50% 50%;background-position:0 0,100% 0,100% 100%,0 100%;background-image:linear-gradient(#2ecc71,#2ecc71),linear-gradient(#fbb300,#fbb300),linear-gradient(#e74c3c,#e74c3c),linear-gradient(#3498db,#3498db);animation:rotate 8s linear infinite}.rainbow::after{content:&#39;&#39;;position:absolute;z-index:-1;left:5px;top:5px;width:calc(100% - 10px);height:calc(100% - 10px);background:#fff}#HTML99{padding:0}#HTML99 h2{color:#222;padding:0}#HTML99 h2:before{display:none}.subscribe-wrapper{color:#222;line-height:20px;margin:0;padding:20px}.subscribe-form{clear:both;display:block;margin:10px auto;overflow:hidden}.subscribe-wrapper p{margin:0;font-size:14px}form.subscribe-form{clear:both;display:block;margin:10px 0 0;width:auto;overflow:hidden}.subscribe-css-email-field{background:#fff;color:#222;margin:0 0 18px;padding:12px;width:100%;border:1px solid rgba(0,0,0,0.1);outline:0;font-size:14px;text-indent:10px;line-height:20px;border-radius:3px;transition:all .6s}.subscribe-css-email-field:hover,.subscribe-css-email-field:focus{border-color:rgba(0,0,0,0.3)}.subscribe-css-button{background:#2c3e50;color:#fff;cursor:pointer;font-weight:500;padding:7px;text-transform:none;width:100%;border:none;font-size:16px;border-radius:3px;transition:all .3s}.subscribe-css-button:hover{background:#34495e}
</style>

4. الان قم بحفط المظهر . ثم توجه الى التخطيط من خلال القائمة الجانبية للوحة تحكم بلوجر.
5. ثم اختر اضافة >> إضافة أداة >> حدد HTML/JavaScript ثم اضف الكود التالي في الصندوق.

<div class="container">
<div class="rainbow">
<div id="subscribe-css">
<div class="subscribe-wrapper">
<h2>اشتراك في قائمة البريدية</h2>
<p>كن من اعضاء و اصدقاء الموقع لتتوصل بكل الجديد عبر البريد الكتروني الخاص بك.</p>
<div class="subscribe-form">
<form action='https://feedburner.google.com/fb/a/mailverify?uri=tharabic' class="subscribe-form" method="post" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=InSEOFree', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
  <input name="uri" type="hidden" value="tharabic" ></input>
<input name="loc" type="hidden" value="en_US" ></input>
<input class="subscribe-css-email-field" name="email" autocomplete="off" placeholder="اكتب البريد الكتروني الخاص بك..."></input>
<input class="subscribe-css-button" title="" type="submit" value="اشتراك" ></input>
</form>
</div>
</div></div></div>
</div>

اقتبـاس ،، الان غير tharabic بالاسم الموقع الخاص بك على feedburner. اذا لم تحصل عليه قم بزيارة الموقع التالي وانشئ اسم خاص بك :لمشاهدة الروابط يلزمك التسجيل

الان بعد التعديل قم بحفظ و مبروك عليك
المصدر : ع المحترف
بالتوفيق للجميع
والسلام ختام