Ahmed Hamdi .:: مؤسس الموقع ::.معلومات العضو
موضوع: إضافة شريط لأيقونات المواقع الإجتماعية تحت كل مقالة في بلوجر الأحد 31 يوليو 2011, 9:35 amإضافة شريط لأيقونات المواقع الإجتماعية تحت كل مقالة في بلوجر أهمية الإضافة: -بإضافتها تتيح لزائر نشر مقالاتك في المواقع الإجتماعية بكل سهولة. -تزيد من إنتشار مقالاتك في المواقع الإجتماعية. -تزيد من جمال مدونتك.معلومات عن الشرح : -مدة التي تحتاجها : أقل من 6 دقائق. -الخبرة التي تحتاجها:لا تتطلب منك خبرة . -ماذا نحتاج : لا تحتاج أي شىء. -هل الخدمة مجانية:نعم الخدمة مجانية تماما. -هل تحتاج تحميل:لا تحتاج.نبدأ على بركة الله : أولا نذهب إلى التخطيط ثم تحرير Html و نقوم بتوسيع القالب نبحث عن هذا الكود من خلال CTRL + F: الكود: </head>
و نضيف هذا قبله أي فوقه : الكود: <!--HIDDEN-BOOKMARKS-STARTS--> <style type='text/css'> div.beauty-bookmarks { height:54px; background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat left bottom; position:relative; width:540px; } div.beauty-bookmarks span.beauty-rightside { width:17px; height:54px; background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat right bottom; position:absolute; right:-17px; } div.beauty-bookmarks ul.socials { margin:0 !important; padding:0 !important; position:absolute; bottom:0; left:10px; } div.beauty-bookmarks ul.socials li { display:inline-block !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:48px !important; cursor:pointer !important; padding:0 !important; } div.beauty-bookmarks ul.socials a { display:block !important; width:48px !important; height:29px !important; font-size:0 !important; color:transparent !important; } .beauty-furl, .beauty-furl:hover, .beauty-digg, .beauty-digg:hover, .beauty-reddit, .beauty-reddit:hover, .beauty-stumble, .beauty-stumble:hover, .beauty-delicious, .beauty-delicious:hover, .beauty-yahoo, .beauty-yahoo:hover, .beauty-blinklist, .beauty-blinklist:hover, .beauty-technorati, .beauty-technorati:hover, .beauty-facebook, .beauty-facebook:hover, .beauty-twitter, .beauty-twitter:hover, .beauty-myspace, .beauty-myspace:hover, .beauty-mixx, .beauty-mixx:hover, .beauty-script-style, .beauty-script-style:hover, .beauty-designfloat, .beauty-designfloat:hover, .beauty-syndicate, .beauty-syndicate:hover, .beauty-email, .beauty-email:hover { background:url('http://i44.tinypic.com/1znbj83.png') no-repeat !important; } .beauty-furl { background-position:-300px top !important; } .beauty-furl:hover { background-position:-300px bottom !important; } .beauty-digg { background-position:-500px top !important; } .beauty-digg:hover { background-position:-500px bottom !important; } .beauty-reddit { background-position:-100px top !important; } .beauty-reddit:hover { background-position:-100px bottom !important; } .beauty-stumble { background-position:-50px top !important; } .beauty-stumble:hover { background-position:-50px bottom !important; } .beauty-delicious { background-position:left top !important; } .beauty-delicious:hover { background-position:left bottom !important; } .beauty-yahoo { background-position:-650px top !important; } .beauty-yahoo:hover { background-position:-650px bottom !important; } .beauty-blinklist { background-position:-600px top !important; } .beauty-blinklist:hover { background-position:-600px bottom !important; } .beauty-technorati { background-position:-700px top !important; } .beauty-technorati:hover { background-position:-700px bottom !important; } .beauty-myspace { background-position:-200px top !important; } .beauty-myspace:hover { background-position:-200px bottom !important; } .beauty-twitter { background-position:-350px top !important; } .beauty-twitter:hover { background-position:-350px bottom !important; } .beauty-facebook { background-position:-450px top !important; } .beauty-facebook:hover { background-position:-450px bottom !important; } .beauty-mixx { background-position:-250px top !important; } .beauty-mixx:hover { background-position:-250px bottom !important; } .beauty-script-style { background-position:-400px top !important; } .beauty-script-style:hover { background-position:-400px bottom !important; } .beauty-designfloat { background-position:-550px top !important; } .beauty-designfloat:hover { background-position:-550px bottom !important; } .beauty-syndicate { background-position:-150px top !important; } .beauty-syndicate:hover { background-position:-150px bottom !important; } .beauty-email { background-position:-753px top !important; } .beauty-email:hover { background-position:-753px bottom !important; } </style> <!--blogger-http://yesword.blogspot.Com-->
و بعدها نبحث عن هذا الكود : الكود: <data:post.body/>
نضيف هذا الكود بعده أي تحته: الكود: <b:if cond='data:blog.pageType == "item"'> <div class='beauty-bookmarks'> <ul class='socials'> <li class='beauty-delicious'><a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> <li class='beauty-digg'><a expr:href='" http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> <li class='beauty-technorati'><a expr:href='" http://technorati.com/faves?add=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> <li class='beauty-reddit'><a expr:href='" http://www.reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> <li class='beauty-stumble'><a expr:href='" http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> <li class='beauty-designfloat'><a expr:href='"http://www.designfloat.com/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> <li class='beauty-facebook'><a expr:href='" http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> <li class='beauty-twitter'><a expr:href='"http://twitter.com/home/?status=Chk Out-" + data:post.title + " " + data:post.url' target='_blank'/></li> <li class='beauty-furl'><a expr:href='" http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> <li class='beauty-syndicate'><a href='http://feeds.feedburner.com/sniper2day' title='Subscribe to RSS'/></li> <li class='beauty-email'><a expr:href='" mailto:?subject=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li> </ul> <span class='beauty-rightside'/></div> </b:if>
و نعمل حفظ و نذهب لرؤية النتيجة و هذه الخدمة أستعملها في مدونتي هذه.بعض الملاحظات: -قم بالبحث عن كلمة sniper2day في الكود الثاني و قم بتغييرها بإسم حسابك في فييد بيرنر إذا كنت تملكه. -تستطيع حذف أي أيقونة من بين الأيقونات الموجودة. -مكان موضع الأيقونات : تحت كل مقالة بدون إستنثاء. أتمنى أن تكون قد إستفدت من الشرح البسيط.
توقيع : Ahmed Hamdi
serag omar badawi مشرف تحت الاختبارمعلومات العضو
موضوع: رد: إضافة شريط لأيقونات المواقع الإجتماعية تحت كل مقالة في بلوجر الأربعاء 16 نوفمبر 2011, 11:33 amمشكوووووووووووووووووووووووووورر
توقيع : serag omar badawi