كيفية تركيب صندوق المتابعة بالبريد الإلكتروني

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

وهي متوافقة مع جميع المتصفحات لن أطيل عليكم أترككم مع شرح تركيب الإضافة،لكن لاتنسى أخد نسخة إحتياطية من القالب في حال حدوث أخطاء.
أولا من لوح تحكم مدونتك توجه إلى صفحة تحرير HTML  و ضع علامة في خانة توسيع القوالب ثم ابحث عن الكود الموالي بواسطة (CTRL+F) :  

]]></b:skin>

وضع مباشرة فوقه الكود التالي :

.subscribe{background-color:#399FFF;background-image:-moz-linear-gradient(left top,#9bcfff 40%,#0e8aff 60%,#9bcfff 87%);border:1px solid #0E8AFF;background-image:-webkit-linear-gradient(left top,#9bcfff 40%,#0e8aff 60%,#9bcfff 87%);background-image:-o-linear-gradient(left top,#9BCFFF 40%,#198FFF 60%,#9BCFFF 87%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9BCFFF',endColorstr='#0E8AFF');height:260px;margin:-13px 0px -40px 35px;overflow:hidden;width:295px}div.subscribe{text-align:right;width:300px;margin-right:-30px}.gmail{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5xmWFbeef_f5SGB-Vq6Cyl_EhIiuWFHRm_N9IM_4oyHz-F5ur6cIeKks_Gxv72r5D3v7-jz7NNZw9XYPYN6Xj4gZ1AlKJSbsNUiN_9rfmfUHkiDth7whFdTWdzjdwkTqbWc_hGjrsVd-4/s64/gmail.png") no-repeat scroll 100% 0 transparent;color:#FFF;font:bold 12pt Arial,Helvetica,sans-serif;height:60px;padding:10px 70px 0px 0px}#burner{border-bottom:2px groove #2681d5;padding-bottom:15px}#burner .email{background-color:#bddfff;border:1px solid #2681d6;border-radius:5px 5px 5px 5px;font:9pt Tahoma,Geneva,sans-serif;padding:0 10px;width:180px;direction:rtl;margin-right:20px;height:30px;line-height:30px}#burner .email:focus{background-color:#fff;box-shadow:0 0 20px #FFF}#burner input{height:30px}#burner .send{background-color:#bddfff;border:1px solid #2681d6;border-radius:5px 5px 5px 5px;color:#000;font:bold 9pt Tahoma,Geneva,sans-serif;padding:0 5px;width:50px;float:left;margin-left:10px}#burner .send:hover{background-color:#065eb0;color:#FFF}.social{width:250px}.social li{float:right;margin-right:20px}.share p{font:bold 15pt Arial,Helvetica,sans-serif;color:#fff;text-align:center;padding-top:20px;text-shadow:5px 5px 5px #000}.share a{float:right;margin:35px 22px 40px 0px}

الآن قم بحفظ القالب وتوجه لتخطيط المدونة واختر إضافة أداة ثم HTML/JAVASCRIPT ثم أضف الكود الآتي.

<div class="subscribe">

                <div class="gmail">ضع بريدك الإلكتروني ولاتنسى تفعيله من علبة الواردات ليصلك جديد الموقع أول بأول</div><!--end gmail-->

                <form id="burner" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=arabs-computer', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow" method="post" action="http://feedburner.google.com/fb/a/mailverify">

                    <input class="email" type="text" onclick="this.value=''" onblur="this.value=!this.value?'ادخل بريدك الالكترونى ..':this.value;" name="email" value="ادخل بريدك الالكترونى .." />

                    <input type="hidden" name="uri" value="arabs-computer" />

                    <input type="hidden" value="en_US" name="loc" />

                    <input class="send" type="submit" value="اشترك" /><br />

<p style="margin-top:15px;text-align:center;"><a href="http://feeds.feedburner.com/arabs-computer"><img src="http://feeds.feedburner.com/~fc/arabs-computer?bg=99CCFF&amp;fg=444444&amp;anim=0" height="26" width="88" style="border:0" alt="" /></a></p>

                </form>

<p style=" font:bold 15pt Arial, Helvetica, sans-serif;color:#fff;text-align:center;text-shadow:5px 5px 5px #000;">تابعنا على</p>

                <div class="share" style="margin-top:-20px;">

                

                    <div id="fb"><a class="menu" title="الفيسبوك" href="http://www.facebook.com/prasson5" target="_blank"><img src="http://cdn3.iconfinder.com/data/icons/iconshock-social/png/48/facebook.png" alt="fb"/></a></div>

                    <div id="tw"><a class="menu" title="تويتر" href="https://twitter.com/ArabicArabs" target="_blank"><img src="http://cdn3.iconfinder.com/data/icons/iconshock_social/png/48/twitter.png" alt="tw" /></a></div>

                    <div id="rss"><a class="menu" title="الخلاصة" target="_blank" href="http://feeds.feedburner.com/arabs-computer"><img src="http://cdn1.iconfinder.com/data/icons/iconshock_social/png/48/rss.png" alt="rss" /></a></div>

                    <div id="yt"><a class="menu "title="اليوتيوب" target="_blank" href="http://www.youtube.com/user/abdelghani"><img src="http://cdn1.iconfinder.com/data/icons/iconshock_social/png/48/youtube.png" alt="yt" /></a></div>

                </div><!--end share-->

            </div><!--end subscribe-->

غير مالون بالأحمر بإسمك على فيد برنر وغير مالون بالأزرق بإسم صفحتك على الفيسبوك ومالونبالأخضر بإسمك على تويتر والذي لون بالوردي غيره بإسم قناتك على اليوتيوب.