صندوق رائع وكبيرالاشتراك عبر البريد لمدونة بلوجر

شاركه على +Googleأضفه الى Deliciousشاركه على Twetter شاركه على Facebookأضفه الى StumbleUpon أضفه الى Digg

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

طريقة التركيب
1 اذهب للوحة التحكم

2. تخطيط 

3.عناصر الصفحة

4. اضف اداة

6.اختار  Html/Javascript

 هدا هو الكود

<center>
<div id="feature_box">
          <div id="sleek-subscribe">
                  <div class="newsheadline"><cite>اشترك الان واحصل على اخر مواضيعنا</cite> .</div>



<div id="email-news-subscribe"> <!-- Email Subscribe --> <div class="email-box">

    <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=chamelcool/rInPq', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"> 
            <input class="email" type="text" style="width: 450px; font-size: 15px;" id="email" name="email" value="أدخل بريدك الالكتروني هنا لتحصل على اخر مواضيع 'مدونة شامل كول' الحصرية" onfocus="if(this.value==this.defaultValue)this.value=&#39;&#39;;" onblur="if(this.value==&#39;&#39;)this.value=this.defaultValue;" />     
            <input type="hidden" value="chamelcool/rInPq" name="uri" />
            <input type="hidden" name="loc" value="ar_AR" />
            <input class="subscribe" name="commit" type="submit" value="اشترك" /> 
        </form>


    </div> </div>


      </div>    
</div></center>

<style>
/*---:[ feature box ]:---*/
#feature_box { background: #eee; border-style: solid; border-color: #ddd; }

/*---:[ home page teasers ]:---*/
.teaser a.teaser_link:hover { text-decoration: underline; }
.teaser .teaser_author { font-style: italic; }
    .teaser .teaser_author .author { font-style: normal; text-transform: uppercase; letter-spacing: 1px; }
.teaser .edit_post { letter-spacing: 1px; }
    .teaser .teaser_author a, .teaser a.teaser_comments, .teaser a.teaser_category, .teaser .edit_post a { text-transform: uppercase; letter-spacing: 1px; color: #888; border-bottom: 1px solid #eee; }
    .teaser .teaser_author a { font-style: normal; }
    .teaser .format_teaser a { text-decoration: underline; }
    .teaser .format_teaser a:hover { text-decoration: none; }

/*---:[ border package ]:---*/
#header, .post_box, .teasers_box, #footer, .image_box, .custom_box, #feature_box, #archive_intro, .prev_next, #comment_nav_2 { border-width: 0; }

/*Featured Box*/
.custom #feature_box{background:#f0f4f4; border:1px solid #d9eaea; padding:10px 15px 5px;}
      
/* Subscription Box */
#sleek-subscribe{display: block; margin:0 auto; }
.newsheadline {padding-left:20px;color:#222; font-size:20px; line-height:50px; float:left; font-weight:bold;}
    .newsheadline span{font-size:38px; color:#444; line-height:14px; font-family:"Trebuchet MS"; font-weight:normal;}
    .newsheadline cite{font-style:normal; color:#f00;}
.signform{background:url('images/form-bg.jpg') no-repeat;padding:0 0 10px 100px; float:right; }
      .txt2, .txt2:focus{width:140px; font-size:15px; background:#fff; color:#92c3c3; border:1px solid #E36B0A; margin:0 5px; float:left; padding:10px; width:160px; border-radius: 10px;}
      .btn2, .btn2:focus {background:#E36B0A; margin:0 5px; padding:8px 10px 9px; border:1px solid #AD5513; color:#fff; font-size:15px; border-radius:10px;}
            .btn2:hover{background:#6689b0; }

#email-news-subscribe .email-box{
        padding: 5px 10px;
        font-family: "Arial","Helvetica",sans-serif;
        border-top: 0;
        border-right: 1px solid #C7DBE2;
        border-left: 1px solid #C7DBE2;
        border-image: initial;
       height:34px;}
    #email-news-subscribe .email-box input.email{
        background:#FFFFFF;
        border: 1px solid #dedede;
        color: #999;
        padding: 7px 10px 8px 10px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        -o-border-radius: 3px;
        -ms-border-radius: 3px;
        -khtml-border-radius: 3px;
        border-radius: 3px;
        border-image: initial;
        font-family: "Arial","Helvetica",sans-serif;} 
    #email-news-subscribe .email-box input.email:focus{color:#333} 
    #email-news-subscribe .email-box input.subscribe{
        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: "Arial","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;
        padding:7px 14px;
        margin-left:3px;
        font-weight:bold;
        font-size:12px;
        cursor:pointer;
        border-image: initial;}
    #email-news-subscribe .email-box input.subscribe:hover{
        background: #ff9b00;
        background-image:-moz-linear-gradient(top,#ffda4d,#ff9b00);
        background-image:-webkit-gradient(linear,left top,left bottom,from(#ffda4d),to(#ff9b00));
        filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#ebebeb);
        outline:0;-moz-box-shadow:0 0 3px #999;
        -webkit-box-shadow:0 0 3px #999;
        box-shadow:0 0 3px #999
        background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#ffda4d),color-stop(1,#ff9b00));
        background:-moz-linear-gradient(center top,#ffda4d 0,#ff9b00 100%);
        -pie-background:linear-gradient(270deg,#ffda4d,#ff9b00);
        border-radius:3px;
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
        border:1px solid #cc7c00;
        color:#FFFFFF;
        text-shadow:#d08d00 1px 1px 0} 
    #other-social-bar {
        background-color: #D8E6EB;
        box-shadow: 0 1px 1px #FFFFFF inset;
        padding: 0px;
        font-family: "Arial","Helvetica",sans-serif;
        font-weight:bold;
        overflow: hidden;
        border: 1px solid #B6D0DA;
           height:57px;
    }
</style>

<!--[if IE]>

    <style>
    #email-news-subscribe .email-box input.subscribe{
        background: #FFCA00;
        }
    </style>

    <![endif]-->

ملاحضة :
*غير    chamelcool/rInPq   بعنوان التغدية الخاص بمدونتك ,هنالك اثنان

*ويمكنك تغير عرض الاداة اد لم تتناسب مع مدونتك بتغير width: 450

*وأيضا يمكنك تغير الجمل دات الخلفية الصفراء في الكود بجملك الخاصة

ثم احفض الاداة


وهدا كل شىء والسلام عليكم

Tweet

Social Sharing Widget bychamelcool

التصنيف : أدوات بلوجر