ابحث عن الكاتب البريد الإلكتروني... تم الإسم البريد الإلكتروني رسالة عني صفحة ##1## من ##2## يناير فبراير مارس أبريل مايو يونيو يوليو أغسطس سبتمبر أكتوبر نوفمبر ديسمبر

عبدالرحمن وصفي

[name=عبدالرحمن وصفي] [img=https://3.bp.blogspot.com/-q8ZjAKbhXp8/XpdQo6nm90I/AAAAAAAAEz0/ISfG5bL3X6YDnvY_QTdgX4HkTJT1qLkkQCK4BGAYYCw/s113/93822916_1115139188840796_7228792286904057856_n.jpg] [description=مبرمج مواقع ومطور تطبيقات الهواتف، أعمل إيضًا بأدارة السيرفرات ومحاضر في مجال أمن المعلومات ومدرب معتمد على منصة Udemy الأمريكية.] (facebook=https://www.facebook.com/AbdullrahmanWasfi) (youtube=https://www.youtube.com/c/technojordan) (twitter=https://www.twitter.com/Mr3bdullrahman) (linkedin=https://www.linkedin.com/in/abdullrahmanwasfi) (instagram=https://www.instagram.com/abdw.tech)

4/bigslider1/أحدث الشروحات/recent

4/newsticker/شائع/recent

404

Sorry, this page is not avalable
Home

6/carousel3/حلقات

3/block1/ايفون

6/block3/ألعاب

أحدث الشروحات

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

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

سأقدم لك أربعة أشكال !
الأشكال الأربعة بنفس التصميمّ، لكن بألوان مختلفة، لنأتي ونتعرف عليهما، نبدأ على بركة الله تعالى.
#طريقة التركيب:
نقوم بأضافة الكود الخاص بالشكل المعين في أداة HTML، أو أن كنت تملك موقع فبأمكانك أضافته حسب رغبتكّ، نأتي ونتعرف عليهما.
#معاينة
الشكل الأول:
اللون الكحلي.


<style>
@import url(http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css);
#subscribe-box {background-color:#293a49;}
#subscribe-box p {font-size: 18px; color: #fff; padding: 10px 20px 0 20px; margin: 0; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; text-align: center;}
#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; font-family: tahoma; border-radius: 2px!important;}
#subscribe-box .emailfield input:focus {background:#fff;outline:none;color:#888;}
#subscribe-box .emailfield .submitbutton {background: #00cdff; color: #fff;font-weight: 700; font-size: 16px; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; border: none; outline: none; width: 100%; cursor: pointer; border-radius: 3px!important; 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;} 
</style>
<div id="subscribe-box">
<p class="0prof0">
أشترك في الموقع</p>
<div class="emailfield">
<form action="http://feedburner.google.com/fb/a/mailverify?uri=0prof0" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=0prof0, '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="0prof0" />
<input name="loc" type="hidden" value="en_US" />
<input class="submitbutton" type="submit" value="اشترك الآن" />
</form>
</div>
</div>
الشكل الثاني:
اللون الأحمر.


<style>
@import url(http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css);
#subscribe-box {background-color:#444;}
#subscribe-box p {font-size: 18px; color: #fff; padding: 10px 20px 0 20px; margin: 0; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; text-align: center;}
#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; font-family: tahoma; border-radius: 2px!important;}
#subscribe-box .emailfield input:focus {background:#fff;outline:none;color:#888;}
#subscribe-box .emailfield .submitbutton {background: #00cdff; color: #fff;font-weight: 700; font-size: 16px; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; border: none; outline: none; width: 100%; cursor: pointer; border-radius: 3px!important; 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;} 
</style>
<div id="subscribe-box">
<p class="0prof0">
أشترك في الموقع</p>
<div class="emailfield">
<form action="http://feedburner.google.com/fb/a/mailverify?uri=0prof0" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=0prof0, '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="0prof0" />
<input name="loc" type="hidden" value="en_US" />
<input class="submitbutton" type="submit" value="اشترك الآن" />
</form>
</div>
</div>
الشكل الثالث:
اللون أخضر.


<style>
@import url(http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css);
#subscribe-box {background-color:#27ae60;}
#subscribe-box p {font-size: 18px; color: #fff; padding: 10px 20px 0 20px; margin: 0; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; text-align: center;}
#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; font-family: tahoma; border-radius: 2px!important;}
#subscribe-box .emailfield input:focus {background:#fff;outline:none;color:#888;}
#subscribe-box .emailfield .submitbutton {background: #00cdff; color: #fff;font-weight: 700; font-size: 16px; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; border: none; outline: none; width: 100%; cursor: pointer; border-radius: 3px!important; 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;} 
</style>
<div id="subscribe-box">
<p class="0prof0">
أشترك في الموقع</p>
<div class="emailfield">
<form action="http://feedburner.google.com/fb/a/mailverify?uri=0prof0" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=0prof0, '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="0prof0" />
<input name="loc" type="hidden" value="en_US" />
<input class="submitbutton" type="submit" value="اشترك الآن" />
</form>
</div>
</div>
الشكل الرابع:
اللون الأصفر.


<style>
@import url(http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css);
#subscribe-box {background-color:yallow;}
#subscribe-box p {font-size: 18px; color: #fff; padding: 10px 20px 0 20px; margin: 0; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; text-align: center;}
#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; font-family: tahoma; border-radius: 2px!important;}
#subscribe-box .emailfield input:focus {background:#fff;outline:none;color:#888;}
#subscribe-box .emailfield .submitbutton {background: #00cdff; color: #fff;font-weight: 700; font-size: 16px; font-family: 'Noto Sans Kufi Arabic', sans-serif!important; border: none; outline: none; width: 100%; cursor: pointer; border-radius: 3px!important; 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;} 
</style>
<div id="subscribe-box">
<p class="0prof0">
أشترك في الموقع</p>
<div class="emailfield">
<form action="http://feedburner.google.com/fb/a/mailverify?uri=0prof0" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=0prof0, '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="0prof0" />
<input name="loc" type="hidden" value="en_US" />
<input class="submitbutton" type="submit" value="اشترك الآن" />
</form>
</div>
</div>

#التعديلات اللازمة:
قم بتغيير رمز 0prof0، بالأسم المستخدم الخاص بك في التغذية، Feedburner.





أقرأ:

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

ليست هناك تعليقات:

إرسال تعليق