السلام عليكم و رحمة الله و بركاته
الاضافة هذه اكثر من رائعة فهة تمكن الزائر من البقاء على اطلاع بروابط مدونتك على الشبكات الاجتماعية فى اى مكان فى المدونة فهى تتواجد فى مكان فى الصفحة ولعلنا شاهد انتشارا لها فى الاَونة الاخيرة ولكن هذه الاضافة من وجهة نظرى هى الاكثرهم جمالا و فعالية .
تركيب الاضافة
1. ادخل الى لوحة التحكم ثم اختر layout او تخطيط
2. اضغط على html/javascript
3. الصق الكود التالى
position:relative;
z-index:5;
display:block;
float:none;
margin:5px 0 0;
width:210px;
height:38px;
border-radius:5px; background:url(http://1.bp.blogspot.com/-JKq0eFFwx34/UGx39fhHO_I/AAAAAAAABE4/56i9phAS2do/s1600/NBT+Sprites+Social+Icons.png) no-repeat;
background-color:rgba(217,30,118,.42);
-webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
-moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
box-shadow:rgba(0,0,0,.28) 0 2px 3px;
color:#141414;
text-align:left;
text-indent:50px;
text-shadow:#333 0 1px 0;
white-space:nowrap;
line-height:32px;
-webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-moz-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-ms-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-o-transition:width .25s ease-in-out,background-color .25s ease-in-out;
transition:width .25s ease-in-out,background-color .25s ease-in-out;
-o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
}
#bloggertrix-SexySocialButtons li:after{
position:absolute;
top:0;
left:50px;
z-index:2;
display:block;
height:38px; color:#ffffff;
content:attr(data-alt);
line-height:32px;
}
#bloggertrix-SexySocialButtons .icon{
overflow:hidden;
color:#fafafa;
}
#bloggertrix-SexySocialButtons .facebook{
width:32px;
height:32px;
background-color:rgba(59,89,152,0.42);
background-position:0 0;
}
#bloggertrix-SexySocialButtons .twitter{
width:32px;
height:32px;
background-color:rgba(64,153,255,0.42);
background-position:0 -33px;
}
#bloggertrix-SexySocialButtons .googleplus{
width:32px;
height:32px;
background-color:rgba(228,69,36,0.42);
background-position:-3px -66px;
}
#bloggertrix-SexySocialButtons .YouTube{
width:32px;
height:32px;
background-color:rgba(174,45,39,0.42);
background-position:-2px -95px;
}
#bloggertrix-SexySocialButtons .rss{
width:32px;
height:32px;
background-color:rgba(255,102,0,0.42);
background-position:-3px -126px;
}
#bloggertrix-SexySocialButtons li:hover .icon,
.touch #bloggertrix-SexySocialButtons li .icon{
width:210px;
}
.touch #bloggertrix-SexySocialButtons li .facebook, #bloggertrix-SexySocialButtons li:hover .facebook{
background-color:rgba(59,89,152,1);
}
.touch #bloggertrix-SexySocialButtons li .twitter, #bloggertrix-SexySocialButtons li:hover .twitter{
background-color:rgba(64,153,255,1);
}
.touch #bloggertrix-SexySocialButtons li .googleplus, #bloggertrix-SexySocialButtons li:hover .googleplus{
background-color:rgba(228,69,36,1);
}
.touch #bloggertrix-SexySocialButtons li .YouTube, #bloggertrix-SexySocialButtons li:hover .YouTube{
background-color:rgba(174,45,39,1);
}
.touch #bloggertrix-SexySocialButtons li .rss, #bloggertrix-SexySocialButtons li:hover .rss{
background-color:rgba(255,102,0,1);
}
</style>
<div class="bloggertrixSocialButtonsBorder">
<ul id="bloggertrix-SexySocialButtons">
<li data-alt="Follow us on Facebook"><a class="icon facebook" href="https://www.facebook.com/bloggertrix">Follow us on Facebook</a></li>
<li data-alt="Follow us on Twitter"><a class="icon twitter" href="https://twitter.com/bloggertrix">Follow us on Twitter</a></li>
<li data-alt="Follow us on Google+"><a class="icon googleplus" href="https://plus.google.com/107955298793879607964">Follow us on Google+</a></li>
<li data-alt="Subscribe us on YouTube"><a class="icon YouTube" href="https://youtube.com/Username">Subscribe us on YouTube</a></li>
<li data-alt="Subscribe with RSS"><a class="icon rss" href="http://feeds.feedburner.com/bloggertrix">Subscribe with RSS</a></li></ul></div>
- استبدل bloggertrix باسم المستخدم على الفيس بوك
- استبدل bloggertrix باسم المستخدم على تويتر
- استبدل 107955298793879607964 بال id الخاص بك على جوجل بلس
- استبدل Username باسم المستخدم على اليوتيوب
- استبدل bloggertrix بال id الخاص بك على feedburner
5. اضغط حفظ . ومبروك عليك الاضافة
