أخر المقالات
تحميل...

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

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

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

لاضافة هذه الاداة اسفل كل تدوينة اتبع الشرح التالي

اولا اذهب الى لوحة التحكم في مدونتك ثم القالب ثم تحرير html

الان استخدم مفتاح الاختصار ctrlوf ثم ابحث عن الرمز 
]]></b:skin>

ثم اضف الكود التالي فوقه مباشر
ul.bssocial {list-style:none;display:inline-block;margin:15px auto;}ul.bssocial li {display:inline;float:left;background-repeat:no-repeat;}ul.bssocial li a {display:block;width:50px;height:50px;padding-right:10px;position:relative;text-decoration:none;}ul.bssocial li a strong {font-weight:400;position:absolute;left:20px;top:-1px;color:#fff;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);padding:3px;}ul.bssocial li.bsfacebook {background-image:url(http://1.bp.blogspot.com/-dhbW9mA7gus/UasUFsoBj1I/AAAAAAAADR0/hH7NhxaQjRo/s320/BS+Black+facebook.png);}ul.bssocial li.bstwitter {background-image:url(http://1.bp.blogspot.com/-foRgVi7BSCQ/UasUHix6JGI/AAAAAAAADSo/VmDegJmp3bA/s320/BS+Black+twitter.png);}ul.bssocial li.bsredit {background-image:url(http://2.bp.blogspot.com/-A6Xj5bvz_gI/UasUGwCeDlI/AAAAAAAADSQ/ibp1LI1dn4I/s320/BS+Black+reditt.png);}ul li.bstechnorati {background-image: url(http://4.bp.blogspot.com/-AeYKZI7csr8/UasUHbz-keI/AAAAAAAADSg/W6et0yKHRUE/s320/BS+Black+technorati.png);}ul.bssocial li.bsstumbleupon {background-image:url(http://3.bp.blogspot.com/-I_XDslhij-I/UasUGzlxWQI/AAAAAAAADSU/F-Bkfp4YvwE/s320/BS+Black+stumbleupon.png);}ul.bssocial li.bsdig {background-image:url(http://1.bp.blogspot.com/-YvPAJlhGlb0/UasUF5SJY6I/AAAAAAAADR8/U862d2T-LLo/s320/BS+Black+digg.png);}ul.bssocial li.bslinkedin {background-image:url(http://3.bp.blogspot.com/-3UFBbRGm9NQ/UasUGrVMjRI/AAAAAAAADSI/2wDnt6Er-vM/s320/BS+Black+linkedin.png);}ul.bssocial li.bsdelicious {background-image:url(http://4.bp.blogspot.com/-NMNlldMGFjg/UasUFof6r_I/AAAAAAAADR4/Dr8o2ML1kcU/s320/BS+Black+delicious.png);}#bscssanimation:hover li {opacity:0.2;}#bscssanimation li {-webkit-transition-property:opacity;-webkit-transition-duration:500ms;-moz-transition-property:opacity;-moz-transition-duration:500ms;}#bscssanimation li a strong {opacity:0;-webkit-transition-property:opacity, top;-webkit-transition-duration:300ms;-moz-transition-property:opacity, top;-moz-transition-duration:300ms;}#bscssanimation li:hover {opacity:1;}#bscssanimation li:hover a strong {opacity:1;top:-10px;}

الان ابحث عن الرمز 
<data:post.body/>

ثم اضف الكود التالي بعد الرمز <data:post.body/>

 <b:if cond='data:blog.pageType == &quot;item&quot;'><div style='font-size: 22px;'><b>هل اعجبك الموضوع شاركه الأن!..</b></div>    <ul class='bssocial' id='bscssanimation'>    <li class='bsfacebook'>    <a expr:href='&quot;http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title ' onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow'><strong>Facebook</strong></a>    </li>    <li class='bstwitter'>    <a expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot; -- &quot; + data:post.url ' rel='nofollow' target='_blank'><strong>Twitter</strong></a>    </li>    <li class='bsredit'><a expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow'><strong>Reddit</strong></a>    </li>    <li class='bstechnorati'><a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url ' rel='nofollow' target='_blank'><strong>Technorati</strong></a>    </li>    <li class='bsstumbleupon'>    <a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank'><strong>StumbleUpon</strong></a>    </li>    <li class='bsdig'>      <a expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank'><strong>Dig</strong></a>    </li>    <li class='bslinkedin'>    <a expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;summary=&amp;source=&quot;' rel='nofollow' target='_blank'><strong>LinkedIn</strong></a><li class='bsdelicious'>    <a expr:href='&quot;http://delicious.com/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title ' rel='nofollow' target='_blank'><strong>Delicious</strong></a>    </li>    </li>    </ul>    </b:if> 

ملاحظة 
قد تجد اكثر من رمز مثل هذا <data:post.body/>
اذا لم تعمل الاضافة على اول واحد استخدم الثاني  

ثم اختر حفظ وشاهد النتائج

كن الأول دائما علق على " اضافة ايقونات المشاركة للتواصل الاجتماعي اسفل كل تدوينة "

تذكر قوله تعالى:
(( مَا يَلْفِظُ مِنْ قَوْلٍ إِلَّا لَدَيْهِ رَقِيبٌ عَتِيدٌ)) ‏
-----------------------------------
الان يمكنك اضافة اي مقطع فيديو الى التعليقات وايضا اضافة الصور فقط ضع رابط الصور او مقطع الفيديو في التعليقات
----------------------------------
آرائكم تسعدنا, لمتابعة التعليق حتى نرد عليك فقط ضع إشارة على إعلامي

نحن نعرض الإعلانات على الموقع للإسهام في تحسين موقعنا.

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

شكرًا لك

×