Colocar Imagem No Rodapé e Entre Postagem

Pessoal neste tutorial venho mostrar a vocês como colocar imagens no final do blog, tanto no rodapé como entre as postagem e o rodapé. observe como ficou entre a postagem e o rodapé.

 

É claro que esse é só um exemplo de que você não é obrigador colocar a imagem no rodapé, mais ai fica a seu gosto. Não se esqueça de hospedar a imagem em algum site de sua preferencia. Então vamos ao código.

<div class="separator" style="clear: both; text-align: center;">
<a href="#" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="189" src="ENDEREÇO DA IMAGEM QUE VAI FICAR NO FINAL/RODAPE" width="995" /></a></div>

O código acima é oque você colocará no Blog. A marcaçaão em azul é onde vai o link da imagem que você quer que apareça, já a marcação em verde é onde você ajustará a largura e a altura da imagem. OBS: a largura e a altura tem que ser a mesma da imagem que você criar.

Agora vamos definir onde colocar a imagem. Para colocar no rodapé é muito simples, procure pela tag: </body> e cole logo acima dela.

Já para colocar entre a postagem e o rodapé você devera ir testando já que nem todos layout são iguais. Aqui no meu o código  ficou assim:

    <footer>
    <div class='footer-outer'>
    <div class='footer-cap-top cap-top'>
      <div class='cap-left'/>
      <div class='cap-right'/>
    </div>

<div class="separator" style="clear: both; text-align: center;">
<a href="#" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="189" src="ENDEREÇO DA IMAGEM QUE VAI FICAR NO FINAL/RODAPE" width="995" /></a></div>

   <div class='fauxborder-left footer-fauxborder-left'>
    <div class='fauxborder-right footer-fauxborder-right'/>
    <div class='region-inner footer-inner'>
      <macro:include id='footer-sections' name='sections'>
        <macro:param default='2' name='num'/>
        <macro:param default='footer' name='idPrefix'/>
        <macro:param default='foot' name='class'/>
        <macro:param default='false' name='includeBottom'/>
      </macro:include>
      <!-- outside of the include in order to lock Attribution widget -->
      <b:section class='foot' id='footer-3' showaddelement='no'>
<b:widget id='Attribution1' locked='false' title='' type='Attribution'/>
</b:section>
    </div>
    </div>
    <div class='footer-cap-bottom cap-bottom'>
      <div class='cap-left'/>
      <div class='cap-right'/>
    </div>
    </div>
    </footer>

  <!-- content -->
  </div>
  </div>
  <div class='content-cap-bottom cap-bottom'>
    <div class='cap-left'/>
    <div class='cap-right'/>
  </div>
  </div>
  </div>

  <script type='text/javascript'>
    window.setTimeout(function() {
        document.body.className = document.body.className.replace(&#39;loading&#39;, &#39;&#39;);
      }, 10);
  </script>
</body>

Mas ai vai do seu gosto, teste ai e veja qual fica melhor e se gostou da dica não esqueça de comentar.