صندوق عائم للإشتراك في خدمة RSS

صندوق عائم للإشتراك في خدمة RSS

 

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

 

 

اليوم سنتحدث عن خدمة الإشتراك في القوائم البريدية نظرا لأهميتها لكل مدون. في موضوع سابق كنا قد شرحنا طريقة إضافة قائمة بريدية RSS لمدونتك يمكنك زيارة الموضوع من هنا.

 

صندوق عائم للإشتراك في خدمة RSS


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

 

 

و لكي لا أطيل عليك أتركك مع معاينة الإضافة و طريقة تركيب الإضافة.

 

 

view demo

لتركيب الإضافة يجب عليك التوجه لموقع feedburner و تفعيل خدمة الإشتراك البريدي إن لم تكن قد فعلتها من قبل، و لفعل ذالك يمكنك تتبع الصورة بالأسفل.

 

 

RSS Feed


بعد ذالك توجه للوحة تحكم المدونة / تصميم / تحرير HTML / ثم Ctrl+F للبحث عن الكود التالي (لمعرفة المزيد)

 

</head>

بعد أن تجد الوسم قم بإلصاق الكود التالي فوقه مباشرة

 

<style type='text/css'>
#anuncio {
position:absolute;
padding: 2px;
padding-top: 15px;
width: 280px;
/* عرض الإضافة*/
visibility: hidden;
z-index: 200;
top: 30px;
left: 30px;
}
#rss-mail {
/* لون الخلفية و الصورة*/
background: #FFFFFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWnCKS57cPalvy3AV8PNl2hP0z1sakgzfo06fUxmDMs6jIl7n-XpkCrUwiOH6V9EM1liAUw6ijokiKRuRtXevCsoi2rSmXgylX6bRwET_s5NlKd0pQrmhqYKSuS3Ju7az5f7-eP5qg5lg/s320/pattern_blk_point.png);
border:2px solid #FF8000;
/* الحواف */
height:70px; /* إرتفاع الإضافة*/
}
#rss-mail span {
color:#FFFFFF;
/* لون النص */
font-size:12px;
font-weight:bold;
line-height:30px;
}
#rss-submit {
background:#FF8000; /* لون الزر*/
border:0px;
}
.rss-box {
height:13px;
margin-top:10px;
color:#6E6E6E;
font-size:12px;
width:135px;
}
</style>
<script type='text/javascript'>
//<![CDATA[
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 30 //set x offset of bar in pixels
var startY = 15 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("anuncio").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("anuncio").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("anuncio");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
//]]>
</script>

 

 

بعد ذالك إبحث عن الوسم

 

</body>

 

بعد ذالك ألصق الكود التالي قبله

 

<div id='anuncio'>
<div id='rss-mail'>
<a href='Javascript:void' onClick='closebar(); return false'><img align='right' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtNZ6QOXdDNiuj_BCk_SBxXS7DAyyJJRi5733y5fa_I8qO43LxWzBZf_ByTdRPTqJJTobgl6MelpTKR5bknvnMde-P-B0cvvCmRm43Y0fO3-01SpI1Dxie4aHUje9P5QbOe42C6aFODfc/s320/cerrar.png'/></a>
<span>أحصل على جديد المدونة مباشرة على بريدك الإلكتروني</span><br/>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbNwHXm-UEv8Qe4xu0hELkTI1ss-wiAqprhK2uSdLqltzH2HQBvfRJ2aBaSz5uW1f2EuN-3RiwCxTWd9cMpwFeXwEoln2dlG-hVY-HwoPnIuukWzrFyb-7MptRBrzxQbRjhuyC4FM_RX8/s1600/rss-icono.png' style='padding:5px; float:left;'/>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=myblog&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='email' type='text/'/>
<input name='uri' type='hidden' value='myblog'/><input name='loc' type='hidden' value='es_ES'/><input id='rss-submit' type='submit' value='إشترك الأن'/></form></div></div>

 

 

الأن قم بتغير ما هو باللون الأحمر بإسم خلاصتك RSS و هو يكون في أخر رابط الخلاصة RSS مثال لذالك:

http://feeds.feedburner.com/myblog

 

قم فقط بأخد أخر الكلام في الرابط و ليس الرابط ككل ثم ألصقه في المكان المشار إليه باللون الأحمر.

 

يمكنك تغير الكلام الموجود في الكود بالكلام اللذي تريده.

 

الأن إحفظ الإضافة و تمتع بزيادة المشتركين في خدمة قوائم RSS الخاصة بمدونتك و يمكن غلق الصندوق بالضغط على علامة x الخاصة بالإغلاق.

إذا أعجبك الموضوع فشاركه مع أصدقائك فلن يأخد منك الأمر سوى 5 ثوان :)

هناك 8 تعليقات:

  1. هذه إضافة جميلة جدا ورائعة، بارك الله فيك على الإبداع.

    ردحذف
  2. @الباشق الإسلامي العفو أخي الباشق

    هذا كله بفضل تشجيعكم لي على المواصلة.

    تحياتي لك

    ردحذف
  3. السلام عليكم
    اشكرك خيوو على الافاده

    بس مره ماعرفت لها @_@
    تطلع الصفحه ملخبطه او فيها خطأ
    اممممممم مدري كيف اسويها

    ردحذف
  4. @أميرة رمادي العفو أختي الكريمة

    ربما أخطئتي في أحد الأكواد حاولي مرة أخرى و إن شاء الله تنجحي في إضافتها

    نورت المدونة بتواجدك معنا

    ردحذف
  5. فعلا في الكود بعض الاخطاء سوف اذكر تصحيحها بعد التجربه وهي لابد تعديل التالي

    في الكود الاول:
    1\ العرض الى 300
    2\ رقم خط وهو موجود اسفل لون الخط مكتوب 12 ضعه 10

    في الكود الثاني :
    ذكرت بالشرح في الكلمه التى نغيرها بلون الاحمر فقط حسب الموجود في حسابنا ولكن وجدت خطا وهي لابد اضيف تلك الكلمه امامها كلمه بلوجر وتصبح هكذا
    بدل myblog
    نضع blogspot/myblog

    وكلمه myblog نغيرها حسب الموجود في رابط الخاصيه لدينا

    وبعد التعديلات الحمدلله ركبتها لدي بنجاح
    شكراً لك واتمنى الملاحظات هذه يستفيدوا منها اللى ماتضبط معه

    ردحذف
  6. @أوراق
    أهلا بك أختي الكريمة

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

    لكن شكرا لك على حل المشكلة فقد يكون هناك العديد من المدونين قد واجهتهم هذه المشكلة و لم يسألو عليها.


    حفظك الله

    ردحذف
  7. مشكور جدا أخي العزيز لقد استفدت من موقع بشكل كبير جدا شكرا ً على المعلومات الطيبة والرائعة التي لم أجدها في موقع آخر .
    أتمنى منك زيارة موقعي وإبداء رأيك فيه وملاحظاتك وأتمنى منك إضافات لتوير الموقع
    http://alyemen7.blogspot.com/

    ردحذف
  8. شكراااا لك موضوع رائع وجميل

    معهد أرباحي

    www.arba7i.com

    ردحذف