وضع صورة جانب عنوان الموضوع لمدونات بلوجر

عدد مشاهدات الموضوع:

مرحبا بكم متابعي مدونة أبو إياد, اليوم سنتعلم طريقة سهلة جدا بإضافة صورة بجانب عنوان موضوعات مدونات بلوجر كصورة قلم أو أيقونة بلوجر أو صورة شعار المدونة مثلا. الصورة بالأعلى توضح شكل عنوان الموضوع قبل وبعد إضافة الكود الخاص بهذه الإضافة. والفيديو التالى يشرح كيفية التنفيذ من الألف الى الياء تابعوه.



بعد الانتهاء من الفيديو هذه الخطوات مكتوبه:
الخطوة الأولى: اذهب الى القالب ثم تحرير HTML وابحث عن الكود التالى
<b:includable id='post' var='post'>
الخطوة الثانية: قم بتظليل الكود السابق والأسطر بأسفله حتى تصل الى أعلى ذلك الكود
 <div class='post-header'>
الخطوة الثالثة: قم باستبدال ما قمت بتظليله بالكود التالى
<b:includable id='post' var='post'>
  <div class='post hentry' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
    <b:if cond='data:post.firstImageUrl'>
      <meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>
    </b:if>
    <meta expr:content='data:blog.blogId' itemprop='blogId'/>
    <meta expr:content='data:post.id' itemprop='postId'/>
    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
      <table><tr>
        <td class='posttitle'>
           <img src='IMAGE-URL'/></td>
        <td><h3 class='post-title entry-title' itemprop='name'>
      <b:if cond='data:post.link'>
        <a expr:href='data:post.link'><data:post.title/></a>
      <b:else/>
        <b:if cond='data:post.url'>
          <b:if cond='data:blog.url != data:post.url'>
            <a expr:href='data:post.url'><data:post.title/></a>
          <b:else/>
            <data:post.title/>
          </b:if>
        <b:else/>
          <data:post.title/>
        </b:if>
      </b:if>
      </h3>
        </td>
        </tr></table>
   
      <style>
        h3.post-title {
          margin: 0px !important;
        }
      </style>
 
    </b:if>  
  ولاحظ كلمة IMAGE-URL استبدلها برابط صورة مباشر بامتداد gif او png أو jpg ويمكنك الاستعانة فى الحصول على رابط مباشر لصورتك الخاصة من موقع tinypic.com. بعدها قم بحفظ القالب وعاين بنفسك. شكرا خاص لمدونة helplogger

هناك 4 تعليقات:

مدونة أبو إياد تصميم بلوجرام جميع الحقوق محفوظة 2016

اعلان مخفى فى الرئيسية