حصريا إضافة أداة تابعنا على مواقع التواصل الإجتماعي على بلوجر بطريقة رائعة
السلام عليكم شباب في هذا الدرس الجديد مع دخول هذا الشهر الجديد المبارك حبيك أن أهدي لجميع متتبعي المدونة أداة رائعة وهي أداة المتابعة على مواقع التواصل الإجتماعي بشكل راااائع لن تجد متله بأي مكان أخر إذن لن أطيل عليكم أترركم مع الشرح
معاينة :
1 - إذهب في مدونتك إلى : التخطيط
2 - إضغط على : إضافة أداة
3 - إضغط على : HTML/JavaScript
4 - قم بلصق الكود التالي داخل الإضافة
<h2 class='title'>تابعنا على مواقع التواصل الإجتماعي</h2> <div class='widget-content'> <style>#lh-social ul li{list-style:none;float:left;padding:1px}#lh-social ul li a{text-indent:-9999px;font-size:0;line-height:0;overflow:hidden;height:64px;width:42px;border:0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuM1oYid-ML3GTlab9m9wXcDsfdruWk2dsoCXTAdg_zQkzNi2eD3HOk65NmypV9lag8NQ_fhVA08iD9k6htg5UAdkUH1RpFTsGk4-3DFK-9x8A82zQCUXoa6KG2VGps55bB7IMjFKWJDs/s1600/latesthack27.png) no-repeat;display:block;-webkit-transition:ease-out 850ms;-moz-transition:ease-out 850ms;-o-transition:ease-out 850ms;-ms-transition:ease-out 850ms;transition:ease-out 850ms;cursor:pointer}#lh-social ul li a:hover{transform:rotate(360deg);-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);-moz-transition-duration:850ms;-webkit-transition-duration:850ms;-o-transition-duration:850ms}#lh-social li#pin a{background-position:0 0;margin:0 1px}#lh-social li#pin a:hover{background-position:0 -71px;margin:0 1px}#lh-social li#rss a{background-position:-84px 0;margin:0 1px}#lh-social li#rss a:hover{background-position:-84px -71px;margin:0 1px}#lh-social li#twit a{background-position:-126px 0;margin:0 1px}#lh-social li#twit a:hover{background-position:-126px -71px;margin:0 1px}#lh-social li#di a{background-position:-42px 0;margin:0 1px}#lh-social li#di a:hover{background-position:-42px -71px;margin:0 1px}#lh-social li#fb a{background-position:-209px 0;margin:0 1px}#lh-social li#fb a:hover{background-position:-210px -71px;margin:0 1px}#lh-social li#g a{background-position:-250px 0;margin:0 1px}#lh-social li#g a:hover{background-position:-252px -71px;margin:0 1px}</style><div id="lh-social"><ul><li id="fb"><a href="http://facebook.com/soufiane.hajaji.2015" rel="nofollow" target="_blank">facebook</a></li><li id="twit"><a href="http://twitter.com/soufiane1472583" rel="nofollow" target="_blank">Twitter</a></li><li id="g"><a href="https://plus.google.com/107202228980188283793" rel="nofollow" target="_blank">Google+</a> </li><li id="rss"><a href="http://feeds.feedburner.com/" rel="nofollow" target="_blank">RSS</a></li><li id="pin"><a href="http://pinterest.com/" rel="nofollow" target="_blank">PINTEREST</a></li><li id="di"><a href="http://delicious.com/" rel="nofollow" target="_blank">DELICIOUS</a></li></ul></div><p style="display:none;">Social buttons by <a href="http://www.th3soufiane.com">Latest Hack</a></p> </div> <div class='clear'></div> <span class='widget-item-control'> <span class='item-control blog-admin'> <a class='quickedit' href='//www.blogger.com/rearrange?blogID=7397580584320141435&widgetType=HTML&widgetId=HTML8&action=editWidget§ionId=sidebar-left-1' onclick='return _WidgetManager._PopupConfig(document.getElementById("HTML8"));' target='configHTML8' title='تحرير'> <img alt='' height='18' src='//img1.blogblog.com/img/icon18_wrench_allbkg.png' width='18'/> </a> </span> </span> <div class='clear'></div>
النتيجة :