القائمة الرئيسية

الصفحات

آخر الأخبار

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

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

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

طريقة تركيب الإضافة :

  • إذهب الى لوحة التحكم بالمدونة
  • اضغط على التخطيط
  • اضغط على إضافة أداة
  • اختر أداة HTML/JavaScript
  • قم بلصق السكربت التالي بداخل الأداة:
<style>

//@media(max-width:400px) {.sbox{width:109%!important;}}
//@media(max-width:1024px) and (min-width:400px) {.sbox{width:106.5%!important;}}
.sbox {background:#009abe;text-align:center;width:100%;}
.sbox span {color:#fff;font-family:droidarabickufiregular;font-size:22px;}
.sbox .small {font-size:18px;}
input.boxinput::placeholder {color:#fff;}
.sbox .hatespam {font-size:15px;}
.sbox .boxinput::placeholder {color:#fff;}
.sbox .boxinput {background:rgba(0,0,0,0.4);color:#fff;border:none;padding-top:13px;padding-bottom:13px;font-family:droidarabickufiregular;margin-bottom:10px;outline:none;transition:.3s;width:86%;text-align:center;border-radius:4px;}
.sbox .boxsubmit {box-shadow:0px 0px 31px 0px rgba(0,0,0,0.2);width:86%;text-align:center;padding-top:13px;padding-bottom:13px;background:#fff;outline:none;border:none;color:#009abe;font-family:droidarabickufiregular;cursor:pointer;border-radius:4px;}
.sbox .boxsubmit:active {
background:rgba(0,0,0,0.6);color:#fff;}
.sbox {border-radius:8px!important;padding:0!important;border:none!important;}
.sbox .widget-content {margin:0!important;}
#sidebar-wrap .widget {overflow-x:hidden;}
.sbox {background:linear-gradient(135deg, #667eea 0%, #764ba2 100%)!important;width:100%;}
.sbox .boxsubmit {box-shadow:none!important;border-radius:2px!important;color:#764ba2!important;}
.sbox .boxinput {border-radius:2px!important;}
</style>
<div class='sbox wow rubberBand'>
<center>
<br /><span class='icon'><img height='auto' src='https://1.bp.blogspot.com/-9-fJaPMneBk/WlMlqltvtOI/AAAAAAAACEM/qEy8USIBQJwky4GJixaeBxlk2WDor-JPgCLcBGAs/s1600/email.png' width='150px'/></span><br/>
</center>
<span>القائمة البريدية</span><br /><br />
<span class='small'>إشترك بالخدمة البريدية للحصول على آخر الدروس والشروحات.</span><br /><br />
<center>
<form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&#39;https://feedburner.google.com/fb/a/mailverify?uri=almohtarif-tech/JZcE&#39;, &#39;popupwindow&#39;, &#39;scrollbars=yes,width=550,height=520&#39;); return true' target='popupwindow'><input class='boxinput' name='EMAIL' placeholder='بريدك الإلكتروني...' type='email' required/>
<input class='boxsubmit' type='submit' value='إشتراك'/><input name='uri' type='hidden' value='almohtarif-tech/JZcE'/>
<input name='loc' type='hidden' value='en_US'/></form><br />
<span class='hatespam'>* لا تقم بإرسال رسائل سبام!</span><br /><br />
</center></div>

بعد لصق السكربت بداخلها ، ستحتاج الى إجراء تعديل بسيط على معرّف "FeedBurner"، حيث ستجد المعرّف الخاص بموقع المحترف تك باللون الأحمر (almohtarif-tech/JZcE) وهو مكرر مرتين ، فيجب عليك استبداله بالمعرّف الخاص بمدونتك لكي تعمل الأداة. ثم قم بالحفظ ومبروك عليك القائمة البريدية بشكلها الاحترافي!

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

تعليقات