دورة البلوجر/الدرس التامن:شرح طريقة اضافة اداة القائمة البريدية على مدونة البلوجر

<div class="vidvid" id='it9an-emailsubsocial'>
            <div class='heading'>
            القائمة البريدية
            </div>
                 <p>سجل الان وتوصل بجديد مدونتنا</p>
            <div class='emailsub'>
            <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">
            <input type='text' name='name' placeholder='ضع اسمك ...' />
            <input type='text' name='email' placeholder='ضع اميلك ...' />
            <input type="hidden" value="it9an.com" name="uri"/>
            <input type="hidden" name="loc" value="en_US"/>
                        <input value="تسجيل الان" class="button" type="submit" />

            </form>
            </div>


            </div>

 <style type='text/css'>
     #it9an-emailsubsocial {
      width: 300px;
      height: 330px;
      border: 1px solid #ddd;
        border-radius: 5px 5px 0px 0px;
     }
     #it9an-emailsubsocial .heading {
padding: 15px 25px;
line-height: 35px;
font-size: 26px;
color: rgb(170, 170, 170);
text-align: center;
text-shadow: 0px 1px rgba(255, 255, 255, 0.75);
background: none repeat scroll 0% 0% rgb(247, 247, 247);
     }
   #it9an-emailsubsocial p {
    font-size: 13px;
    color: rgb(170, 170, 170);
    line-height: 25px;
    padding: 10px 20px 0 20px;
    margin: 0;
   }
   #it9an-emailsubsocial .emailsub {
    padding: 0px 20px 10px 20px;
   }
   #it9an-emailsubsocial .emailsub input {
    color: rgb(170, 170, 170);
    padding: 10px;
    margin-top: 10px;
    font-size: 15px;
    width: 92%;
    border: 1px solid #ccc;
    border-bottom: 2px solid #ccc;
    border-radius: 5px;
    transition:border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
   }
   #it9an-emailsubsocial .emailsub input:focus {
    border-color:#F4836A;
    outline: none;
    box-shadow: 0 0 2px 1px #F4836A;
   }
   #it9an-emailsubsocial .emailsub .button {
    background: #F4836A;
    color: white!important;
    border:none;
    outline: none;
    border-bottom: 3px solid #B3614E;
    transition:background .4s linear;
    width: 90%;
    margin-right: 5%;
    margin-left: 5%;
    cursor:pointer;
   }
   #it9an-emailsubsocial .emailsub .button:hover{
    background: #DD7761;
   }

     </style>