مرحبا بكم اعضاء مدونة سمُّور الكرام في تدوينة جديدة ... اليوم نقدم لكم اضافة ازرار المواقع الاجتماعية باثير التلميحات المميز اضافة الى خفة الاضافة و روعة تصميمها ..
معاينة الاضافة
نتوجه الى لوجة التحكم > التخطيط > اضافة اداة > جافا سكريب ونلصق الكود التالي :
<style type="text/css" >
#followq {
clear: both;width: 300px;
font-family: 'Droid Arabic Kufi';
height: 40px;margin-top:200px 0px 11px 10px;}
#followq ul { margin-top:50px;padding: 0px;}
#followq ul li {position: relative;list-style-type: none;display: inline-block;}
.ikonz .ikonz-tooltip {display: block;padding: 5px 10px;position: absolute;bottom: 100%;
left: 0px;z-index: 77;margin-bottom: 40px;background-color: #141414;font-size:12px;
color: white;text-align: center;-webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.4);box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);
-webkit-border-radius: 5px;-moz-border-radius: 5px;
border-radius: 5px;opacity: 0;
visibility: hidden;-webkit-transition: all 0.26s ease-out;
-moz-transition: all 0.26s ease-out;
-ms-transition: all 0.26s ease-out;
-o-transition: all 0.26s ease-out;
transition: all 0.26s ease-out;}
.ikonz .ikonz-tooltip:before {content: "";width: 0px;height: 0px;border: 7px solid transparent;border-top-color: #141414;position: absolute;top: 100%;left:42%;}
.ikonz:hover .ikonz-tooltip {visibility:visible;width: 76px;opacity:1;margin:16px 12px 6px -28px;
z-index:99999;}
#followq .ikonz {background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEjpgpQ_RuD1dqR71tSwk8-JAAiZ00DCxlNBd8W4CmgaQAbcdkA53wQunrD0DAAVy3d-sXAk9ONl__q9c3g1OO_C1bD9G5qYvxKc8bTb5Rm9jaKWpISaN23dtS4nLumr6PrrJJ9XI-x_A/s1600/social3d.png') 0 0 no-repeat;display: block;
color: #141414;float: none;height: 39px;width: 39px;line-height:20px;position: relative;z-index: 5;}
#followq .ikonz:active {bottom: -2px;}
#followq .fb {background-position: 0px 0px;}
#followq .twitter {background-position: -40px 0px;}
#followq .google {background-position: -80px 0px;}
#followq .delcis {background-position: -120px 0px;}
#followq .stumble {background-position: -200px 0px;}
#followq .mail {background-position: -280px 0px;}
#followq .rss {background-position: -360px 0px;}
</style><div id="followq">
<ul>
<li><a href=" رابط الفيس بوك " class="ikonz fb"><span class="ikonz-tooltip"> فيس بوك </span></a></li>
<li><a href=" رابط تويتر " class="ikonz twitter"><span class="ikonz-tooltip"> تويتر</span></a></li>
<li><a href=" رابط جوجل " class="ikonz google"><span class="ikonz-tooltip"> جوجل </span></a></li>
<li><a href="رابط صفحة التواصل" class="ikonz mail"><span class="ikonz-tooltip"> البريد</span></a></li>
<li><a href=" رابط الخلاصات " class="ikonz rss"><span class="ikonz-tooltip"> الخلاصة </span></a></li>
</ul>
</div>
وقم بتغيير المطلوب بما يناسبك
وارجوك لاتاخذ بدون ان تقدم كلمة على الاقل
ودمتم في رعاية الله
الإبتساماتإخفاء