إضافة أيقونات مشاركة الموضوع على مواقع الاجتماعية في بلوجر

السلام عليكم ورحمة الله تعالى وبركاته، الكل الآن يعرف مدى أهمية المواقع الإجتماعية على مدونات أو مواقع. فالمواقع الإجتماعية يمكن أن تجلب لك زوار جدد إلى مدونتك ومهتمين أكثر بمدونتك لأنهم يكونوا مستهدفين. وأنا اليوم أحب أن أقدم لكم موضوع له علاقة بهذا الصدد وهو إضافة أيقونات المشاركة إلى مدونتك بشكل جميل، جذاب وسهل للغاية. لكن هذه اضافة فهي للمدونات لأجنبية لأنها تحت اللغة الإنجليزية. و يمكنك أيضا تعريبها و اضافتها لمدونات العربية.

معاينة صورة الإضافة :

كيف إضافة أداة نشر على مواقع الإجتماعية على البلوجر :

• الدخول الى لوحة تحكم  >   اختر المدونة الخاصة بك .
• إضغط على قالب    >    ثم على تحرير HTML .
• باستعمال   CTRL + F   إبحث عن </head>
• أضف هذا الكود فوق </head> .

<style type='text/css'>
/*<![CDATA[*/
         /*New Light Box Social Sharing widget for Blogger By Hukmat @ http://http://hukmat.blogspot.com/*/
@charset "utf-8";
/* CSS Document */
/* ---------- ENTYPO ---------- */
@import url(http://weloveiconfonts.com/api/?family=entypo);
[class*="entypo-"]:before {
 font-family: 'entypo', sans-serif;
}
.social {
 color: #fff;
 display: block;
 font-size: 18px;
 line-height: 30px;
 position: relative;
 text-align: center;
 width: 84%;
}
/*social sharing buttons */
.social span{
width: 180px;
display: block;
padding: 5px;
margin: 5px;
float: left;
font-size: 18px;
text-align: center;
text-decoration: none;
color: #FFF;
}
.social a{
width: 120px;
display: block;
padding: 5px;
margin: 5px;
float: left;
font-size: 18px;
text-align: center;
text-decoration: none;
color: #FFF;
}
/*
* Changes the background colour for Each Button
*/ /*Facebook*/
.entypo-facebook{
    background:#3B5998
}
/*Twitter*/
.entypo-twitter{
    background:#7cd5fd;
}
/*Google Plus*/
.entypo-gplus{
    background:#dd4b39;
}
/*LinkedIn*/
.entypo-linkedin{
    background:#0e76a8;
}
/*StumbleUpon*/
.entypo-stumbleupon{
    background:#EF4916;
}
/*Reddit*/
.reddit{
    background:#369;
}
/*Digg*/
.entypo-digg{
    background:#1B5790;
}
/*Delicious*/
.entypo-delicious{
    background:#0B79E5;
}
.entypo-shareable {
background:#0b5e85;
}
/* Changes the Background Colour for Each Button on Hover*/
.entypo-facebook:hover {
background:#2f4679;
}
.entypo-twitter:hover {
background:#0089bd;
}
.entypo-gplus:hover {
background:#b03b2d;
}
.entypo-stumbleupon:hover {
background:#c4361d;
}
.entypo-linkedin:hover {
background:#0b5e85;
}
.entypo-shareable:hover {
background:#0b5e85;
}
         /*New Light Box Social Sharing widget for Blogger By hukmat @ http://hukmat.blogspot.com/*/
    /*]]>*/
</style>

• باستعمال   CTRL + F   إبحث عن <data:post.body/>

• ثم أضف هذا الكود تحته مباشرة .

<b:if cond='data:blog.pageType == &quot;item&quot;'><div class="social">          <!--New Light Box Social Sharing widget for Blogger By Hukmat @ http://http://HUKMAT.BLOGSPOT.com/ -->        <span class="entypo-shareable">Share This Post on:</span>         <!--Facebook-->        <a class="entypo-facebook" expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' rel='nofollow' target='_blank'> Facebook</a>         <!--Twitter-->        <a class="entypo-twitter" expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'> Twitter</a>        <!--Google Plus-->        <a class="entypo-gplus"  expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'> Google+</a> <!--Stumbleupon--> <a class="entypo-stumbleupon" expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share On StumbleUpon !'> Stumble it</a> <!--Linkedin--> <a class="entypo-linkedin" expr:href='&quot;http://www.linkedin.com/cws/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'> LinkedIn</a><!--New Light Box Social Sharing widget for Blogger By Hukmat @ http://HUKMAT.BLOGSPOT.com/ --></div>    </b:if>

• في الأخير إضغط حفظ قالب .

في الختام أتمنى ان يكون الشرح في متناول الجميع ، لا تنسو المشاركة عبر وضع أرائكم و استفساراتكم ، ذمتم في امان الله .

مقالات ذات صلة