الرئيسية / أضافات بلوجر / أفضل أدوات متابعة البريد الألكتروني للبلوجر

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

المؤلف -  Mustafa Prince



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

1-النموذج الأول

خطوات تركيب النموذج الأول
1-توجة الى بلوجر ومن ثم المظهر وأختر تحرير HTML
2-قم بالبحث عن كود <head>
3-قم بنسخ ولصق الكود التالي تحت الكود <head> 
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
<link href='//fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'/>

4-قم بالبحث مرة أخرى عن كود ]]></b:skin>
5-قم بنسخ ولصق الكود التالي فوق الوسم ]]></b:skin>
#subscribebox{background:#576269;padding:20px;font-family:&#39;PT Sans&#39;,sans-serif;}
.widget_follow_subscribe .widget-detail{padding:36px 30px 40px}
#subscribebox p{color:#fff;font-size:15px;text-align:center;font-weight:700}
.follow-subscribe-social{margin:0 0 15px;padding:0 0 14px;border-bottom:#858585 solid 1px}
.follow-subscribe-social ul{list-style:none;margin:0;padding:0;text-align:center}
.follow-subscribe-social ul li{display:inline;margin:0 15px 0 0;border-bottom:none}
.follow-subscribe-social ul li:last-child{margin:0}
.follow-subscribe-social ul li a{font-size:17px;color:#cacaca;-webkit-transition:color .2s ease-in-out;-moz-transition:color .2s ease-in-out;-ms-transition:color .2s ease-in-out;-o-transition:color .2s ease-in-out;transition:color .2s ease-in-out}
.follow-subscribe-social ul li a:hover{color:#fff}
form.subscribe{margin-top:-7px}
form.subscribe input{display:block;width:100%}
.subscribe-email{height:45px;border:none;margin:0 0 10px;font-size:.928571em;background-color:rgba(255,255,255,0.2);text-align:center;color:#fff}
.subscribe-email:focus{outline:0}
form.subscribe .placeholder{color:#cacaca}
form.subscribe input:-ms-input-placeholder{color:#cacaca}
form.subscribe input::-webkit-input-placeholder{color:#cacaca}
form.subscribe input:-moz-placeholder{color:#fafafa}
form.subscribe input::-moz-placeholder{color:#fafafa}
.subscribe-button{height:45px;font-weight:700;font-size:16px;color:#fff;text-transform:uppercase;border:none;background-color:#F35D5C;-webkit-transition:background-color .2s ease-in-out;-moz-transition:background-color .2s ease-in-out;-ms-transition:background-color .2s ease-in-out;-o-transition:background-color .2s ease-in-out;transition:background-color .2s ease-in-out}
.subscribe-button:hover{background-color:#f1d640}
.subscribe-button:focus{outline:0}
.creadit a{color: #A7A6A6; float: right; font-size: 8px;}
6- توجة الى التخطيط وقم بنسخ ولصق الكود التالي في الأداة 
<div id="subscribebox">
<div class="follow-subscribe-social">
<ul>
<li><a href="#" target="_blank"><i class="fa fa-facebook"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-twitter"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-linkedin"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-google"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-pinterest-p"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-dribbble"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-instagram"></i></a></li>
</ul>
</div>
<p>الاشتراك في النشرة الإخبارية الخاصة بالمدونة</p>
<form class="subscribe" 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 name='uri' type='hidden' value='YOUR-USER-NAME'/>
<input name='loc' type='hidden' value='en_US'/>
<input class="subscribe-email" 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='بريدك الألكتروني'/>
<input class="subscribe-button" type="submit" value="أشترك" />
</form>
</div>
<div class="creadit">
<a href="http://msdesignbd.com" rel="dofollow" target="_blank"> الحصول على هذه الأضافة</a></div>

7-قم بتغيير كلمة "YOUR-USER-NAME"الى رابط الفيدبنر "feedburner" الخاص بك وغير كذلك الروبط الأجتماعية
 8-قم بعملية الحفظ



2-النموذج الثاني


خطوات تركيب النموذج الثاني

1-قم بالبحث مرة أخرى عن كود ]]></b:skin>
2-قم بنسخ ولصق الكود التالي فوق الوسم ]]></b:skin>
#subscribe-box {background-color:#0CC388;font-family: 'PT Sans', sans-serif;}
#subscribe-box p {font-size:22px;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;width:100%;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:700;font-size:18px;font-family: 'PT Sans', sans-serif;;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;} 
.creadit a{color: #A7A6A6; float: right; font-size: 8px
3- توجة الى التخطيط وقم بنسخ ولصق الكود التالي في الأداة 
<div id="subscribe-box">
<center>
اشترك لدينا وسوف تحصل على آخر الأخبار والتحديثات</center>
<div class="emailfield">
<form action="http://feedburner.google.com/fb/a/mailverify?uri=USER-NAME" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=USER-NAME, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input 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;;}" type="text" value="أدخل أسمك" />
<input 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;;}" type="text" value="أدخل بريدك الألكتروني" />
<input name="uri" type="hidden" value="USER-NAME" />
<input name="loc" type="hidden" value="en_US" />
<input class="submitbutton" type="submit" value="أشترك الأن" />

</form>
</div>
</div>
<div class="creadit">
<a href="http://msdesignbd.com/" rel="dofollow" target="_blank"> أحصل على هذه الأداة</a></div>

4-قم بتغيير كلمة "YOUR-USER-NAME"الى رابط الفيدبنر "feedburner" الخاص بك
5-قم بعملية الحفظ



3-النموذج الثالث

خطوات تركيب النموذج الثالث
1-توجة الى لوحة التحكم وأختر التخطيط
2-قم بأضافة أداة جديدة
3-قم بنسخ ولصق الكود التالي في الأداة الجديدة 
<style>
/*-------------------- font --------------------*/
@font-face {
font-family: "Ta3alamFont";
font-weight: normal;
font-style: normal;
src: url(https://dl.dropboxusercontent.com/s/l0mqm6g2vwflxp2/Ta3alamFont.eot);
src: url(https://dl.dropboxusercontent.com/s/l0mqm6g2vwflxp2/Ta3alamFont.eot?#iefix) format('embedded-opentype'),
url(https://dl.dropboxusercontent.com/s/gjkkuvnfze5ii1l/Ta3alamFont.woff) format('woff'),
url(https://dl.dropboxusercontent.com/s/mjj8mvkq7jgihhn/Ta3alamFont.ttf) format('truetype');
}
/*-------------------- #font# --------------------*/
.FollowBEmail{
    margin: -11px;
    padding: 20px 5px;
    background: #FFBE00;
    border-radius: 5px;
    border: 1px solid #FFBE00;
}
.FollowBEmail h3{
text-align: center;
    font-size: 22px;
    color: #383838;
    font-weight: normal;
    height: 40px;
}
.FollowBEmail i{
    margin: 0px 0px 0px 5px;
}
.follow-by-email-inner {
width: 280px;
    margin: 0 auto;
}
.FollowByEmail td {
    float: right;
    width: 100%;
}
.follow-by-email-address {
    width: 200px;
    height: 38px;
    border-radius: 0px 5px 5px 0px;
    border: 1px solid #FFFFFF;
    font-size: 14px;
    padding: 0px 10px;
    background: #FFFFFF;
    margin: 0px 0px 0px -4px;
}

.follow-by-email-submit {
    width: 56px;
    border-radius: 8px 0px 0px 8px;
    height: 40px;
    font-size: 17px;
    color: #FFFFFF;
    background: #383838;
    border: 1px solid #383838;
    padding: 0px 5px;
    cursor: pointer;
}
.follow-by-email-submit:hover {
    color: #FFBE00;
}
</style>
<div class="FollowBEmail">
<h3>
<i class="fa fa-envelope"></i>إشترك بالنشرة البريدية</h3>
<div class="follow-by-email-inner">
<form action="https://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open("https://feedburner.google.com/fb/a/mailverify?uri=raghib", "popupwindow", "scrollbars=yes,width=550,height=520"); return true" target="popupwindow">
<table width="100%">
<tbody>
<tr>
<td>
<input class="follow-by-email-address" name="email" placeholder="ضع اميلك هنا" type="text" />
</td>
<td width="64px">
<input class="follow-by-email-submit" type="submit" value="إشترك الأن" />
</td>
</tr>
</tbody></table>
<input name="uri" type="hidden" value="Raghib" />
<input name="loc" type="hidden" value="en_US" />
</form>
</div>
</div>



شارك هذا الموضوع

0 تعليق

إرسال تعليق

الاشتراك في: تعليقات الرسالة (Atom)