كيفية إضافة مربع الاشتراك في البريد الإلكتروني بلوجر

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

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

الخطوة الاولى

ملاحظة: قبل البدء قم باخد نسخة احتياطية من القالب لو قم بانشاء مدونة تجريبية وقم بتطبيق الشرح عليها.

انتقل إلى لوحة التحكم في بلوجر

ثم المظهر
ثم تحرير HTML

ثم قم بلصق رمز (CSS) أدناه قبل </style>

#sub-box {display:none;background:rgba(0,0,0,0.9);width:100%;height:100%;position:fixed;top:0;left:0;z-index:99999;}

#boxclose {width:100%;height:100%;-webkit-transform:translateZ(0);}

#boxview {background:#fff;border:8px solid #fff;width:600px;height:250px;position:absolute;top:33%;left:28%;}

#closebox {float:right;cursor:pointer;position:absolute;right:-1px;top:-2px;}

#closebox:before {content:&quot;Close&quot;;padding:5px 8px;background:#fff;color:#48cb7a;font-weight:normal;font-size:12px;font-family:Open sans;}

#boxlink,#boxlink a.visited,#boxlink a,#boxlink a:hover {color:#aaaaaa;font-size:9px;text-decoration:none;text-align:center;padding:5px;}

#subscribe-box {width:600px;height:250px;background-color:#02BA74;}

#subscribe-box p {font-family:&#39;Open Sans&#39;;font-size:18px;color:#fff;line-height:20px;padding:10px 20px 0 20px;margin:0;}

#subscribe-box .emailfield {padding:0px 20px 10px;}

#subscribe-box .emailfield input {background:#f9f9f9;color:#bbb;padding:10px;margin-top:10px;font-size:13px;font-family:&#39;Open Sans&#39;;width:96.3%;border:0;transition:all 0.4s ease-in-out;}

#subscribe-box .emailfield input:focus {background:#fff;outline:none;color:#888;}

#subscribe-box .emailfield .submitbutton {background:#444;color:#fff;text-transform:uppercase;font-weight:normal;font-size: 16px;border:none;outline:none;width:100%;cursor:pointer;border-radius:3px;transition:all 0.4s ease-in-out;}

#subscribe-box .emailfield .submitbutton:active {outline:none;border:none;background:#fff;color:#e25734;}
#subscribe-box .emailfield .submitbutton:hover{background:#fff;color:#444;}

الخطوة الثانية

الآن قم بعمل حفظ للقالب.
الخطوة الثانية
قم بالانتقال الآن إلى تخطيط
ثم اضافة اداة
ثم حدد HTML / Javascript والصق الكود التالي أدناه.

<script type=’text/javascript’>

//<![CDATA[

jQuery.cookie = function (key, value, options) {

// Pengaturan cookie

if (arguments.length > 1 && String(value) !== “[object Object]”) {

options = jQuery.extend({}, options);

if (value === null || value === undefined) {

options.expires = -1;

}

if (typeof options.expires === ‘number’) {

var days = options.expires, t = options.expires = new Date();

t.setDate(t.getDate() + days);

}

value = String(value);

return (document.cookie = [

encodeURIComponent(key), ‘=’,

options.raw ? value : encodeURIComponent(value),

options.expires ? ‘; expires=’ + options.expires.toUTCString() : ”, // use expires attribute, max-age is not supported by IE

options.path ? ‘; path=’ + options.path : ”,

options.domain ? ‘; domain=’ + options.domain : ”,

options.secure ? ‘; secure’ : ”

].join(”));

}

// cookie

options = value || {};

var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;

return (result = new RegExp(‘(?:^|; )’ + encodeURIComponent(key) + ‘=([^;]*)’).exec(document.cookie)) ? decode(result[1]) : null;

};

//]]>

</script>

<script type=’text/javascript’>

jQuery(document).ready(function($){

if($.cookie(‘popup_facebook_box’) != ‘yes’){

$(‘#sub-box’).delay(3000).fadeIn(‘fast’);

$(‘#closebox, #boxclose’).click(function(){

$(‘#sub-box’).stop().fadeOut(‘fast’);

});

}



});

</script>

<div id=’sub-box’>

<div id=’boxclose’>

</div>

<div id=’boxview’>

<div id=’closebox’>

</div>

<div id=’subscribe-box’>

<center><p>Subscribe for Latest Update</p></center>

<div class=’emailfield’>

<form action=’http://feedburner.google.com/fb/a/mailverify?uri=YOUR-USER-NAME’ method=’post’ onsubmit=’window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=YOUR-USER-NAME, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true’ target=’popupwindow’>

<input type=’text’ name=’name’ onblur=’if (this.value == &quot;&quot;) {this.value = &quot;Your Name&quot;;}’ onfocus=’if (this.value == &quot;Your Name&quot;) {this.value = &quot;&quot;;}’ value=’Your Name’/>

<input type=’text’ name=’email’ onblur=’if (this.value == &quot;&quot;) {this.value = &quot;Your Email&quot;;}’ onfocus=’if (this.value == &quot;Your Email&quot;) {this.value = &quot;&quot;;}’ value=’Your Email’/>

<input name=’uri’ type=’hidden’ value=’YOUR-USER-NAME’/>

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

<input class=’submitbutton’ type=’submit’ value=’Subscribe Now!’/>



</form>

</div></div>

</div>

</div>

ملاحظة: mr.4webwall.com يستبدل باسم مستخدم Feedburner الخاص بك.

استنتاج

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

mr-blooger

كيفية إضافة مربع الاشتراك في البريد الإلكتروني بلوجر

كيفية إضافة مربع الاشتراك في البريد الإلكتروني بلوجر