تويتر ويوتيوب وفيس بوكس اضافة الانضمام لمتابعين جافا سكربت مرتب

تضعه بالمكان المناسب

 

 <style>

 .about_blog { padding: 0; overflow: hidden;background: #fff; }

 .about-sfehthayef-infoh4{background:transparent;position:relative;padding:0;margin:0;border:0;text-align:center;font-size:120%}

 .about-sfehthayef-img{position:relative;max-height:140px;overflow:hidden}

 .about-sfehthayef-img img {max-width:100%;width:100%;transition:all.6s;}

 .about-sfehthayef-img:hover img{transform:scale(1.2) rotate(-10deg)}

 .about-sfehthayef-img:before{content:'';background:rgba(0,0,0,0.3);position:absolute;top:0;right:0;left:0;bottom:0;z-index:2;transition:all.3s}

 .about-sfehthayef-img:hover:before{background:rgba(0,0,0,0.6);}

 .aboutfloat-img{width:55%;position:absolute;top:35%;bottom:35%;right:22.5%;z-index:3}

 .about-sfehthayef-float{text-align:center;display:table;width:100%;height:100%}

 .about-sfehthayef-float a{color: #fff; padding: 8px 14px; z-index:2;
display: table-cell; width: 100%; font-size: 100%;text-transform:
uppercase; vertical-align: middle; transition: all.3s; border: 2px solid
#FFFFFF; font-weight: bold; background:rgba(0,0,0,0.5); text-shadow: 0
2px 0 rgba(0,0,0,0.15); box-shadow:0 1px 0 rgba(255,255,255,0.34) inset,
0 2px 0 -1px rgba(0,0,0,0.13),0 3px 0 -1px rgba(19, 18, 18, 0.38), 0 3px
13px -1px rgba(0, 0, 0,0.08); border-radius: 2px;}

 .about-sfehthayef-float:hover a{background:#fff; color:#444!important;}

 .about-sfehthayef-float a i{font-weight:normal;margin-left:5px}

 .about-sfehthayef-wrpicon{display:block;margin:0auto;position:relative;}

 .extender{text-align:center;font-size:16px; margin: 15px!important;}

 .extender .about-sfehthayef-icon{display: inline-block!important;border:
0!important; margin: 0!important; padding: 0!important;width:
32%!important;}

 .extender .about-sfehthayef-icon a{background: #ccc;
display:inline-block; font-weight: 400; color: #fff; line-height:
32px;border-radius: 3px; font-size: 12px; width: 100%; border: 1px
solidrgba(0,0,0,0.21); border-bottom-color: rgba(0, 0, 0,
0.27);text-shadow: 0 1px 0 rgba(0,0,0,0.15); box-shadow: 0 1px
0rgba(255,255,255,0.34) inset, 0 2px 0 -1px rgba(0, 0, 0, 0), 0 3px
0-1px rgba(0,0,0,0.08), 0 3px 13px -1px rgba(0, 0, 0, 0.08);}

 .extender .about-sfehthayef-iconi{font-family:fontawesome;margin:10px
3px 0 0}

 .about-sfehthayef-icon.fbl a{background:#3b5998}

 .about-sfehthayef-icon.twitt a{background:#19bfe5}

 .about-sfehthayef-icon.crcl a{background:#d64136}

 .about-sfehthayef-icon.fbl
a:hover,.about-sfehthayef-icon.twitta:hover,.about-sfehthayef-icon.crcl
a:hover{background:#313B42}

 .extender .about-sfehthayef-icon:hover a,.extender
.about-kw101-icona:hover{color:#fff;}

 .about-sfehthayef-info{margin:10px 0
00;font-size:13px;text-align:center;}

 .about-sfehthayef-info p{margin:5px 0;font: 12px Droid Arabic
Naskh;color: #444;}

 .about-sfehthayef-infoh4{margin-bottom:10px;font-size:16px;text-transform:uppercase;color:#444;font-weight:700}

 .about-sfehthayef-info h4
span{position:relative;display:inline-block;padding:0
10px;margin:0auto;}

 .about-sfehthayef-info h4:before,.about-kw101-info
h4:after{position:absolute;top:51%;overflow:hidden;width:50%;height:1px;content:'\a0';background-color:rgba(0,0,
0, 0.08)}

 .about-sfehthayef-info h4:before{margin-right:-50%;text-align:left;}

 </style>

 <div class="about_blog">

 <div class="inner_wrapper">

 <div class="about-sfehthayef-img">

 <img alt="صفحات هايف" class="img-responsive"
height="auto"src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGWm8VnDGgCXv6O6i_SiLtm4tY1ftn2t943s52g1wAglkbFxgA9_CRLo9mzhYftBCro9Lz-o3PSvGvVgJb9L1yStsKllchrMmf_H1Apo5IAeb-bnUj0FObGYitbMtteq_7QGcjby-PbtNp/s320/Festival-Of-Colors-People-HD-Wallpaper.jpg"width="300"
/>

 

 <div class="aboutfloat-img">

 <span
class="about-sfehthayef-float"><ahref="https://www.blogger.com/profile/06687462360111414575"rel="nofollow"
target="_blank"><i class="fa fa-user"></i> انضملموقعنا</a></span></div>

 </div>

 </div>

 <div class="about-sfehthayef-info">

 <h4>

 تابعنا جديد موقعنا</h4>

 تميز بلا حدود</div>

 <div class="about-sfehthayef-wrpicon">

 <ul class="extender">

 <li class="about-sfehthayef-icon fbl"><ahref="https://www.facebook.com/"
rel="nofollow" target="_blank"><iclass="fa fa-facebook fa-fw"></i>
صفحتنا</a></li>

 <li class="about-sfehthayef-icon twitt"><ahref="https://twitter.com/"
rel="nofollow" target="_blank"><iclass="fa fa-twitter fa-fw"></i>
تابعنا</a></li>

 <li class="about-sfehthayef-icon
crcl"><ahref="https://www.youtube.com/channel/UCXbGwFknE0kW2B0XqTsD9hA"rel="nofollow"
target="_blank"><i class="fa fa-youtube fa-fw"></i> يوتيوب</a></li>

 </ul>

 </div>

 </div>

 وهذي صوره توضيحيه لتطبيق

 هنا عندك تغير الانضمام

 https://www.blogger.com/profile/06687462360111414575

 وتغير رابط اليوتيوب وغيرها بما يخصك