صندوق الإشتراك عن طريق البريد الإلكتروني لمدونات بلوجر (شكل احترافي)

السلام عليكم ورحمة الله تعالى وبركاته، هل لاحظت في تصفحك لبعظ المدونات والمنتديات العربية كانت أو الأجنبية كثرة المواضيع التي تأكد على أن القوائم البريدية هي السبيل إلى ربح زوار مهتمين وحقيقين (Tragic traffic) حيث تعد من أهم الأدوات التي يأكد عليها المتقدمين لاسيما في مجال التجارة الإلكترونة وكذا مجال التدوين . لذلك في هذا الدرس سنتطرق واياكم الى طريقة اضافة أداة الاشتراك في القوائم البريدية لمدونات البلوجر . الاضافة تعتمد على كود يتم وضعه في أداة javascript/Html .

• لمشاهدة مثال مباشر لهذه الأداة عبر الرابط التالي : مثال مياشر . (يوجد المثال في الأسفل)

لإضافة هاته الأداة إلى مدونتك المرجو تتبع الخطوات التالية : 

• توجه الى لوحة تحكم المدونة ;
• توجه الى تخطيط ;
• اضغط على اضافة أداة  Javascript/Html في أي مكان يحلو لك ;
• ثم الصق الكود الموجود في الأسفل في صندوق الكتابة ثم اضغط حفظ .

الكود :

      <style>          .subscriptionboc          {          border-style:solid;          border-width:2px;          border-color:#000;          padding:20px;          width:250px;              background:#fff;          transition: box-shadow .777s;          -webkit-transition: box-shadow .777s;          -moz-transition: box-shadow .777s;          -o-transition: box-shadow .777s;          -ms-transition: box-shadow .777s;          }          .paratraf          {               font-size:20px;              font-family:"Helvetica";              text-align:center;          color:#000;          }          .feed-links{display:none;}          .enteremail          {             background: url("http://i1203.photobucket.com/albums/bb382/chandeep10/btnt-custom-theme/email.png") no-repeat scroll 10px center #FFFFFF;              border-radius: 4px 4px 4px 4px;              box-shadow: 0 0 3px rgba(0, 0, 0, 0.05) inset;              color: #8B8B8B;              padding: 10px 40px;          border-style:solid;          border-width:2px;          border-color:#CACACA;          }          .forspace          {              padding:15px;          }          .button45          {               background: -moz-linear-gradient(center top , #30A146 0%, #249334 100%) repeat scroll 0 0 transparent;              border: 0 none;              border-radius: 4px 4px 4px 4px;              color: #000000;              cursor: pointer;              font-family: "Helvetica","Lucida Grande",Tahoma,sans-serif;              font-weight: bold;              padding: 10px 40px;              text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);              background:#29A3DB;              border: 0 none;              border-radius: 4px 4px 4px 4px;              color: #FFFFFF;              cursor: pointer;              font-family: "Lucida Grande",Tahoma,sans-serif;              font-weight: bold;              padding: 10px 40px;              text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);          }          </style>         <div class="subscriptionboc">             <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow"onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=***', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><div class="paratraf">اشترك معنا و كن السباق في التوصل بمستجداتنا.</div><p>         <div class="forspace">                     <center>                         <input class="enteremail" type="text" style="width:140px" name="email" value="بريدك الإلكتروني..." onfocus="if (this.value == &quot;بريدك الإلكتروني...&quot;) {this.value = &quot;&quot;}"/></center></div>                 </p>                 <input type="hidden" value="***" name="uri"/>                 <input type="hidden" name="loc" value="en_US"/>                             <center>                 <input class="button45" type="submit" value="اشترك الآن" /></center></form>         </div>

تخصيص الكود :

• *** : غير هذه النجوم باسم المستخدم الخاص برابط التغذية (الخلاصات) .
• 250 : لتغيير حجم الأداة . 
• اشترك معنا و كن السباق في التوصل بمستجداتنا. غيره بما يحلوا لك

اضغط زر الاعجاب اسفل ان أعجبتك الإضافة .

الكود مأخوذ من: مدونة محمد

قالب بلوجر