أضف أزرار مواقع التواصل الإجتماعي بشكل جذاب CSS لمدونات بلوجر

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

أضف أزرار مواقع التواصل الإجتماعي بشكل جذاب CSS لمدونة بلوجر

شكل الازارا احترافي وجذاب و بتقنية css

لمشاهدة الاضافة

شرح ركيب الاضافة

أولا اذهب إلى

 لوحة التحكم بلوجر >التخطيط > إضافة أداة > HTML/JavaScript

 هذه الصورة توضح اداء HTML/JavaScript



<style>#bdrs-social {margin:0px auto;width: 300px;}#bdrs-social .bdbox-social a:link,.bdbox-social a:visited{float:left;width:32px;height:32px;margin:0 5px;padding:0;text-indent:-9999em;box-shadow:3px 3px 3px rgba(0,0,0,0.3);background-color:transparent;background-size:100% auto;background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizYB-98Fb4sd9pzYAHsn-v70iZU7CaofZQlWb13UQ_ksRwykCfbte548kFEBqOVBPFvZ_18jNTwDn_YUFS9h8unKEHP-2IyYaA1d9BwvZDxZyPB2dAPD7xXNjzsEy80sshVkBdCUcvTU4/s1600/BRS01-sosial.png');background-repeat:no-repeat;}#bdrs-social .bdbox-social a:hover,.bdbox-social a:active {box-shadow:3px 3px 7px #333 INSET;}#bdrs-social .bdbox-social a:first-child{margin-left:3px}#bdrs-social .bdbox-social a:last-child{margin-right:0}#bdrs-social .bdrs-rss{background-position:0 0}#bdrs-social .bdrs-goo{background-position:0 -32px}#bdrs-social .bdrs-fac{background-position:0 -64px}#bdrs-social .bdrs-lin{background-position:0 -96px}#bdrs-social .bdrs-tum{background-position:0 -128px}#bdrs-social .bdrs-twi{background-position:0 -160px}#bdrs-social .bdrs-wor{background-position:0 -192px}</style><!-- www.madad2.blogspot.com --><div id="bdrs-social"><div class="bdbox-social" > <a class="bdrs-goo" href="رابط جوجل بلس" rel="publisher" target="_blank" title="جوجل بلس+">جوجل بلس+</a> <a class="bdrs-fac" href="رابط صفحة فيس بوك" rel="nofollow" target="_blank" title="فيس بوك">فيس بوك</a> <a class="bdrs-twi" href="رابط تويتر" rel="nofollow" target="_blank" title="تويتر">تويتر</a> <a class="bdrs-lin" href="رابط ينكدين" rel="nofollow" target="_blank" title="LinkedIn">ينكدين</a> <a class="bdrs-tum" href="رابط مدونة تومبر" rel="nofollow" target="_blank" title="Tumblr">نعرفكم</a> <a class="bdrs-rss" href="رابط التغذية لمدونتك" rel="external" target="_self" title="RSS Feed">RSS Feed</a> </div></div>

استبدال التالي 

رابط صفحة فيس بوك
رابط تويتر
رابط التغذية لمدونتك
رابط ينكدين
رابط مدونة تومبر
رابط جوجل بلس

مثال مباشر





لا تنس الصلاة والسلام على خير الأنام نبينا محمد صلى الله عليه وسلم

0تعليقات

تعليقك يساهم في تطوير المحتوى ويزيد من الفائدة بمشاركتنا بأفكارك واقتراحاتك , رأيك يهمنا فساهم بتعليقاتك معنا
::: يرجى عدم وضع روابط خارجية في التعليقات لضمان نشرها :::