أيقونات المواقع الاجتماعية لمدونات بلوجر وكيفية تخصيصها

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

تعتبر ايقونات الامواقع الاجتماعية من أهم الاضافات التي يبحث عنها الزائر من  أجل ربط حساباته في المواقع الإجتماعية بمدونته .

لذالك في هذا الموضوع ستجد الطريقة لكي تضفها أنت كذالك الى مدونتك .

معاينة الأزرار

الطريقة :

• من لوحة التحكم اتجه الى تخطيط 
• اضغط على اضافة أداة Add Gadget
• أختر أداة HTML/Javascript
• ثم الصق الكود الموجود أسفل ثم اضغط على حفظ .

الكود :

<style> /* Social Icons  ----------------------------------------------- */  a.social-icons {  margin-right: 5px; /*Adjust This Value As Needed*/ height:45px; width:45px; }  a.social-icons:hover {  opacity: .7;  filter:alpha(opacity=70); /* For IE8 and earlier */ }   height:45px; width:45px; </style>  <a class="social-icons" href="https://facebook.com/4we-eb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6GMxuQsDdtJSuUNxlxiuGe6q_tMv0L6hzshppvHN5FWg7shrKp_0uAUtevPPIzl-i5kewnYyUsugjgovIuKg4CUqRxEWxlGaUHkkjv7EgSgM7oBPcqZ6i4KcMeX6Xw5D5rL5Du8II_F4-/s1600/Bloggertrix-facebook.png" /></a> <a class="social-icons" href="https://twitter.com/4weeb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3YzN9SSXHhdXu7FWdfAEdPpulxtfJuSerfD43PTL4QI4o9PEnLGD2LrcO0bcOJi01-fLM7WvXo1GnaIeEPRgiaTvH5nwhg3Z4LYR0L8z1ne56lBZaw2GXoitw6c60GOykSK_oOO1HVayW/s1600/bloggertrix-twitter.png" /></a> <a class="social-icons" href="https://plus.google.com/4weeb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6tWMf3XhuwCfLVEHD2RonZoBkor5rq_fwTOQXY4_UMtpknl7OauUnfVeOeSm-pY7iH8ByVTbvTJN-jFB42spF1hsrPsxL94T7p6Ba3untud4PQV81fP3bqC_ek54gl41zni0EwKkNMO-p/s1600/Bloggertrix-Googleplus.png" /></a> <a class="social-icons" href="http://www.feedburner.com/4weeb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWQY3hFhANVyya_2oMfqxCz0M-k8r0qUsK6VgS4SDebyzZlBPA3vOnHkKk5Wl_zmKIZnYr0Jc75HlgGhgFi9t66lg4BSxwqAKMJf4FXnuJLnRKfSH4fmhHm10ctlhmc9aGRFiy-MJvyH54/s1600/Bloggertrix-Rss.png" /></a> <a class="social-icons" href="http://pinterest.com/4weeb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0GJVaoqmXaByHR9md9anSXkJeFU-c1RdwTlc5dyCuyxqloCSBD-iA8jBztr4i1EUdEEa0uze-d3PdU9S3pxHl_ebFK6R8TUdcUHbRQPFsnBKBQ1TSduhj8O5zpwgQQueBnD6J0oYHvmLy/s1600/Bloggertrix-pinterest.png" /></a>

تخصيص الكود :

• غير 4we-eb الى اسم حسابك في facebook
• غير 4we-eb الى اسم حسابك في twitter
• غير 4we-eb الى اسم حسابك في Googleplus
•  غير 4we-eb الى اسم حسابك في feedburner
• غير 4we-eb الى اسم حسابك في  pinterest

طريقة حذف أيقونة لا تريد استخدامها :
اذا كنت لا تستعمل موقعا اجتماعيا موجود في الإضافة وتريد حذف أيقونته اتبع الطريقة التالية :
فمثلا أنا اريد حذف أيقونة pinterest لأنني لا استعمله ، احذف الكود الخاص به . والأكواد هي  كالآتي : 

الكود الخاص بموقع facebook :

 <a class="social-icons" href="https://facebook.com/4we-eb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6GMxuQsDdtJSuUNxlxiuGe6q_tMv0L6hzshppvHN5FWg7shrKp_0uAUtevPPIzl-i5kewnYyUsugjgovIuKg4CUqRxEWxlGaUHkkjv7EgSgM7oBPcqZ6i4KcMeX6Xw5D5rL5Du8II_F4-/s1600/Bloggertrix-facebook.png" /></a>

الكود الخاص بموقع twitter :

<a class="social-icons" href="https://twitter.com/4weeb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3YzN9SSXHhdXu7FWdfAEdPpulxtfJuSerfD43PTL4QI4o9PEnLGD2LrcO0bcOJi01-fLM7WvXo1GnaIeEPRgiaTvH5nwhg3Z4LYR0L8z1ne56lBZaw2GXoitw6c60GOykSK_oOO1HVayW/s1600/bloggertrix-twitter.png" /></a>

الكود الخاص بموقع Googleplus :

 <a class="social-icons" href="https://plus.google.com/4weeb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6tWMf3XhuwCfLVEHD2RonZoBkor5rq_fwTOQXY4_UMtpknl7OauUnfVeOeSm-pY7iH8ByVTbvTJN-jFB42spF1hsrPsxL94T7p6Ba3untud4PQV81fP3bqC_ek54gl41zni0EwKkNMO-p/s1600/Bloggertrix-Googleplus.png" /></a>

الكود الخاص بموقع feedburner :

<a class="social-icons" href="http://www.feedburner.com/4weeb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWQY3hFhANVyya_2oMfqxCz0M-k8r0qUsK6VgS4SDebyzZlBPA3vOnHkKk5Wl_zmKIZnYr0Jc75HlgGhgFi9t66lg4BSxwqAKMJf4FXnuJLnRKfSH4fmhHm10ctlhmc9aGRFiy-MJvyH54/s1600/Bloggertrix-Rss.png" /></a>

 الكود الخاص بموقع pinterest : 

<a class="social-icons" href="http://pinterest.com/4weeb"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0GJVaoqmXaByHR9md9anSXkJeFU-c1RdwTlc5dyCuyxqloCSBD-iA8jBztr4i1EUdEEa0uze-d3PdU9S3pxHl_ebFK6R8TUdcUHbRQPFsnBKBQ1TSduhj8O5zpwgQQueBnD6J0oYHvmLy/s1600/Bloggertrix-pinterest.png" /></a>

 

قالب بلوجر