افضل طريقتين لاضافة ازرار النشر الاجتماعيه اسفل الموضوع في مدونة بلوجر

افضل طريقتين لاضافة ازرار النشر الاجتماعيه اسفل الموضوع في مدونة بلوجر
لمشاهدة مثال علي الطريقة الاولى ستجدها اسفل هذا الموضوع وانا انصح بها
لخفتها وسرعتها وللاناقه التي تشبه بيها الطريقة الثانيه
لتطبيق الطريقة الاولى بتقنية css3 قم باتباع التالى

1. قم بالذهاب الي لوحة تحكم مدونتك ثم الي تصميم ثم الي تحرير html
2. ضع علامه على

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

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

</head>

وضع قبله الكود الذي بالاسفل

<style type="text/css">
/* Beautiful Social Bookmarking Widget By Harish @ www.way2blogging.org */
 ul.way2blogging-social { list-style:none; margin:15px auto;display:inline-block; }  /* www.way2blogging.org */
 ul.way2blogging-social li { display:inline; float:left; background-repeat:no-repeat; }
 ul.way2blogging-social li a { display:block; width:48px; height:48px; padding-right:10px; position:relative; text-decoration:none; }  /* www.way2blogging.org */
 ul.way2blogging-social li a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:3px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);}  /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-facebook { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKvpYIwCBYqdvpK-G_2DuphCFdt7zHIjosc7xi8giSHhlMkhrq33Fvk04ElpMkPgg16Kk5S4yuZKpOa46pwzg9A5tkEvRvspv598vP1nYWbeulnjGPC7peCB6Pqe0IJqrj95nQTSyaTczH/s1600/way2blogging-facebook.png"); }  /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-twitter { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMSEACZQuUu6vqApSR5Rro9Bxk7YutCfWdSGNs2p2Lj2c7pu7xqLXrrHRDhyHyJWLyapzNiDb8gfuhr7kjj5r2akWDykW_eS7csaFTvx4V2-u2kdwFncn4088W8GcbdefHGH5dd7DZdnna/s1600/way2blogging-twitter.png"); }   /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-googlebuzz { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilwiR_2TzkP5noyr4QUekMsCdPX2lFZ9J_8XBy8CekPhxkQKtGreH4Thnu2GFvnAswT5OM9EK5bDsvVlHitbVNG_NuJYjnAunARs60k5zITTDZd1jBELfTsyCsY38B9V0RPVq8jj7GHcJA/s1600/way2blogging-googlebuzz.png"); }  /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-stumbleupon { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0fUYMeBbb3208dQ0mnfNmzzTodsJhOOW7YEezN2mSak2KhtkpV1xkYMOlo9cLx8np55nqe4MbY2DgOHmMS3Xcb2gcX3QM-g8N_QFa3HnZ8loCTL1kbmclDlXeRWiAM6i1-DEMAKAR0zzg/s1600/way2blogging-stumbleupon.png"); }  /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-digg { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu3NG7m_-WpuRwBuYu7iwYe8c9uhfkxS7C7B05nvy-pRPgaDqIBuS5EfG7ObMM20ehkV35caqh8nMfAnMH99SL-O5C4oV2k23l2PV04qNHhEpKU7faNepPfmoqfPTRXpmMJV8lLmDwe3mI/s1600/way2blogging-digg.png"); }  /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-delicious { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDnGB87YM6ikhRxwOihvxL4OxhjGSM6MAB7ty1OzpTcLgCbel3w1IjR9rxOr0StGCKM1SZzBC2jHl7tpF12MLPYYdhWBcq8mMO4uzu_meAMgbrEC2Vb-cMW66HZSbH8IeEZM2gtJunVUvC/s1600/way2blogging-delicious.png"); }  /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-linkedin { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnBlaUEa7I3u3zbOjHWhJvEjOLvUKga5H2uND4m3fWE_MJsJKcSzubenaUZhQrwz7eWzVvYEng7TWr_sliadc67ELoWrRn9HsJuXW7k2EiF1L-uPK419VGBC7e0pIBJ9Op00eq9qwJur9O/s1600/way2blogging-linkedin.png"); }  /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-reddit { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7lylJ7eQHIchXm7I38PpFx7t6cRovnvNgiJLLXT175wYv9StpBsXhSh3nghKG6z2LyZkKS57dBgCjK8nYq99UMEhx1EHjHgOTF8jWYGPzkW0s4ugIPE0t7jchO9_GW1ae_F3oqPlEZu8Q/s1600/way2blogging-reddit.png"); }  /* www.way2blogging.org */
 ul.way2blogging-social li.way2blogging-technorati { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEcpl-fdHa7URC4e_4wMophPDV_GWUysGjvDSZmmGXmMG3SJtTG6lDlEE_qiyV0xjMPrRIdfPR_utyn4XQKkavvSuA3Pqh2QPUvwgqIyWE7fcAwSbHL3wi1VUZT58fyA7pm2dGzHhrXJjs/s1600/way2blogging-technorati.png"); }  /* www.way2blogging.org */
 #way2blogging-cssanime:hover li { opacity:0.2; }  /* www.way2blogging.org */
 #way2blogging-cssanime li { -webkit-transition-property: opacity; -webkit-transition-duration: 500ms;-moz-transition-property: opacity; -moz-transition-duration: 500ms; }  /* www.way2blogging.org */
 #way2blogging-cssanime li a strong { opacity:0; -webkit-transition-property: opacity, top; -webkit-transition-duration: 300ms; -moz-transition-property: opacity, top; -moz-transition-duration: 300ms; }  /* www.way2blogging.org */
 #way2blogging-cssanime li:hover { opacity:1; }  /* www.way2blogging.org */
 #way2blogging-cssanime li:hover a strong { opacity:1; top:-10px; }  /* www.way2blogging.org */
/* Beautiful Social Bookmarking Widget By Harish @ www.way2blogging.org */
</style>

الان قم بالبحث عن هذا الكود
<data:post.body/>
وضع بعده الكود الذي بالاسفل

<b:if cond='data:blog.pageType == "item"'>
<ul class='way2blogging-social' id='way2blogging-cssanime'>
<li class='way2blogging-facebook'>
 <a expr:href='"http://www.facebook.com/share.php?v=4&src=bm&u=" + data:post.url + "&t=" + data:post.title ' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' title='Share this on Facebook'>Facebook</a>
</li>
<li class='way2blogging-twitter'>
 <a expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' title='Tweet This!'>Twitter</a>
</li>
<li class='way2blogging-googlebuzz'>
 <a expr:href='"http://www.google.com/buzz/post?url=" + data:post.url + "&imageurl="' rel='nofollow' title='Post on GoogleBuzz'>Google Buzz</a>
</li>
<li class='way2blogging-stumbleupon'>
 <a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'>StumbleUpon</a>
</li>
<li class='way2blogging-digg'>
 <a expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Digg this!'>Digg</a>
</li>
<li class='way2blogging-delicious'>
 <a expr:href='"http://delicious.com/post?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on del.icio.us'>Delicious</a>
</li>
<li class='way2blogging-linkedin'>
 <a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=&source="' rel='nofollow' title='Share this on LinkedIn'>LinkedIn</a>
</li>
<li class='way2blogging-reddit'>
 <a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on Reddit'>Reddit</a>
</li>
<li class='way2blogging-technorati'>
 <a expr:href='"http://technorati.com/faves?add=" + data:post.url ' rel='nofollow' title='Share this on Technorati'>Technorati</a>
</li>
</ul>
</b:if>
قم بالحفظ ومبروك عليك الاضافه

الجزء الثاني من الدرس وهو طريقة وضعها بتقنية الجي كويري Jquery?
1. قم بالذهاب الي لوحة تحكم مدونتك & ثم الي تصميم ثم الي تحرير HTML
2. ضع علامه على
توسيع قوالب عناصر واجهة المستخدم

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

</head>

وضع قبله الكود الذي بالاسفل

<style type="text/css">
/* Beautiful Social Bookmarking Widget By Harish @ www.way2blogging.org */
ul.way2blogging-social { list-style:none; margin:15px auto;display:inline-block; } /* www.way2blogging.org */
ul.way2blogging-social li { display:inline; float:left; background-repeat:no-repeat; }
ul.way2blogging-social li a { display:block; width:48px; height:48px; padding-right:10px; position:relative; text-decoration:none; } /* www.way2blogging.org */
ul.way2blogging-social li a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:3px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);} /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-facebook { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKvpYIwCBYqdvpK-G_2DuphCFdt7zHIjosc7xi8giSHhlMkhrq33Fvk04ElpMkPgg16Kk5S4yuZKpOa46pwzg9A5tkEvRvspv598vP1nYWbeulnjGPC7peCB6Pqe0IJqrj95nQTSyaTczH/s1600/way2blogging-facebook.png"); } /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-twitter { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMSEACZQuUu6vqApSR5Rro9Bxk7YutCfWdSGNs2p2Lj2c7pu7xqLXrrHRDhyHyJWLyapzNiDb8gfuhr7kjj5r2akWDykW_eS7csaFTvx4V2-u2kdwFncn4088W8GcbdefHGH5dd7DZdnna/s1600/way2blogging-twitter.png"); } /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-googlebuzz { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilwiR_2TzkP5noyr4QUekMsCdPX2lFZ9J_8XBy8CekPhxkQKtGreH4Thnu2GFvnAswT5OM9EK5bDsvVlHitbVNG_NuJYjnAunARs60k5zITTDZd1jBELfTsyCsY38B9V0RPVq8jj7GHcJA/s1600/way2blogging-googlebuzz.png"); } /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-stumbleupon { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0fUYMeBbb3208dQ0mnfNmzzTodsJhOOW7YEezN2mSak2KhtkpV1xkYMOlo9cLx8np55nqe4MbY2DgOHmMS3Xcb2gcX3QM-g8N_QFa3HnZ8loCTL1kbmclDlXeRWiAM6i1-DEMAKAR0zzg/s1600/way2blogging-stumbleupon.png"); } /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-digg { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu3NG7m_-WpuRwBuYu7iwYe8c9uhfkxS7C7B05nvy-pRPgaDqIBuS5EfG7ObMM20ehkV35caqh8nMfAnMH99SL-O5C4oV2k23l2PV04qNHhEpKU7faNepPfmoqfPTRXpmMJV8lLmDwe3mI/s1600/way2blogging-digg.png"); } /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-delicious { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDnGB87YM6ikhRxwOihvxL4OxhjGSM6MAB7ty1OzpTcLgCbel3w1IjR9rxOr0StGCKM1SZzBC2jHl7tpF12MLPYYdhWBcq8mMO4uzu_meAMgbrEC2Vb-cMW66HZSbH8IeEZM2gtJunVUvC/s1600/way2blogging-delicious.png"); } /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-linkedin { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnBlaUEa7I3u3zbOjHWhJvEjOLvUKga5H2uND4m3fWE_MJsJKcSzubenaUZhQrwz7eWzVvYEng7TWr_sliadc67ELoWrRn9HsJuXW7k2EiF1L-uPK419VGBC7e0pIBJ9Op00eq9qwJur9O/s1600/way2blogging-linkedin.png"); } /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-reddit { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7lylJ7eQHIchXm7I38PpFx7t6cRovnvNgiJLLXT175wYv9StpBsXhSh3nghKG6z2LyZkKS57dBgCjK8nYq99UMEhx1EHjHgOTF8jWYGPzkW0s4ugIPE0t7jchO9_GW1ae_F3oqPlEZu8Q/s1600/way2blogging-reddit.png"); } /* www.way2blogging.org */
ul.way2blogging-social li.way2blogging-technorati { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEcpl-fdHa7URC4e_4wMophPDV_GWUysGjvDSZmmGXmMG3SJtTG6lDlEE_qiyV0xjMPrRIdfPR_utyn4XQKkavvSuA3Pqh2QPUvwgqIyWE7fcAwSbHL3wi1VUZT58fyA7pm2dGzHhrXJjs/s1600/way2blogging-technorati.png"); } /* www.way2blogging.org */
/* Beautiful Social Bookmarking Widget By Harish @ www.way2blogging.org */
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript">
// Beautiful Social Bookmarking Widget By Harish @ www.way2blogging.org
$(document).ready(function () {
$("#way2blogging-jqueryanime li").each(function () {
 $("a strong", this).css("opacity", "0");
});
$("#way2blogging-jqueryanime li").hover(function () {
 $(this).stop().fadeTo(500, 1).siblings().stop().fadeTo(500, 0.2);
 $("a strong", this).stop().animate({
 opacity: 1,
 top: "-10px"
 }, 300);
}, function () {
 $(this).stop().fadeTo(500, 1).siblings().stop().fadeTo(500, 1);
 $("a strong", this).stop().animate({
 opacity: 0,
 top: "-1px"
 }, 300);
});
});
// Beautiful Social Bookmarking Widget By Harish @ www.way2blogging.org
</script>
ثم قم بالبحث عن هذا الكود

<data:post.body/>

وضع بعده الكود الذي بالاسفل
<b:if cond='data:blog.pageType == "item"'> <ul class='way2blogging-social' id='way2blogging-jqueryanime'> <li class='way2blogging-facebook'> <a expr:href='"http://www.facebook.com/share.php?v=4&src=bm&u=" + data:post.url + "&t=" + data:post.title ' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' title='Share this on Facebook'>Facebook</a> </li> <li class='way2blogging-twitter'> <a expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' title='Tweet This!'>Twitter</a> </li> <li class='way2blogging-googlebuzz'> <a expr:href='"http://www.google.com/buzz/post?url=" + data:post.url + "&imageurl="' rel='nofollow' title='Post on Google Buzz'>Google Buzz</a> </li> <li class='way2blogging-stumbleupon'> <a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'>StumbleUpon</a> </li> <li class='way2blogging-digg'> <a expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Digg this!'>Digg</a> </li> <li class='way2blogging-delicious'> <a expr:href='"http://delicious.com/post?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on del.icio.us'>Delicious</a> </li> <li class='way2blogging-linkedin'> <a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=&source="' rel='nofollow' title='Share this on LinkedIn'>LinkedIn</a> </li> <li class='way2blogging-reddit'> <a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on Reddit'>Reddit</a> </li> <li class='way2blogging-technorati'> <a expr:href='"http://technorati.com/faves?add=" + data:post.url ' rel='nofollow' title='Share this on Technorati'>Technorati</a> </li> </ul> </b:if>

الان مبروك عليك الاضافه بتقنية الجي كويري او بتقنية ال css3 وتذكر ان عليك وضع طريقه واحده فقط.