Chakira
11-01-2013, بتوقيت غرينيتش 08:08 AM
بسم الله الرحمن الرحيم
والصلآة والسلآم على اشرف الانبياء والمرسلين سيدنا محمد عليه وعلى اله افضل الصلآة واتم التسليم
السلآم عليكم ورحمة الله وبركاته
اضافة الاشتراك بالقائمة البريدية بشكل جميل واحترافي مدعم بتقنية css
اضافه بلغة CSS3 و شكل جديد من اشكال الاشتراك عبر القوائم البريدية بالاضافة الى المتابعة في مواقع التواصل الاجتماعي
http://2.bp.blogspot.com/-luznouvE7Jw/UY-YlZICiwI/AAAAAAAAAh8/uCzFce1EsPg/s1600/subscribe.gif
يوتيوب .
فيدبرنر .
جوجل GOOGLE بلس .
تويتر .
فيس بوك .
مثال حي
(http://www.e7tarif.com/)
كيفية اضافة الاداة :
انتقل إلى لوح تحكم مدونتك:
إختر "تخطيط"
ثم إضافة أداة .
ثم اختر HTML/Javascript
الآن الصق الكود code التالي مع استبدال ما سأذكره :
رمز Code:
<!--- Thesis Email Subscribe Widget by e7tarif.com ---> <div id="sidebars" style="text-align: center;"> <ul class="sidebar_list"> <li id="social-profiles"> <ul> <li> <a class="social facebook" href="https://www.facebook.com/beprof3ssional" rel="nofollow" target="_blank" title="Facebook Fan Page">Facebook</a></li> <li> <a class="social twitter" href="https://twitter.com/beprof3ssional" rel="nofollow" target="_blank" title="Twitter Profile">Twitter</a> </li> <li> <a class="social googleplus" href="https://plus.google.com/110265137644677073939" rel="nofollow" target="_blank" title="GooglePlus">GooglePlus</a> </li> <li> <a class="social rss" href="http://feeds.feedburner.com/e7tarif" rel="nofollow" target="_blank" title="RSS">Rss</a> </li> <li> <a class="social youtube" href="http://www.youtube.com/user/MrMedGeek" rel="nofollow" target="_blank" title="Youtube Channel">Youtube</a> </li> </ul> </li> <li id="sidebar-social"> <div id="email-notice"> <span style="font-family: tahoma; font-weight: bold;"></span>انضم الى القائمة البريدية واحصل على الجديد لحظة بلحظة </div> <div id="email-form"> <h6> اشترك في القائمة البريدية</h6> <form action="http://feedburner.google.com/fb/a/mailverify" class="nice custom" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=e7tarif', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"> <input class="input-text" name="email" onblur="if (this.value == '') {this.value = 'ادخل ايميلك هنا ...';}" onfocus="if (this.value == 'ادخل ايميلك هنا ...') {this.value = '';}" type="text" value="ادخل ايميلك هنا ..."> <input name="uri" type="hidden" value="jetara00"> <input name="loc" type="hidden" value="en_US"> <input class="button" type="submit" value="اشترك"> <span style="font-family: tahoma; font-weight: bold;">تابع جديد المدونه عبر الاشتراك في خدمة البريد الالكتروني </span> <span style="float: right; font-size: 10px; font-weight: normal; line-height: 0px; margin-top: 15px;"> <a href="http://e7tarif.com" style="color: black;">احصل على الاضافه</a></span> </form> </div> </li> </ul> </div> <div style="text-align: center;"> </div> <div style="text-align: center;"> <style> #sidebars { border: 0 none; float: right; padding: 0 15px; width: 310px;} #email-notice { background: none repeat scroll 0 0 #66CCFF; color: #000000; font-size: 14px; line-height: 1.5; margin: 0 0 20px; padding: 15px 20px; position: relative; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);} #email-notice span { border-left: 14px solid transparent; border-right: 14px solid transparent; border-top: 10px solid #66CCFF; bottom: -10px; height: 0; position: absolute; right: 40px; width: 0;} #email-form { background: none repeat scroll 0 0 padding-box #313131; border-bottom: 5px solid #202020; border-radius: 2px 2px 2px 2px; text-shadow: 0 -1px 0 #000000;} #email-form h6 { color: #FFFFFF; font-family: arial; font-size: 16px; font-weight: bold; letter-spacing: 0; padding: 15px 20px 0; text-transform: none;} #email-form form { color: #FFFFFF; margin: 0; padding: 20px 18px;} #email-form input.input-text { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #222222; margin: 0 0 10px; padding: 8px; width: 94%;font-family: tahoma;} #email-form .button { background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FFCA00),color-stop(1,#FF9B00)); background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%); -pie-background: linear-gradient(270deg,#ffca00,#ff9b00); font-family: "tahoma","Helvetica",sans-serif; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #cc7c00; color: white; text-shadow: #d08d00 1px 1px 0; font-weight: bold; font-size: 12px; width: 100px; height: 30px; cursor: pointer; float: right; border-image: initial;} #email-form p { color: #CCCCCC; font-size: 12px; font-family: tahoma; line-height: 18px; margin: 0;} #sidebar-social { float: left; font-size: 12px; margin: 0 0 15px;font-family: tahoma; width: 100%;} ul.sidebar_list { list-style: none outside none;} li.widget ul { list-style: none outside none;} #social-profiles { float: left;} #social-profiles ul { float: left; list-style: none outside none; margin: 0 5px 20px;} #social-profiles ul li { float: left;} #social-profiles ul li a { display: block; float: left; height: 32px; margin: 0 15px; text-indent: -999em; width: 32px;} #social-profiles a.social { background: url("http://1.bp.blogspot.com/-iyMNWqbxNls/UGlLYtLKIgI/AAAAAAAAGw0/SuMYnqQiXt4/s1600/social.png") no-repeat scroll 0 0 transparent;} #social-profiles a.facebook { background-position: -79px 0; height: 32px; margin: 0 15px 0 5px; width: 32px; } #social-profiles a.facebook:hover { background-position: -79px -74px; height: 32px; width: 32px;} #social-profiles a.twitter { background-position: -5px -111px; height: 32px; width: 32px;} #social-profiles a.twitter:hover { background-position: -42px 0; height: 32px; width: 32px;} #social-profiles a.youtube { background-position: -42px -37px; height: 32px; width: 32px;} #social-profiles a.youtube:hover { background-position: -5px -37px; height: 32px; width: 32px;} #social-profiles a.rss { background-position: -42px -74px; height: 32px; width: 32px;} #social-profiles a.rss:hover { background-position: -79px -37px; height: 32px; width: 32px;} #social-profiles a.googleplus { background-position: -5px 0; height: 32px; width: 32px;} #social-profiles a.googleplus:hover { background-position: -5px -74px; height: 32px; width: 32px;} * { margin: 0; padding: 0; }.custom .sidebar ul.sidebar_list { padding: 15px 0; } </style></div> <!--- Thesis Email Subscribe Widget by e7tarif.com --->
يجب استبدال التالي :
قم باستبدل Beprof3ssionalباسم حسابك في فيس بوك .
قم باستبدل e7tarifباسم حسابك في فيد برنر .
قم باستبدل Beprof3ssional باسم حسابك في تويتر .
قم باستبدل 110265137644677073939 رقم الاي دي الخاص بحسابك في جوجل GOOGLE .
قم باستبدل MrMedGeek باسم قناتك في يوتيوب .
قم باستبدل e7tarif باسم حسابك في فيدبرنر (القائمه البريديه)
وبالاخير قم بحفظ الاداه ومبروك عليك الاضافه
اذا كان عندكم اي استفسار او واجهتكم مشكله عند اضافة الاداه يمكنكم وضع تعليق وسيتم الرد عليكم ان شاء الله.
المصدر : مدونة blog إحترف التدوين (http://www.e7tarif.com/2014/05/subscribe-css.html)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
والصلآة والسلآم على اشرف الانبياء والمرسلين سيدنا محمد عليه وعلى اله افضل الصلآة واتم التسليم
السلآم عليكم ورحمة الله وبركاته
اضافة الاشتراك بالقائمة البريدية بشكل جميل واحترافي مدعم بتقنية css
اضافه بلغة CSS3 و شكل جديد من اشكال الاشتراك عبر القوائم البريدية بالاضافة الى المتابعة في مواقع التواصل الاجتماعي
http://2.bp.blogspot.com/-luznouvE7Jw/UY-YlZICiwI/AAAAAAAAAh8/uCzFce1EsPg/s1600/subscribe.gif
يوتيوب .
فيدبرنر .
جوجل GOOGLE بلس .
تويتر .
فيس بوك .
مثال حي
(http://www.e7tarif.com/)
كيفية اضافة الاداة :
انتقل إلى لوح تحكم مدونتك:
إختر "تخطيط"
ثم إضافة أداة .
ثم اختر HTML/Javascript
الآن الصق الكود code التالي مع استبدال ما سأذكره :
رمز Code:
<!--- Thesis Email Subscribe Widget by e7tarif.com ---> <div id="sidebars" style="text-align: center;"> <ul class="sidebar_list"> <li id="social-profiles"> <ul> <li> <a class="social facebook" href="https://www.facebook.com/beprof3ssional" rel="nofollow" target="_blank" title="Facebook Fan Page">Facebook</a></li> <li> <a class="social twitter" href="https://twitter.com/beprof3ssional" rel="nofollow" target="_blank" title="Twitter Profile">Twitter</a> </li> <li> <a class="social googleplus" href="https://plus.google.com/110265137644677073939" rel="nofollow" target="_blank" title="GooglePlus">GooglePlus</a> </li> <li> <a class="social rss" href="http://feeds.feedburner.com/e7tarif" rel="nofollow" target="_blank" title="RSS">Rss</a> </li> <li> <a class="social youtube" href="http://www.youtube.com/user/MrMedGeek" rel="nofollow" target="_blank" title="Youtube Channel">Youtube</a> </li> </ul> </li> <li id="sidebar-social"> <div id="email-notice"> <span style="font-family: tahoma; font-weight: bold;"></span>انضم الى القائمة البريدية واحصل على الجديد لحظة بلحظة </div> <div id="email-form"> <h6> اشترك في القائمة البريدية</h6> <form action="http://feedburner.google.com/fb/a/mailverify" class="nice custom" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=e7tarif', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"> <input class="input-text" name="email" onblur="if (this.value == '') {this.value = 'ادخل ايميلك هنا ...';}" onfocus="if (this.value == 'ادخل ايميلك هنا ...') {this.value = '';}" type="text" value="ادخل ايميلك هنا ..."> <input name="uri" type="hidden" value="jetara00"> <input name="loc" type="hidden" value="en_US"> <input class="button" type="submit" value="اشترك"> <span style="font-family: tahoma; font-weight: bold;">تابع جديد المدونه عبر الاشتراك في خدمة البريد الالكتروني </span> <span style="float: right; font-size: 10px; font-weight: normal; line-height: 0px; margin-top: 15px;"> <a href="http://e7tarif.com" style="color: black;">احصل على الاضافه</a></span> </form> </div> </li> </ul> </div> <div style="text-align: center;"> </div> <div style="text-align: center;"> <style> #sidebars { border: 0 none; float: right; padding: 0 15px; width: 310px;} #email-notice { background: none repeat scroll 0 0 #66CCFF; color: #000000; font-size: 14px; line-height: 1.5; margin: 0 0 20px; padding: 15px 20px; position: relative; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);} #email-notice span { border-left: 14px solid transparent; border-right: 14px solid transparent; border-top: 10px solid #66CCFF; bottom: -10px; height: 0; position: absolute; right: 40px; width: 0;} #email-form { background: none repeat scroll 0 0 padding-box #313131; border-bottom: 5px solid #202020; border-radius: 2px 2px 2px 2px; text-shadow: 0 -1px 0 #000000;} #email-form h6 { color: #FFFFFF; font-family: arial; font-size: 16px; font-weight: bold; letter-spacing: 0; padding: 15px 20px 0; text-transform: none;} #email-form form { color: #FFFFFF; margin: 0; padding: 20px 18px;} #email-form input.input-text { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #222222; margin: 0 0 10px; padding: 8px; width: 94%;font-family: tahoma;} #email-form .button { background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%); background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FFCA00),color-stop(1,#FF9B00)); background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%); -pie-background: linear-gradient(270deg,#ffca00,#ff9b00); font-family: "tahoma","Helvetica",sans-serif; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #cc7c00; color: white; text-shadow: #d08d00 1px 1px 0; font-weight: bold; font-size: 12px; width: 100px; height: 30px; cursor: pointer; float: right; border-image: initial;} #email-form p { color: #CCCCCC; font-size: 12px; font-family: tahoma; line-height: 18px; margin: 0;} #sidebar-social { float: left; font-size: 12px; margin: 0 0 15px;font-family: tahoma; width: 100%;} ul.sidebar_list { list-style: none outside none;} li.widget ul { list-style: none outside none;} #social-profiles { float: left;} #social-profiles ul { float: left; list-style: none outside none; margin: 0 5px 20px;} #social-profiles ul li { float: left;} #social-profiles ul li a { display: block; float: left; height: 32px; margin: 0 15px; text-indent: -999em; width: 32px;} #social-profiles a.social { background: url("http://1.bp.blogspot.com/-iyMNWqbxNls/UGlLYtLKIgI/AAAAAAAAGw0/SuMYnqQiXt4/s1600/social.png") no-repeat scroll 0 0 transparent;} #social-profiles a.facebook { background-position: -79px 0; height: 32px; margin: 0 15px 0 5px; width: 32px; } #social-profiles a.facebook:hover { background-position: -79px -74px; height: 32px; width: 32px;} #social-profiles a.twitter { background-position: -5px -111px; height: 32px; width: 32px;} #social-profiles a.twitter:hover { background-position: -42px 0; height: 32px; width: 32px;} #social-profiles a.youtube { background-position: -42px -37px; height: 32px; width: 32px;} #social-profiles a.youtube:hover { background-position: -5px -37px; height: 32px; width: 32px;} #social-profiles a.rss { background-position: -42px -74px; height: 32px; width: 32px;} #social-profiles a.rss:hover { background-position: -79px -37px; height: 32px; width: 32px;} #social-profiles a.googleplus { background-position: -5px 0; height: 32px; width: 32px;} #social-profiles a.googleplus:hover { background-position: -5px -74px; height: 32px; width: 32px;} * { margin: 0; padding: 0; }.custom .sidebar ul.sidebar_list { padding: 15px 0; } </style></div> <!--- Thesis Email Subscribe Widget by e7tarif.com --->
يجب استبدال التالي :
قم باستبدل Beprof3ssionalباسم حسابك في فيس بوك .
قم باستبدل e7tarifباسم حسابك في فيد برنر .
قم باستبدل Beprof3ssional باسم حسابك في تويتر .
قم باستبدل 110265137644677073939 رقم الاي دي الخاص بحسابك في جوجل GOOGLE .
قم باستبدل MrMedGeek باسم قناتك في يوتيوب .
قم باستبدل e7tarif باسم حسابك في فيدبرنر (القائمه البريديه)
وبالاخير قم بحفظ الاداه ومبروك عليك الاضافه
اذا كان عندكم اي استفسار او واجهتكم مشكله عند اضافة الاداه يمكنكم وضع تعليق وسيتم الرد عليكم ان شاء الله.
المصدر : مدونة blog إحترف التدوين (http://www.e7tarif.com/2014/05/subscribe-css.html)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
