اضافة ايقونات المشاركات اسفل التدوينات بشكل احترافي !!

بسم الله الرحمن الرحيم

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


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

كل ما عليك هو متابعتي في الشرح :) 

أول شي  نقوم بالذهاب الى قالب مدونتك ثم تحرير 

ونبحث عن الكود التالي

</data:post.body>

قد تجد أكثر من كود حسب القالب سيكون الثاني و إن لم يعمل جربه على باقي الأكواد الموجودة فسيعمل مع أحدها.

**********************************

<style> 
/*--------Flipper Sharing Widget ------*/ 
.flipper a { 
display:block; 
height:48px; 
width:48px; 
padding:0 4px; 
float:left; 
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhueBGPeAUO1n4NWRlLfmpNEutGB0wNLIoRPswMLeJDTQE8TJFXmDF20xrNrsvQLd6LgbG7K-fQbOsmPI3Cp17c7tEW1-hQvW0OiSzT-vkJce3kAvbVepJizUAt3sjS9zq8XzS8PTU_4Lm3/s1600/flipper.png) no-repeat; 
-webkit-transition: ease-in 0.15s all;    
-moz-transition: ease-in 0.15s all;    
-o-transition: ease-in 0.15s all;    
-ms-transition: ease-in 0.15s all;    
transition: ease-in 0.15s all; 
cursor:pointer;
}

.flipper a.googleplus { 
background-position: 0px -348px;
.flipper a.googleplus:hover { 
background-position: 0px -406px;
}

.flipper a.pinterest { 
background-position: 0px -464px; 
.flipper a.pinterest:hover { 
background-position: 0px -522px;
}

.flipper a.delicious { 
background-position: 0px 0px; 
.flipper a.delicious:hover { 
background-position: 0px -58px;
.flipper a.digg { 
background-position: 0px -116px;
.flipper a.digg:hover { 
background-position: 0px -174px;
.flipper a.stumbleupon { 
background-position: 0px -812px;
.flipper a.stumbleupon:hover { 
background-position: 0px -870px;
.flipper a.technorati { 
background-position: 0px -928px;
.flipper a.technorati:hover { 
background-position: 0px -406px;
.flipper a.twitter { 
background-position: 0px -928px;
.flipper a.twitter:hover { 
background-position: 0px -986px;
.flipper a.facebook { 
background-position: 0px -232px;
.flipper a.facebook:hover { 
background-position: 0px -290px;
.flipper a.reddit { 
background-position: 0px -580px;
.flipper a.reddit:hover { 
background-position: 0px -638px;
}
.flipper a.rss { 
background-position: 0px -696px;
.flipper a.rss:hover { 
background-position: 0px -754px;
}

.Pleaseshare{ 
margin:10px 0px; 
color:#333333
font-weight:bold; 
font-size:20px; 
font-family:sans-serif;
</style>

<div class='flipper'> 
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="Pleaseshare"> 
إن أعجبك الموضوع قم بنشره) </div>

<!--Google Plus--> 
<a class='googleplus' expr:href='&quot;http://plus.google.com/share?url=&quot; + data:post.url' rel='external nofollow' target='_blank' title='+1 it :&gt;'/>

<!--Facebook--> 
<a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Share this on Facebook :&gt;'/>

<!-- Twitter --> 
<a class='twitter' expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Tweet this :&gt;'/>

<!-- Pinterest --> 
<a class='pinterest'  href="http://pinterest.com/" rel='external nofollow' target='_blank' title='Pin it :&gt;'/>

<!-- Delicious --> 
<a class='delicious' expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Add this to Delicious :&gt;'/>

<!--DIGG--> 
<a class='digg' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url' rel='external nofollow' target='_blank' title='Digg this :&gt;'/>
<!--Stumble--> 
<a class='stumbleupon' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Stumble this :&gt;'/>

<!-- Reddit --> 
<a class='reddit' expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank' title='Add this to Reddit :&gt;'/>
<!--RSS --> 
<a class='rss' expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' title='Bookmark plz :&gt;'/> 
</b:if></div>
<div style="clear:both"/>

**********************************
  1. ما هو باللون البرتقالي يمكنك تغيره بما تريد فهو لون النص.
  2. أما الكلام باللون الأحمر يمكنك كتابة ما تريد أو تركه كما هو.
  3. بعد ذالك قم بحفظ القالب و اذهب للمدونة لترى النتيجة.
كلمة شكر تكفي :) ....~


============================
وصف البحث
-------
*

كيفية عمل ايقونات المشارة اسفل التدوينات

عمل مواقع التواصل الاجتماعي في بلوجر

كيفية اضافة عمل مشاركة في مدوني او موقعي

من فضلك شارك هذا الموضوع اذا اعجبك

ضع تعليقا أخي الكريم

ليست هناك تعليقات:

إرسال تعليق

جميع الحقوق محفوظة التقنية نت ©2012-2014 | ، نقل بدون تصريح ممنوع . Privacy-Policy| إتفاقية الإستخدام

مركز تحميل الصور