اضافة جميلة ورائعة لأضافة مواقع التواصل على المدونة
طريقة الاضافة
اذهب للتخطيط - اضافة اداة- HTML/Javascript
وألصق الكود التالي مع تغيير مايلزم
<style>.footer-wrapper{ background:#fff; clear:both; overflow:hidden; padding:14px}div#footed h2:after{ content:''; bottom:0px; right:0; left:0px; background:#bfbfbf; position:absolute; z-index:-1; height:4px}div#footed h2:before{ content:''; position:absolute; width:44%; height:4px; background:#3d4a60; right:0; left:0; margin:auto; z-index:2; bottom:0}div#footed h2{ position:relative; z-index:1; font-size:20px; padding:8px 5px 13px 5px; text-align:center; color:#3d4a60; margin-bottom:18px; font-weight:100}div#footed:last-child{ margin-left:0}div#footed{ float:right; width:32%; margin-left:1%}#footed .widget-content{ font-size:16px; color:#3d4a60; padding:8px; padding-top:0; line-height:29px}#footed .list-label-widget-content ul li a, #footed .list-label-widget-content ul li span{ display:block; margin-bottom:8px; margin-right:6px; margin-left:6px; border-radius:3px; font-size:17px; padding:6px 0; color:#fff; background:#2c3648}#footed .list-label-widget-content ul li{ float:right; width:50%; text-align:center}.copyrights a{ color:#8a8a8a}#leftc{ float:left}#rightc{ float:right}.copyrights >div{ border-top:2px solid #2c3648; padding:0 20px; padding-top:14px}.copyrights{ background:#fff; color:#2c3648; padding:0; text-align:center; font-weight:100; font-size:18px; overflow:hidden; height:60px}center.telk-us >span:first-child{ position:relative; bottom:0; float:right; margin-top:6px; margin-left:7px}center.telk-us img{ width:50px; height:34px}center.telk-us{ display:inline-block; margin-top:0; margin-bottom:0}#footed .popular-posts ul li .item-title a{ color:#3d4a60; font-size:18px}#footed .popular-posts ul li .item-snippet{ overflow:hidden; height:49px; font-size:15px; color:#a9a9a9; line-height:23px}#footed .popular-posts ul li .item-thumbnail img{ width:100%; height:100%}#footed .popular-posts ul li .item-thumbnail{ float:right; width:90px; margin-left:9px; height:90px; border-radius:7px; position:relative; overflow:hidden}#footed .popular-posts ul li{ margin-bottom:14px}.social-type:after{ content:"\f100"; font-family:FontAwesome; margin-right:5px}.social-to ul li.rss a{ background:#f29a1d}.social-to ul li.googleplus a{ background:#DD4B39}.social-to ul li.twitter a{ background:#55acee}.social-to ul li.facebook a{ background:#3b5998}.social-to ul li.instagram a{ background:#457399}.social-to ul li.youtube a{ background:#cb322c}.social-to ul li .social-type{ float:left}.social-to ul li .social-name{ float:right; margin-left:8px}.social-to ul li a{ display:block; border-bottom:3px solid rgba(0,0,0,0.09); margin-bottom:8px; color:#fff; padding:10px 18px; font-size:18px; border-radius:4px; background:#fff; transition:0.2s}.social-to ul li{ overflow:hidden}.social-to ul li a:hover{ padding:10px 31px}</style>
<div class="social-to"><ul><li class="facebook"><a href="https://www.facebook.com/hlo1y"><span class="social-name"><i class="fa fa-facebook"></i></span><span class="social-count">+ 97 ألف</span><span class="social-type">متابع</span></a></li><li class="youtube"><a href="https://www.youtube.com/c/v518v"><span class="social-name"><i class="fa fa-youtube"></i></span><span class="social-count">+13 ألف</span><span class="social-type">مشترك</span></a></li><li class="instagram"><a href="https://www.instagram.com/hlo1y"><span class="social-name"><i class="fa fa-instagram"></i></span><span class="social-count">+3k</span><span class="social-type">متابع</span></a></li><li class="twitter"><a href="https://twitter.com/hlo1y"><span class="social-name"><i class="fa fa-twitter"></i></span><span class="social-count">+1.5k</span><span class="social-type">متابع</span></a></li></ul></div>
ليست هناك تعليقات:
إرسال تعليق