إضافة مربع الاشتراك إلى بريد المدونة بطريقة احترافية وبسيطة

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

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

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

كيفية تثبيت الامتداد:

انتقل إلى لوحة القيادة الخاصة بالمدونة

انقر فوق التخطيط

انقر فوق إضافة أداة

اختر أداة 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://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5-XFByj-ihHcDrUaztbsC35kahjjm1Ft3HN9s5aZ48eYiWeu9BZVBA3xgWR2vJfIJRJ-HSdUOemSn07LcnOGC3kENIGNFxISlnhpm57CQfx8u0SVeDYkq4nVsKkrRahPbDYUguyMEHwA/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"، حيث ستجد المعرّف الخاص بموقع المحترف تك باللون الأحمر  وهو مكرر مرتين ، فيجب عليك استبداله بالمعرّف الخاص بمدونتك لكي تعمل الأداة. ثم قم بالحفظ ومبروك عليك القائمة البريدية بشكلها الاحترافي!