طريقة اضافة ازرار اجتماعية لمدونة بلوجر الاحترافية

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

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

على بركة الله نبدأ:

في لوحة تحكم المدونة توجه الى التخطيط > إضافة أداة > HTML/JavaScript
ثم ضع هدا الكود
-------------------------------------------------------------------------------------------

:<div class="flt-wdt"> <style>#floatingbookmarks { right:25px; top:40px; margin-top:10px; position:fixed; width:40px; } #floatingbookmarks .float {margin:7px} .FBConnectButton_Text { font-size: 8px; padding:2px 4px 3px !important; } </style> <b:if cond='data:blog.pagetype == &quot;item&quot;'> <div id='floatingbookmarks'> <a style="text-decoration:none;" href="http://www.facebook.com/YourLink" rel="nofollow" onclick="window.open('http://www.facebook.com/YourLink');return false;" title="تابعيني عبر الفايسبوك "> <img border="0" id="Facebook" style="padding-bottom:1px;" alt="تابعني عبر الفايسبوك" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3LgHEXau6hF8nZtwdwCL02_pHGt04Zs7-Hu9LcmgZPb84M3FQnvh1N4CDgLSIiSdj2ZrBegAZiKVgehXi__CyKigrSYGeGujUCar3PVISEV1qX2pPEk54axKIbgyyXGdsjXiBIprAxNtN/s1600/facebook.png" name="Facebook"/> </a> <a style="text-decoration:none;" href="https://twitter.com/YourLink" rel="nofollow" rel="nofollow" target="_Blank" rel="nofollow" onclick=" window.open('https://twitter.com/YourLink'); return false;" title="تابعني على توتير"> <img border="0" id="Twitter" style="padding-bottom:1px;" alt="تابعني عبر تويتر" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXECwzk4A9S-MV3GiBUY4KGQZ9OG3t0CXxS0YN6E4w1VS7Nt-_7ynx4hhaEsWK4nu-5MIs65htMRK0Fcayxqw17yVZf9T6YN2UB3qjJcRuB8eZZtsVg7E6fl10gLR880lvitx1PhFXJLyM/s1600/twitter.png" name="Twitter"/> </a> <a style="text-decoration:none;" href="http://YourLink/feeds/posts/default" rel="nofollow" onclick="window.open('http://YourLink/feeds/posts/default');return false;" title="تابعني عبر خلاصات المدونة"> <img border="0" id="Facebook" style="padding-bottom:1px;" alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv6-bWm0Tj-xuw_U_tnpPDx5mMSv-AFKOtC-uJIC7nukkCyb1sOe-gHi6yESi3WrLhtcB1LGYfQbpXhHDYlm5uraQmHUec9u00NM-47f6pmSWmuqWn19bYF-JL3J5GDFOpFF7bu7D0Mz2F/s1600/rss.png" name="RSS"/> </a> <a style="text-decoration:none;" href="https://plus.google.com/YourLink" rel="nofollow" onclick="window.open('https://plus.google.com/YourLink');return false;" title="تابعني عبر جوجل +"> <img border="0" id="Facebook" style="padding-bottom:1px;" alt="تابعني عبر جوجل +" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRTXQ-Eru59iFIsJRzmNaVj6LHA8_vU_0_MNskQbAiR75Jnjo85c2n2YKFbm8BdIBZqkGuXTdhIeh_sH8hf9CtPBp_aJuJiL0gG7n6txBhWJ_-Vh8NfUDNIHW52eSw88uBfdkgdwYpuVY-/s1600/google.png" name="Google +"/> </a> <a href="javascript:window.external.AddFavorite('http://YourLink/', 'اسم المدونة');" title=" أضف المدونة لمفضلتك"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgE8IkYUeZDB0qYmqso0u5rSQ5eK3svAQgTxJaSazpTqhaCiyAQqaP7GOk3FHvTqSa3ctByu-8yNU6h5rcA0kpNdnaRczUINMZf785GlOVKP-NwF4Yn9SP9LQiu_DGKucWHWrJM5O0Pp7aY/s1600/favorite.png" /></a> </div> </b:if> </div>

--------------------------------------------------------------------------------

لا تنسى تغغير الروابط التي باللون الأحمر الى الحسابات الخاصة بك

بعد ذلك توجه الى قالب > تحرير HTML و ابحث عن

كود:    ]]></b:skin>

ثم أضف فوقه مباشرة الكود التالي 

.flt-wdt{ position:fixed; right:10px; top:40%; } .flt-wdt img{ float:right; clear:right; margin:5px; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .flt-wdt img:hover{ -moz-transform: scale(1.2) rotate(6deg); -webkit-transform: scale(1.2) rotate(6deg); -o-transform: scale(1.2) rotate(6deg); -ms-transform: scale(1.2) rotate(6deg); transform: scale(1.2) rotate(6deg); }

قم بحفظ التغييرات على قالبك
الى هنا أكون قد أنهيت شرحي

لا تنسو اضافة تعليقكم لتشجيعنا لنقدم الأفضل