Adding an Image Next to Blogger Post Title

1:27:00 AM |


If you're using the old Blogger interface: Go to Dashboard - Design - Edit HTML - Expand Widget Template

If you're using the new Blogger interface: Go to Dashboard - Template - Edit HTML - Proceed - Expand Widget Template

Next, find and delete the following lines:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<b:includable id='post' var='post'>
  <div class='post hentry'>
    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
      <h3 class='post-title entry-title'>
      <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>
    </b:if>
The code to be deleted:


Paste the following lines in place of the deleted line in Step 2:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<b:includable id='post' var='post'>
  <div class='post hentry'>
    <a expr:name='data:post.id'/>
    <b:if cond='data:post.title'>
    <table><tr>
     <td class='ssybyposttitle'>
      <img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxS3Zxjug0Prv8sMLxiXV4vtNkoGiEI8nJEYqubhXVPhhrPgThHkFtAM5hEz84m4tOMCBazPK80kwr0tvBXurlkeFj5R8KfXjrM2llgQ-ykkADEv1gMPwv9Snr2XbQR9a4zOioriCsfJQ/s50/autobot.png'/></td>
     <td><h3 class='post-title entry-title'>
      <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>
New code in place (starting portion)


New code in place (ending portion)


Step 4: 

Now, replace the image address in Line 7 above with that of your image (the one that you've gotten from Step 1).