03-06-2014, 02:12 PM
#1
مدون نشيط
تاريخ التسجيل: Feb 2014
المشاركات: 124
اضافة صندوق متابعة تويتر 2014 - اضافات بلوجر
السلام عليكم ورحمة الله وبركاته
اقدم لكم اضافة صندوق المتابعة في تويتر في مدونتك بشكل انيق 2014
الشرح :
اذهب الي صفحة التخطيط وافتح اداة جديدة HTML واضف بها الكود التالي :
كود PHP:
< style >
. SG - tweter - header {
background : #000 url(http://softglad.at.ua/widgets/black-bg.jpg);
}
. SG - tweter {
width : 266px ;
background - color : #ffffff;
font - family : Arial , Helvetica , sans - serif ;
border - radius : 0 ;
}
. SG - tweter . SG - tweter - header {
padding : 10px ;
height : 73px ;
}
. SG - tweter . SG - tweter - header . screen - name h1 {
color : #fff;
margin : 0 ;
font - size : 16px ;
text - transform : capitalize ;
font - family : 'Helvetica' , sans - serif ;
}
. SG - tweter . SG - tweter - header . screen - name h2 , . SG - tweter . SG - tweter - header . screen - name h3 {
color : #ffffff;
margin : 0 ;
font - size : 12px ;
font - family : 'Helvetica' , sans - serif ;
background : none ;
}
. SG - tweter . SG - tweter - header . screen - name {
margin - top : 20px ;
width : 150px ;
float : left ;
}
. SG - tweter . SG - tweter - header . profile - image {
width : 70px ;
height : 70px ;
float : right ;
}
. SG - tweter . SG - tweter - header . profile - image img {
width : 70px ;
height : 70px ;
border - radius : 40px ;
}
. SG - tweter . twitter - summary {
background - color : #f9f9f9;
height : 60px ;
position : relative ;
}
. SG - tweter . twitter - summary ul {
display : table - row ;
height : 60px ;
width : 100 %;
margin : 0 ;
padding : 0 ;
text - align : center ;
padding : 15px 0px ;
}
. SG - tweter . twitter - summary ul li {
background : #0AB7E2;
list- style - type : none ;
font - size : 12px ;
padding : 0px 6px ;
text - align : center ;
vertical - align : middle ;
display : table - cell ;
color : #fff;
width : 84px ;
- webkit - transition : .5s ;
- moz - transition : .5s ;
- ms - transition : .5s ;
- o - transition : .5s ;
transition : .5s ;
border : 0 ;
}
. SG - tweter . twitter - summary ul li : hover {
background : #9808AC;
- webkit - box - shadow : 0px 5px 5px 0px #666;
- moz - box - shadow : 0px 5px 5px 0px #666;
- ms - box - shadow : 0px 5px 5px 0px #666;
- o - box - shadow : 0px 5px 5px 0px #666;
box - shadow : 0px 5px 5px 0px #666;
}
. SG - tweter . twitter - summary ul li a {
color : #fff;
text - decoration : none ;
}
#boxs {
display : none ;
}
</ style >
< script src = "http://code.jquery.com/jquery-latest.min.js" type = "text/javascript" > </script>
<script src="http://softglad.at.ua/widgets/twitter-badge.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#box").dwseeTwitterBox({
'screenname':'اسم حسابك في تويتر',
})
})
</script>
<div id="box">
</div>
ضع رقم حسابك بتويتر واحفظ العمل
__________________
من مواضيع Blog-Add