اضافة اقرأ المزيد لمدونة بلوجر بدون جافا سكربت

اضافة اقرأ المزيد بدون جافا سكربت

بسم الله الرحمن الرحيم
والصلاة والسلام على خير خلق الله سيدنا محمد عليه أفضل الصلاة واتم التسليم.
السلام عليكم ورحمة الله وبركاته.

اضافة اقرأ المزيد بدون جافا سكربت

مساء الخير , اضافة اقرأ المزيد من اهم الاضافات التي يجب ان تتوفر قطعياَ في كل قالب بلوجر , فيوجد اضافة اقرأ المزيد بأستخدام الجافا سكربت وهي حقيقة لا افضلها لانها يصعب تعديلها حسب رغبتك وايضاَ عند تصميم قالب بلوجر فأننا نحاول قدر الامكان التخلص من الجافا سكربت الزائدة والتي لا يعتبر لها فائدة.
الطريقة اليوم عبارة عن اضافة اقراء المزيد ولاكن بدون استخدام الجافا سكربت بتاتاَ وبدون استخدام الـ css لاننا سنعتمد فقط على xml+html وسنحقق هذا الهدف.

اضافة اقرأ المزيد بدون جافا سكربت

طريقة التركيب :

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

<b:if cond='data:blog.pageType != "item"'>
          <b:if cond='data:post.snippet'>
          <b:if cond='data:post.thumbnailUrl'>
              <div class='bb-blog7lolblogger'>
                <img expr:src='data:post.thumbnailUrl'/>
              </div>
          </b:if>
            <data:post.snippet/>
    <b:if cond='data:post.jumpLink != data:post.hasJumpLink'>
      <div class='jump-link'>
        <a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
      </div>
    </b:if>
          <b:else/>
            <data:post.body/>
          </b:if>
      <b:else/>
      <data:post.body/>
      </b:if>

• ستلاحظ ان شكل التدوينات اصبح هكذا تقريباَ :

• الان سنضيف بعض الـ css لتعديل الشكل الخارجي :
• ابحث عن </b:skin> واضف هذا الكود قبله مباشرة 

.bb-blog7lolblogger img {
  float: right;
  margin: 0 0 10px 10px;
}

• ليصبح شكلها النهائي هكذا : 

يمكنك تخصيص الاضافة بشكل اكبر في حال توفرك على القليل من لغة CSS .

تخصيص اكثر :

يظهر رابط اقرأ المزيد اذا توفرت التدوينة على العلامة الشرطيه <!-- more --> وتستطيع اضافتها داخل التدوينة من خلال تحديد منتصف التدوينة وادراج رابط الانتقال التلقائي.

• لتغير حجم الصورة اضف كود الجافاسكربت هذا فوق </head>

<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
  // change the dimension variable below to be the pixel size you want
  var dimension = 240;
  // this identifies the PopularPosts1 div element, finds each image in it, and resizes it
  $('.bb-blog7lolblogger').find('img').each(function(n, image){
    var image = $(image);
    image.attr({src : image.attr('src').replace(/s\B\d{2,4}/,'s' + 240)});
    image.attr('width',dimension);
    image.attr('height',180);
  });
});
//]]></script>

الاحمر : عرض الصورة .
الازرق : الطول.

ايضا تستطيع اضافة التاريخ , واسم الكاتب والوقت من خلال هذه الاكواد : 

• كود اظهار عنوان التدوينة فقط : 

<span><data:post.title/></span>

• كود اظهار رابط عنوان التدوينه مع العنوان : 

<a expr:href='data:post.link ? data:post.link : data:post.url' expr:title='data:post.title'><data:post.title/></a>

• كود اظهار التاريخ : 

<span><data:post.dateHeader/></span>

• كود الوقت والتاريخ بصيغة iso : 

<span><data:post.timestampISO8601/></span>

• كود اظهار اسم الكاتب : 

<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
                <span itemprop='name'><data:post.author/></span>

في حال اردت المزيد من المساعدة فصندوق التعليقات هو ملك لك.

عبدالله الحربي - من السعوديه مهتم في مجال التدوين بشكل عام وفي بلوجر بشكل خاص , اهوى تصميم القوالب وتكويدها , انشر المحتوى المفيد لي ولزوار مدونتي واعضائها , انتهى.
لا تنسى متابعتي :

عند نقلك للموضوع او نسخه , حاول ان تذكر المصدر لينتفع الزائر في حال اراد المزيد من المساعده , وايضاَ احتراما وتقديراَ للجهود المبذولة في المواضيع.

معلومات عن التدوينة

صورة التدوينة

عنوان التدوينة :اضافة اقرأ المزيد لمدونة بلوجر بدون جافا سكربت

ملخص التدوينة:

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

goust

الساعه : 2015-09-28T00:21:00+03:00

تاريخ : 28‏/09‏/2015

من : المملكة العربيه السعوديه

التعليقات : 0

انشرها :

تاق :