الأحد، 24 فبراير 2013
إقرء المزيد بتقنية CSS3 لمدونات Blogger
اضافة إقرء المزيد بتقنية CSS3 لمدونات Blogger
بسم الله الرحمن الرحيم وبه نستعين والصلاة والسلام علي اشرف المرسلين ثم اما بعد
السلام عليكم ورحمة الله وبركاته
هل تريد إضافة مزيد من الاحترافية في اضافة اقرا المزيد في مدونتك ؟
إذا كانت إجابتك على الأسئلة السابقة بنعم ، فهذه السلسلة من الدروس هي لك !
حسناً ...
درسنا اليوم .... هو كيفية اضافة اقرء المزيد بتقنية css3
اولا : اذهب الي لوحة تحكم بلوجر
ثانيا : اتبع التعليمات...
اخذ نسخة احطايتية من قالبك توقعا لحدوث اي خطا.
قالب
تحرير html
متابعة
توسيع عناصر وجهة المستخدم
وبعدها ابحث عن هذا الوسم
</head>
قم بلصق الكود التالي قبله مباشرة
كود HTML:
<script type='text/javascript'>var thumbnail_mode = "no-float" ; summary_noimg = 300; /* طول الملخص للمواضيع بدون صورة */ summary_img = 250; /* طول الملخص للمواضيع ذات صورة*/ img_thumb_height = 128; /* عرض الصورة في الملخص*/ img_thumb_width = 128; /*طول الصورة في الملخص */ </script> <script src='http://abuiyad.googlecode.com/svn/read-more-right.js' type='text/javascript'/><font size="0"><a href=" http://www.weight-losssuccessstories.net">siege auto</a></font>
والآن قم بالبحث عن الكود التالي :
<data:post.body/>
ثم قم بإستبدالة بهذا الكود :
كود HTML:
<b:if cond='data:blog.pageType == "static_page"'><br/><data:post.body/> <b:else/> <b:if cond='data:blog.pageType != "item"'> <div expr:id='"summary" + data:post.id'> <data:post.body/></div><script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'>إقرأ المزيد...</a></span> <a href='http://abu-iyad.blogspot.com/2010/07/read-more-for-blogger.html' style='display:none;'>Résumé</a><a href='http://abu-iyad.blogspot.com' style='display:none;'>abuiyad</a> </b:if> <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if> </b:if><font size="0"><a href=" http://www.weight-losssuccessstories.net/ ">siege auto</a></font>
استبدل كلمة إقرأ المزيد... باي كلمة تريد.
الان ذهب الي الصفحة الرئيسية ستجد الااضافة موجودة
سنضيف التاثير علي الاضافة
ابحث عن الوسم التالي وضع قبله او فوقه الكود التالي
]]></b:skin>
كود HTML:
.rmlink a{ background: #F1F1F1; border: 1px solid #E6E6E6; border-radius: 5px 5px 5px 5px; box-shadow: 0 0 2px #FFFFFF inset, 0 1px 1px #CACACA; color: #999999 !important; display: inline-block; font: 17px "Arial"; font-weight:700; text-align: center; padding: 2px 15px 2px; color: #999999 !important; padding-right:15px; padding-left:15px; padding-tpo:5px; padding-bottom:3px; margin-top:15px; -webkit-transition: background 0.4s ease-in-out; -moz-transition: background 0.4s ease-in-out; -o-transition: background 0.4s ease-in-out; -ms-transition: background 0.4s ease-in-out; transition: background 0.4s ease-in-out; } .rmlink a:hover { background-color: #00A8D8; border-color: #fff; outline: medium none; color: #f3f3f3 !important; text-decoration:none }
اخيرا مبروك عليك الاضافة .
... نهاية الشرح ...
قم بتصفح جميع الموضوعات |
ولأي إستفسار الرجاء ترك تعليقاتكم لأقوم بالإجابة عليها في القريب العاجل
لا تقرأ وترحل شارك معنا بتعليق فنحن نسعى لنقدم لك الافضل والاجمل
التسميات:
اضافات css
بقلم : Abda3Design
لخدمات التصميم والبرمجة
إدارة تتبنى عمل المواقع الخدمية المتنوعة للأفراد والهيئات والمؤسسات الكبرى. كما يمكنها عمل مواقع للتجارة الإلكترونية كما تتميز مؤسسة "ابداع ديزاين" . بأقوى فريق عمل متواصل مع العملاء 24 ساعة على مدار الأسبوع وتمتاز أيضا بكفاءة الدقة والسرعة
ضع تعليقك
1 التعليقات:
جزاك الله خيراا
إرسال تعليق