Problem on Blogger template adding a image

Question

I'm trying to add a picture in a blogger template. With the HTML tag.

<img src="img_avatar.png" alt="Avatar">

But it's not loading the image.

I'm trying to put it in the direct code.

 <div class='container-fluid'>
      <div class='row'>
        <div class='col-sm-12 col-md-3 col-lg-3' id='sidebar'>


          <b:section class='header-section' id='header-section' maxwidgets='0' showaddelement='no'>
            <img src="picture goes here" alt="Avatar"/>
            <b:widget id='Header1' locked='true' title='Blogs name (Cabeçalho)' type='Header' version='1'>
              <b:widget-settings>
                <b:widget-setting name='displayUrl'/>
                <b:widget-setting name='displayHeight'>0</b:widget-setting>
                <b:widget-setting name='sectionWidth'>22</b:widget-setting>
                <b:widget-setting name='useImage'>false</b:widget-setting>
                <b:widget-setting name='shrinkToFit'>false</b:widget-setting>
                <b:widget-setting name='imagePlacement'>BEHIND</b:widget-setting>
                <b:widget-setting name='displayWidth'>0</b:widget-setting>
              </b:widget-settings>

I wanna to insert the picture in this space with a different color:

But its not loading the picture...

Thanks a lot

Answer 1

The Blogger tag <b:section... can only contain <b:widget...

To insert your image upload it directly in Header widget or use an image widget.

Also, you can insert the image code within the widget tag <b:includable id='main'>