إضافة نبذة عن الكاتب أسفل الموضوع بطريقة مميزة

بسم الله الرحمان الرحيم

، السلام عليكم ورحمة الله و بركاته ، بسبب البحث عن هذه الإضافة كثيرا قررت إضافة شرح لها ، و هذه الإضافة هي : إضافة نبذة أو تعريف أسفل موضوع الكاتب و خصوصا عند تنوع عدد كتاب المدونة حيث يعرف الزائر صاحب التدوينة و من هو ومن أين هو ...إلخ و هذا يعتمد علي ما يكتبه االكاتب عن نفسه

و هذه الصورة تشرح الطريقة التي ستظهر فيها

 

الشرح

ملاحظة : إذا كنت مبتدأ يفظل أن تحفظ نسخة من قالب المدونة لتفادي الخطأ

أذهب لوحة التحكم ثم إلى تصميم ثم تحرير HTML  ، ثم أضغط علي خانة توسيع القوالب فوق قالب الhtml

التركيب يتكون من مرحلتان

المرحلة الأولي :

أبحث عن   ]]></b:skin>      ثم ضع قبله الكود التالي :

/* Author Bio */
.postauthor {
    background: #F5F5F5; 
    border-top: 1px solid #e1e1e0; 
    border-bottom: 1px solid #e1e1e0; 
    overflow: hidden; 
    padding: 0.7em;
}
.postauthor img {
    border: 5px solid #e2dede; 
    float: right; 
    margin-left: 1em;
}
.postauthor h3 {
    color: #666; 
    font-size: 1.2em; 
    margin-bottom: 5px; 
    margin-top: 0;
}
.postauthor p {
    color: #515151; 
    font-size: 12px; 
    margin-bottom: 10px;
    margin-top: 0;
}
/* Author Bio End */

المرحلة الثانية :

  ابحث عن        <data:post.body/>

"إذا وجدت إثنان فالثاني هو ما نبحث عنه "

وبعده ضع مباشرة الكود التالي مع التعديل عليه حسب رغبتك 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='postauthor'>
 <img alt='' height='80' src='رابط الصورة الشخصية' width='80'/>
 <h3>بقلم <a href='Blog Link'> اسم الكاتب </a></h3>
 <p> فقرة تضم نبذة عن الكاتب </p>
</div>
</b:if>

و أنتهينا أصبح بإمكان زائرك معرفتك

 ***في حالة وجود كاتبين أو أكثر***  

نتبع نفس ما جاء في المرحلة الأولي 

ثم نبحث عن كود <data:post.body/>

"إذا وجدت إثنان فالثاني هو ما نبحث عنه "

ثم ضع بعده الكود الآتي 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- تعريف الكاتب الأول -->
<b:if cond='data:post.author == &quot;أحمد&quot;'>
<div class='postauthor'>
   <img alt='' height='80' src='رابط الصورة الشخصية' width='80'/>
   <h3>بقلم <a href='Blog Link'> القعقاع بن عمرو </a></h3>
   <p> فقرة تضم نبذة عن القعقاع</p>
 </div>
</b:if>
<!-- تعريف الكاتب الثاني -->
<b:if cond='data:post.author == &quot;جواد&quot;'>
<div class='postauthor'>
   <img alt='' height='80' src='رابط الصورة الشخصية' width='80'/>
   <h3>بقلم <a href='Blog Link'> خالد بن الوليد </a></h3>
   <p> فقرة تضم نبذة عن خالد </p>
 </div>
</b:if>

</b:if>

وه هكذا فدواليك تعدل علي ما جاء باللون الأحمر ، و أنا حاضر دوما للإجابة علي تساؤلاتم

By glok

Similiar tagsإضافات بلوجر