03-11-2014, 09:50 PM
#1
مدون نشيط
تاريخ التسجيل: Feb 2014
المشاركات: 124
اضافة القائمة البريدية لمدونة بلوجر - اضافات بلوجر
السلام عليكم ورحمة الله وبركاته
معنا اضافة القائمة البريدية او النشرة البريدية 2014 بتقنية سي اس اس css
الشرح :
اذهب الي صفحة التخطيط واضف اداة جديدة HTML واضف بها الكود التالي :
كود PHP:
< div id = "sidebars" style = "text-align: center;" >
< ul class= "sidebar_list" >
< li id = "social-profiles" >
< ul >
< li >
< a class= "social facebook" href = "رابط الفيس بوك" rel = "nofollow" target = "_blank" title = "Facebook Fan Page" > Facebook </ a ></ li >
< li >
< a class= "social twitter" href = "رابط تويتر" rel = "nofollow" target = "_blank" title = "Twitter Profile" > Twitter </ a >
</ li >
< li >
< a class= "social googleplus" href = "رابط جوجل بلس" rel = "nofollow" target = "_blank" title = "GooglePlus" > GooglePlus </ a >
</ li >
< li >
< a class= "social rss" href = "رابط التغذية" rel = "nofollow" target = "_blank" title = "RSS" > Rss </ a >
</ li >
< li >
< a class= "social youtube" href = "رابط اليوتيوب" 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.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=The-Area51', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target = "popupwindow" >
< input class= "input-text" name = "email" onblur = "if undefinedthis.value == '') {this.value = 'ادخل ايميلك هنا ...';}" onfocus = "if undefinedthis.value == 'ادخل ايميلك هنا ...') {this.value = '';}" type = "text" value = "ادخل ايميلك هنا ..." />
< input name = "uri" type = "hidden" value = "ايدي حسابك بالنشرة البريدية" />
< input name = "loc" type = "hidden" value = "en_US" />
< input class= "button" type = "submit" value = "اشترك" />
< br />
< 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://www.bloggerexp.com/" style = "color: black;" > احصل على الاضافه </ a ></ span >
</ form >
</ div >
</ li >
</ ul >
</ div >
< div style = "text-align: center;" >
< br /></ 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 >
اضف الروابط المطلوبة وايدي النشرة البريدية الخاص بك واحفظ العمل
__________________
من مواضيع Blog-Add