goldsky: إضافة أداة عائمة للمتابعة عبر الشبكات الإجتماعية

اهلاً بكم زواري ومتتبعي الكرام

اليوم اتيت اليكم بإضافة مميزة في المساعده على المتابعة في المواقع التواصل الاجتماعي
تتميز الاداة بسرعة تركيبها وخفيفة على المتصفح
اترككم مع الصورة

شرح التركيب

1- ادخل لوحة التحكم بلوجر

2- اضغط على التخطيط >> اضافة اداة

3- اختار اداة HTML/JavaScript

كود الاداة

<style type='text/css'>

.soc-fixed a, .slider-tooltip p{-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;transition:all .2s ease-in-out}

.slideshow-chunk>div{-webkit-transition:all .8s ease-in-out;-moz-transition:all .8s ease-in-out;transition:all .8s ease-in-out}

.soc-fixed{height:150px;left:50%;position:fixed;top:200px;width:18px;z-index:5;margin-left:495px}

.soc-fixed a{display:block;margin-left:133px;width:19px;height:20px;position:absolute;top:0;right:0;color:#fff!important;text-decoration:none;text-transform:uppercase;font-size:10px;font-weight:700;line-height:20px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSj4RBmUAlSvLMSbNPerFgIPwo7hSO_dcp3x_by3EOSIu0VUSdaXMsd-Ra0Hh2p2FHK5urW2SEIVYyTXW5Nm9ITcDofjogLY0O4Ttn73GWN8vvn58AFaGVnA3AXK-SqywCyfNquWDoQ5s/s1600/soc-icons.png) no-repeat;overflow:hidden}

.soc-fixed a span{min-width: 152px;padding: 0px;display:block;visibility:hidden;min-width:152px}

.soc-fixed a:hover{min-width:133px;padding-left:25px;-webkit-transition:all .1s ease-in-out;-moz-transition:all .1s ease-in-out;-o-transition:all .1s ease-in-out;transition:all .1s ease-in-out}

.soc-fixed a:hover span{visibility:visible;position:absolute;top:0;right:25px}

.soc-fixed a.soc-facebook{background-position:3px -15px;top:20px;background-color:#526ca5}

.soc-fixed a.soc-twitter{background-position:3px -36px;top:40px;background-color:#75ddfe}

.soc-fixed a.soc-rss{background-position:3px -55px;top:60px;background-color:#f6a858}

.soc-fixed a.soc-mail{background-position:3px -75px;top:80px;background-color:#c1c1c2}

.soc-fixed a.soc-facebook:hover{background-color:#526ca5;background-position:5px -15px}

.soc-fixed a.soc-twitter:hover{background-color:#75ddfe;background-position:5px -36px}

.soc-fixed a.soc-mail:hover{background-color:#c1c1c2;background-position:5px -75px}

.soc-fixed a.soc-rss:hover{background-color:#f6a858;background-position:5px -55px}

.soc-fixed a.soc-facebook:active{background-color:#294a90}

.soc-fixed a.soc-twitter:active{background-color:#40b5fe}

.soc-fixed a.soc-mail:active{background-color:#909090}.soc-fixed a.soc-rss:active{background-color:#f37526}

</style>

<div class='soc-fixed'> <a class='soc-facebook' href='https://www.facebook.com/zoom-teach.blogspot.com.eg' onclick='dcsSetVar('WT.z_iLinks','Facebook','WT.z_iLinks_actionoffer','exnav-soc','WT.z_iLinks_targetcampaign','src-gs');' target='_blank' title='فايسبوك'><span>تابعنا عبر الفاسبوك</span></a><a class='soc-twitter' href='https://twitter.com/zoom-teach.blogspot.com.eg' onclick='dcsSetVar('WT.z_iLinks','Twitter','WT.z_iLinks_actionoffer','exnav-soc','WT.z_iLinks_targetcampaign','src-gs');' target='_blank' title='تويتر'><span>تابعنا عبر التويتر</span></a> <a class='soc-rss' href='http://feeds.feedburner.com/add-b' onclick='dcsSetVar('WT.z_iLinks','RSS','WT.z_iLinks_actionoffer','invite-follow','WT.z_iLinks_targetcampaign','src-gs');' target='_blank' title='الخلاصات'><span>تابعنا عبر الخلاصات</span></a> </div>