اضافة اداة المتابعة على المواقع الاجتماعية ممتازة 2013

السلام عليكم و رحمة الله

أقدم لكم اليوم إضافة سريعة، جميلة و سهلة التركيب، من خلالها ستعرض على زوارك متابعة جديدك على المواقع الاجتماعية كتويتر أو يوتيوب أو عبر الخلاصات و المفضلات...
كما و يمكنكم تخصيصها لتوافق مبتغاكم. تركيبها يسير، فقط ضع كود css في ملف القالب style ثم ضع كود html في أي مكان بين وسمي body. يمكنكم معاينة الإضافة من خلال الصورة المرفقة.


  الشرح :  

1-قم بتسجيل الدخول إلى حسابك بلوجر.
2- من لوحة التحكم الخاصة بمدونتك توجه إلى قالب .
3- بعدها إختر تحرير HTML ثم أنقر على متابعة .
4- بعد ظهور صفحة تعديل القالب إختر توسيع قوالب عناصر واجهة المستخدم.
5- الأن قم بالبحث عن :
]]></b:skin>
بعد إيجاد الكود ضع هذا قبله

ــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
#w2b-share ul {position:fixed;right:20px;top:100px;list-style: none;clear: none;padding: 0px 0px ;margin: 5px 0;}#w2b-share ul li a {display: block;float: right;width: 64px;height:64px;background-image: url('http://1.bp.blogspot.com/-fhKt1mgpXbE/T2kFQI-_K2I/AAAAAAAABcE/xNPE5D4-9h4/s1600/omnidal-social.png');margin-top:3px;margin-bottom: 3px;background-repeat: no-repeat;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;-webkit-transition: all 0.3s ease;-ms-transition: all 0.3s ease;transition: all 0.3s ease;}#w2b-share ul li a.facebook   {background-position: 0px -0px;   }#w2b-share ul li a.facebook:hover   {background-position: 0px -65px;   }#w2b-share ul li a.twitter   {background-position: -66px -0px;  }#w2b-share ul li a.twitter:hover   {background-position: -66px -65px;  }#w2b-share ul li a.flickr  {background-position: -131px -0px;  }#w2b-share ul li a.flickr:hover  {background-position: -131px -65px;  }#w2b-share ul li a.google    {background-position: -197px -0px; }#w2b-share ul li a.google:hover    {background-position: -197px -65px; }#w2b-share ul li a.youtube   {background-position: -262px -0px; }#w2b-share ul li a.youtube:hover   {background-position: -262px -65px; }#w2b-share ul li a.omnidal   {background-position: -327px -0px; }#w2b-share ul li a.omnidal:hover   {background-position: -327px -65px; }  
ــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ

6 - بعد إضافة الكود قم بالبحث مرة أخرى عن :

<body>

ضع بعده هذا الكود مع تغيير ما هو بالأحمر

ــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
<div id='w2b-share'><ul><li><a class='facebook' href='http://www.facebook.com/free.programs.m' title='اشترك في صفحتي على Facebook'/></li><li><a class='twitter' href='https://twitter.com/medo_tawalbeh' title='تابعني عبر twitter'/></li><li><a class='flickr' href='#' title='تابعني عبر flickr  '/></li><li><a class='google' href='https://plus.google.com/117281023691653/posts' title='تابعني عبر google+'/></li><li><a class='youtube' href='#' title='تابع قناتي على اليوتيوب'/></li><li><a class='omnidal' href='http://www.blogger.com/follow-blog.g?blogID=202763198871955' title='انضم لأعضاء المدونة'/></li></ul></div>  
ــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ

بالتوفيق وأي مشكلة أو إستفسار فلا تتردد 
ملاحظة! : عند نقلك للموضوع حاول ان تذكر المصدر لينتفع الزائر في حال اراد المزيد من المساعده، وايضاَ احتراما وتقديراَ للجهود المبذولة.
About Author

عن الكاتب


mahmoud tawalbeh


شكرا لك ولمرورك