الخميس، 18 سبتمبر 2014
السلام عليكم و رحمة الله و بركاته
متابعينا الأوفياء معنا اليوم حلة جديدة من أزرار المشاركة الإجتماعية التي توضع أسفل الموضوع أو التدوينة قصد تمكين الزائر من مشاركتها مع أصدقائه و لقد تكلمنا في تدوينات سابقة عن أهميتها في نشر مواضيع المدونة و جعلها تستقطب زوارا كثر من مختلف المصادر كي لا أنسى يمكنكم الحصول على المزيد و من الأزرار بأنواع و أشكال مختلفة فقط في قسم الأضافات الإجتماعية
المهم كي لا أطيل عليكم ننتقل لطريقة التركيب
متابعينا الأوفياء معنا اليوم حلة جديدة من أزرار المشاركة الإجتماعية التي توضع أسفل الموضوع أو التدوينة قصد تمكين الزائر من مشاركتها مع أصدقائه و لقد تكلمنا في تدوينات سابقة عن أهميتها في نشر مواضيع المدونة و جعلها تستقطب زوارا كثر من مختلف المصادر كي لا أنسى يمكنكم الحصول على المزيد و من الأزرار بأنواع و أشكال مختلفة فقط في قسم الأضافات الإجتماعية
المهم كي لا أطيل عليكم ننتقل لطريقة التركيب
1- نذهب للوحة التحكم ثم نختار القالب ثم تحرير html
2- نبحث عن الوسم </head>
ثم نضع الكود التالي قبله
<style type='text/css'>
ul.social { list-style:none; margin:15px auto;display:inline-block; }
ul.social li { display:inline; float:left; background-repeat:no-repeat; }
ul.social li a { display:block; width:48px; height:48px; padding-right:10px; position:relative; text-decoration:none; }
ul.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);}
ul.social li.facebook { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGStpwBSDqgrEb9eihWn3DvLs4wUrRyYPWa-eYN-YcEHh8XbD8cjNW6b6Fs17_DyFnVN5P2jwNBf50c_qBtPfP3vmfOagr5LCugHLcEbt1FsUDkN_Gmz4dZ4en4vNPJPz_G-E6tFC8S4Lv/s1600/way2blogging-facebook.png"); }
ul.social li.twitter { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxuTcgbnTyr2h-e0C0AlVWRfM1pluoMZ7i682kJGwESDeI23etROwuGXnwkPTYlgYLKZMn1a0uHBiggnagDG5txuxsHskPGf207IlV5hZQvq7_an2VlAuYWfht0gyVoJ5QrQ_6YyJCcLa-/s1600/way2blogging-twitter.png"); }
ul.social li.googlebuzz { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkh0ZEFnwUGa7YQ9qvJtp_djbsqpllaEIVvBqPahyphenhyphenlaQGtFCcJam8zYe8iG7PnIH7ic-uNxcPlxt1Tj_kjhPcPegWJgEFUkXeO48NP6Z18WeOuvcR-P1onLMI19hKRgKRmzhPz49nWNOFF/s1600/way2blogging-googlebuzz.png"); }
ul.social li.stumbleupon { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqCnsid5w8d4pqyZj-TI9tpHwZyBWQMBZqYSVWAgn_i6XIVp5gO2vjc-XQILm-ZAXtei6lcZUROomJFmvizPiSckpmMTq11tt6qbKKKYhsDl4JD5p7yrauw8LEKgDLC5CENy4LLzl6ivg8/s1600/way2blogging-stumbleupon.png"); }
ul.social li.digg { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVBwBOAtSzV3WMWFYixt26oQQl9ActQQqiFB9RTK3-AfZ8YI14zsn-Yz4DculXtyjMr0gZBNx_3TZbKiWszaVRjiK_WN_JU-OHkD6cdZW96wgOzDGRdZjw-WnC6l3IBF-f74tVWOSeJxqe/s1600/way2blogging-digg.png"); }
ul.social li.delicious { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt1cYgcj4Qh3oVX6nptrd-SBIJOJTe3ZLoLfk398bEcFx7CpW0IVwdemS5W942CAUR_WE9gbYb9IatxG3yXwUnh04zwr2X2OV1D4Y2IQiBSRTBeJq10h6j28FY1niZk7YY-5WVJv6a1H3g/s1600/way2blogging-delicious.png"); }
ul.social li.linkedin { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggTwn3xR5L-U_-0fI6H-GlwCSdpnhI3b4XcKM2H3AgmB0hleHwD6IBL9HJzy0KihoyXmyuuXr7x3ByobdJvOkd_yyHvhrI6yu0Qd-ghWZuDxdykIdl1MHA3pIDoV0HRMV5cNI6SIDHvvQF/s1600/way2blogging-linkedin.png"); }
ul.social li.reddit { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPGBgW0Jv4cwLc4730EsVN_G0xgeTFMubbWB6OHb5nKZocIO0823K_JANmBNLdG88HtvEcexzDxbigVD2hwnHwAqFFIpoYwHhGI4Y0eHlW6HG48PCDEwOo2vzVl_iX92MyQLrXzd_IbaeY/s1600/way2blogging-reddit.png"); }
ul.social li.technorati { background-image:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyS_lbUY6iW9-VRHvUKiQf9prU5zbSEaZ-ubrZr1HcLxmYHAXrX8_6Jpk9M9BgeRD9ChcbtRQvxBvg1gnuqpIZ__bjY3P5IlUHMao09Wikq_JQ1VFZsmzNE5_ChoH3NJh5mNh2BcxAFpXp/s1600/way2blogging-technorati.png"); }
#cssanime:hover li { opacity:0.2; }
#cssanime li { -webkit-transition-property: opacity; -webkit-transition-duration: 500ms;-moz-transition-property: opacity; -moz-transition-duration: 500ms; }
#cssanime li a strong { opacity:0; -webkit-transition-property: opacity, top; -webkit-transition-duration: 300ms; -moz-transition-property: opacity, top; -moz-transition-duration: 300ms; }
#cssanime li:hover { opacity:1; }
#cssanime li:hover a strong { opacity:1; top:-10px; }
</style>
3- ثم نبحث عن هذا الكود
<data:post.body/>
* ملاحظة قد نجد أكثر من كود الثاني هو المقصود
و نضع الكود التالي بعده
<!-- by warch-mo.blogspot.com -->
<b:if cond='data:blog.pageType == "item"'>
<ul class='social' id='cssanime'>
<li class='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'><strong>Facebook</strong></a>
</li>
<li class='twitter'>
<a expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' title='Tweet This!'><strong>Twitter</strong></a>
</li>
<li class='googlebuzz'>
<a expr:href='"http://www.google.com/buzz/post?url=" + data:post.url + "&imageurl="' rel='nofollow' title='Post on GoogleBuzz'><strong>Google Buzz</strong></a>
</li>
<li class='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'><strong>StumbleUpon</strong></a>
</li>
<li class='digg'>
<a expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Digg this!'><strong>Digg</strong></a>
</li>
<li class='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'><strong>Delicious</strong></a>
</li>
<li class='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'><strong>LinkedIn</strong></a>
</li>
<li class='reddit'>
<a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on Reddit'><strong>Reddit</strong></a>
</li>
<li class='technorati'>
<a expr:href='"http://technorati.com/faves?add=" + data:post.url ' rel='nofollow' title='Share this on Technorati'><strong>Technorati</strong></a>
</li>
</ul>
</b:if>
<!-- by warch-mo.blogspot.com -->
ثم قم بحفظ القالب و قم بمعاينة المدونة و إنشاء الله ستحصل على أزرار رائعة
دمتم بود في أمان الله
الاشتراك في:
تعليقات الرسالة (Atom)
مميزة
-
السلام عليكم ورحمة الله تعالى وبركاته أصدقائي و أحبائي متابعي ورشة مدون الأوفياء، أولا أحب أن أعتذر منكم بسبب طول غيابي هذا و توقفي عن ط...
-
السلام عليكم و رحمة الله وبركاته . هل تريد كسب مهتمين ومتابعين ؟! هل تريد نشر مواضيعك بأكبر نسبة ممكنة في مواقع التواصل الإجتماعية، اليو...
-
السلام عليكم ورحمة الله إنشاء الله سنتعلم كيف نعدل الصفحات الثابتة في البلوجر " Blogger Static Pages " وجعلها بعرض المدون...
-
أداة إقرأ المزيد أو ما يسمى read more، من الإضافات الضرورية في المدونات أو المواقع مهما كان نوعها، فهي تتحكم في حجم المحتوى الذي يظهر في...
-
السلام عليكم ورحمة الله وبركاته متابعي ورشة مدون الأوفياء، أعتذر عن مدة غيابي التي كانت بسبب بعض المشاكل التقنية الخارجة عن إرادتي، الم...
-
السلام عليكم ورحمة الله وبركاته. يعتبر إنشاء صفحة الفهرس من بين الأداوت التي تسهل على الزوار التنقل بين مواضيع المدونة ، خصوصا الاصناف ...
-
السلام عليكم و رحمة الله وبركاته. متابعي ورشة مدون الأوفياء في تدوينة اليوم سنتطرق إلى كيفية جعل خلفية مدونتك "background website...
-
سلام الله عليكم، نلتقي من جديد في ورشة مدون اليوم أحبابي فالله بعد أن طلب مني بعض الاخوة في الصفحة أنهم يريدون قوالب رمضانية فقمت بج...
-
السلام عليكم ورحمة الله وبركاته أولا أحب أن أعتذر عن الإنقطاع جراء بعض مشاكل مع شركة الإتصال ,,, المهم كأول لقاء مع متابعي ورشة مدون الأ...
-
السلام عليكم و رحمة الله و بركاته، مجال التدوين يعتبر من الأولويات التي على المدون إختيارها بعناية ، لبناء مشروعه على الويب، فأغلب المد...
تعليقات الزوار
أرشيف المدونة الإلكترونية
-
▼
2014
(100)
-
▼
سبتمبر
(9)
- حصريا: نظام أخر التعليقات مع خاصية الإشعارات لمدون...
- صندوق التبادل الإعلاني النصي للبلوجر
- جديد أزرار المشاركة الإجتماعية لمواضيع المدونة
- تحميل الإصدار الأخير من قالب المحترف النسخة الأصلية
- أزرار الصفحات الإجماعية بشكل أنيق و متحرك
- أزرار المواقع الإجتماعية بخاصية CSS
- حصريا حل مشكلة توقف سلايدر شو المحترف على ورشة مدون
- تحميل قالب"Tracker Magazine" المعرب و المطور
- إظهار النسبة المئوية بجانب شريط التمرير للمدونة
-
▼
سبتمبر
(9)
تواصل معنا على الفيسبوك
أهم المواضيع
-
السلام عليكم ورحمة الله تعالى وبركاته أصدقائي و أحبائي متابعي ورشة مدون الأوفياء، أولا أحب أن أعتذر منكم بسبب طول غيابي هذا و توقفي عن ط...
-
السلام عليكم و رحمة الله وبركاته . هل تريد كسب مهتمين ومتابعين ؟! هل تريد نشر مواضيعك بأكبر نسبة ممكنة في مواقع التواصل الإجتماعية، اليو...
-
السلام عليكم ورحمة الله إنشاء الله سنتعلم كيف نعدل الصفحات الثابتة في البلوجر " Blogger Static Pages " وجعلها بعرض المدون...
-
أداة إقرأ المزيد أو ما يسمى read more، من الإضافات الضرورية في المدونات أو المواقع مهما كان نوعها، فهي تتحكم في حجم المحتوى الذي يظهر في...
-
السلام عليكم ورحمة الله وبركاته متابعي ورشة مدون الأوفياء، أعتذر عن مدة غيابي التي كانت بسبب بعض المشاكل التقنية الخارجة عن إرادتي، الم...
-
السلام عليكم ورحمة الله وبركاته. يعتبر إنشاء صفحة الفهرس من بين الأداوت التي تسهل على الزوار التنقل بين مواضيع المدونة ، خصوصا الاصناف ...
-
السلام عليكم و رحمة الله وبركاته. متابعي ورشة مدون الأوفياء في تدوينة اليوم سنتطرق إلى كيفية جعل خلفية مدونتك "background website...
-
سلام الله عليكم، نلتقي من جديد في ورشة مدون اليوم أحبابي فالله بعد أن طلب مني بعض الاخوة في الصفحة أنهم يريدون قوالب رمضانية فقمت بج...
-
السلام عليكم ورحمة الله وبركاته أولا أحب أن أعتذر عن الإنقطاع جراء بعض مشاكل مع شركة الإتصال ,,, المهم كأول لقاء مع متابعي ورشة مدون الأ...
-
السلام عليكم و رحمة الله و بركاته، مجال التدوين يعتبر من الأولويات التي على المدون إختيارها بعناية ، لبناء مشروعه على الويب، فأغلب المد...
ليست هناك تعليقات:
إرسال تعليق
يسعدنا تفاعلكم بالتعليق , أما لو لديك سؤال خارج الموضوع يرجى استخدام ركن الأسئلة ولإضافة كود قم بتحويله أولابمحول الأكواد , ويمكنك ان تستخدم الإبتسامات بالوقوف عليها لمعرفة الكود
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r