EnglishFrenchGermanSpainItalianDutchRussianPortugueseArabic

أزرار المواقع الإجتماعية بشكل بسيط وتأثير مميز

السلام عليكم
السلام عليكم إخواني اتمنى ان تكونوا بخير
في هذا الموضوع سيتم طرح ازرار جميلة لاهم المواقع الإجتماعية
تتيمز هذه الاخير ببساطتها وتأثير مرور الماوس على الازرار
صورة من الإضافة

أزرار المواقع الإجتماعية بشكل بسيط وتأثير مميز

لتركيب الإضافة قم بإضافة اداة جديدة ثم ضع فيها الكود التالي :

<div class="abt-social-slide">
<ul>
<li><a class="facebook" href="http://www.arabe-eye.com" target="_blank">فيس بوك</a></li>
<li><a class="twitter" href="http://www.arabe-eye.com" target="_blank">تويتر</a></li>
<li><a class="google-p" href="http://www.arabe-eye.com" target="_blank">جوجل بلس</a></li>
<li><a class="rss" href="http://www.arabe-eye.com" target="_blank">خلاصات المواضيع</a></li>
</ul>
</div>
<style>
.abt-social-slide ul li{list-style:none;border-bottom:none;padding:0}
.abt-social-slide li a{width:59px;height:59px;float:left;text-indent:-99999px;border:solid 1px #222121;border-radius:5px;-webkit-transition:All .3s ease-out;-moz-transition:All .3s ease-out;-o-transition:All .3s ease-out;margin:5px 5px 10px;padding:0}
.abt-social-slide li a.facebook{background:url(http://4.bp.blogspot.com/-njqMpTvxYbs/UFM2yXm-AnI/AAAAAAAAEFU/yfm_dKxQ2hs/s1600/facebook.png) no-repeat 0 -88px}
.abt-social-slide li a.facebook:hover{background:url(http://4.bp.blogspot.com/-njqMpTvxYbs/UFM2yXm-AnI/AAAAAAAAEFU/yfm_dKxQ2hs/s1600/facebook.png) no-repeat 0 0}
.abt-social-slide li a.twitter{background:url(http://2.bp.blogspot.com/-BtalCDk0UGg/UFM206t5yfI/AAAAAAAAEFk/1cwjqImigQo/s1600/twitter-1.png) no-repeat 0 -88px}
.abt-social-slide li a.twitter:hover{background:url(http://2.bp.blogspot.com/-BtalCDk0UGg/UFM206t5yfI/AAAAAAAAEFk/1cwjqImigQo/s1600/twitter-1.png) no-repeat 0 0}
.abt-social-slide li a.google-p{background:url(http://1.bp.blogspot.com/-qITbsA3n7_w/UFM2z36eMnI/AAAAAAAAEFc/PK9Cmf7JZd4/s1600/google.png) no-repeat 0 -88px}
.abt-social-slide li a.google-p:hover{background:url(http://1.bp.blogspot.com/-qITbsA3n7_w/UFM2z36eMnI/AAAAAAAAEFc/PK9Cmf7JZd4/s1600/google.png) no-repeat 0 0}
.abt-social-slide li a.rss{background:url(http://1.bp.blogspot.com/-xmXWc6_8mxw/UFM21nVC47I/AAAAAAAAEFs/Ydce5M-vkvw/s1600/twitter.png) no-repeat 0 -88px}
.abt-social-slide li a.rss:hover{background:url(http://1.bp.blogspot.com/-xmXWc6_8mxw/UFM21nVC47I/AAAAAAAAEFs/Ydce5M-vkvw/s1600/twitter.png) no-repeat 0 0}
</style>

غير فقط روابط مدونتي برابط كل موقع صفحاتك على الفيس بوك وتويتر وجوجل بلس وأيضا ضع رابط خلاصات المواضيع
 الذي يكون على هذا الشكل http://www.arabe-eye.com/feeds/posts/default غير فقط رابط مدونتي واترك الباقي

هذا كل شيئ اتمنى أن تعجبكم الإضافة بالتوفيق للجميع ودمتم في رعاية الله وحفظه

ليست هناك تعليقات:

إرسال تعليق

التالي السابق الرئيسية