إضافة أزرار المشاركات الإجتماعية لمدونات بلوجر فلات 2016.

أزرار المشاركة الإجتماعية فلات للبلوجر:

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

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

أزرار المشاركات فلات لقوالب بلوجر بلوجر 

معاينة

- يمكنك إلقاء نظرة هنا أيضا :

اضافة أيقونات المشاركة بشكل دائري وخفيف.

-أزرار المشاركات الاجتماعية  فلات لـ قالب بلوجر  التي في الصورة بها أكبر خمسة مواقع اجتماعية في العالم وهاته المواقع لايستهان بها في محركات البحث ربما موضوعك لايصل إلى المراتب الأولى في البحث لكن مع المواقع الاجتماعية ستجده في الصفحة الأولى هاته واحدة من الخصائص التي تميز نشر المواضيع هناك .
- على بركة الله نبدأ في تركيب إضافة أزرار المشاركة الإجتماعية لمدونات بلوجر  خطوة خطوة أنصحك عزيزي المدون بتحميل نسخة إحتياطية لقالب بلوجر تحسبا لأي طارئ.
1- الخطوة الأولى قم بالدخول لـ قالب بلوجر واتبع الخطوات الموجودة اسفله

كيفية الدخول للقالب

2- الخطوة الثانية قم بحفظ نسخة إحتياطية لقالب بلوجر الخاص بك 

نسخ القالب

3- قم بالدخول على تحرير قالب بلوجر

الدخول للقالب HTML

4- الخطوة الرابعة قم بالبحث عن الكود التالي:</style>

- إن لم تنجح في هذا المكان قم بالبحث عن:</b:template-skin>

- لم تنجح بقي لدينا خيار وحيد هنا : ]]></b:skin>

بالضغط على CTRL+F

ملاحظة : لنسخ الأكواد كاملة وصحيحة قم بالضغط مرتين عليه .

البحث في القالب 

5- قم بوضع كود CSSالتالي قبلها مباشرة يعني فوقها.

 /* CSS Share Button */
.sharepost li{width:19%;padding:0;list-style:none;}
.sharepost li a{opacity:0.8;padding:10px 0;color:#fff;display:block;border:double #fff;}
.sharepost{overflow:hidden;text-align:center;margin-bottom:20px;margin-top:20px;}
.sharepost li a:hover{opacity:1;color:#444;border:double #fff;}
.sharepost li .twitter{background-color:#55acee;}
.sharepost li .facebook{background-color:#3b5998;}
.sharepost li .gplus{background-color:#dd4b39;}
.sharepost li .pinterest{background-color:#cc2127;}
.sharepost li .linkedin{background-color:#0976b4;}
.sharepost li .twitter:hover,.sharepost li .facebook:hover,.sharepost li .gplus:hover,
.sharepost li .pinterest:hover,.sharepost li .linkedin:hover{background-color:#444;color:#fff;}
.sharepost li{float:left;margin-right:1.2%}
.sharepost li:last-child{margin-right:0}
.sharepost li .fa:before{margin-right:5px} 

6- كما في المرة السابقة قم بالبحث عن كود:<head/>
وضع الكود التالي فوقه أيضا .

 <link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/> 

7- الخطوة الأخيرة قم بالبحث عن الكود التالي<data:post.body/>

- ملاحظة: ربما تجد في قالبك الكود مرتين أو ثلاثة قم بإضافتها تحت الأخير .

وضع الكود التالي تحتها طبعا .

 <b:if cond='data:blog.pageType == &quot;item&quot;'>
        <div class='sharepost'>
                <ul>
                <li><a class='twitter' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank' title='Twitter Tweet'><i class='fa fa-twitter'/>Tweet</a></li>

                <li><a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:blog.url' rel='nofollow' target='_blank' title='Facebook Share'><i class='fa fa-facebook'/>Share</a></li>

                <li><a class='gplus' expr:href='&quot;http://plus.google.com/share?url=&quot; + data:blog.url' rel='nofollow' target='_blank' title='Google Plus Share'><i class='fa fa-google-plus'/>Share</a></li>

    <li><a class='linkedin' expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;amp;url=&quot; + data:post.url + &quot;&amp;amp;title=&quot; + data:post.title + &quot;&amp;amp;summary=&quot; + data:post.snippets' target='_blank'><i class='fa fa-linkedin'/>Share</a></li>

                <li><a class='pinterest' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;&amp;amp;media=&quot; + data:post.thumbnailUrl + &quot;&amp;amp;description= + data:post.title&quot;' target='_blank'><i class='fa fa-pinterest'/>Share</a></li>

                </ul>
         </div> </b:if> 

- الآن قم بحفظ قالب بلوجرالخاص بك ومبروك عليك اضافة أزرار المشاركات  والتي سوف تساعدك في نشر مواضيعك وتساعد الزوار في نشرها أيضا بتبادل المواضيع عبر المواقع الإجتماعية .

فيديو يوضح كيفية إضافة أزرار المشاركات الإجتماعية لمدونات بلوجر فلات 2016.

الكاتب : HG HG JA