Colocar duas colunas acima da área de postagem no novo Blogger

DEMO

Sempre procurando um espacinho no blog para colar aquele gadget que falta, e porque não acima da área de postagens ? Você poderá colocar tradutor e assinante de feed, ou buscador e contador de visitas, enfim, cole o que for de seu agrado.


Clique em Editar HTML

Clique em Ir para um widget e depois em Blog1

Clique na seta, conforme a imagem

Procure por:  <b:includable id='main' var='top'>...</b:includable>

Clique na setinha para expandir o código.

Agora procure por: (não se esqueça de clicar em Ctrl e F para facilitar a busca)

<b:section class='main' id='main' showaddelement='no'>

E acima dele cole o código abaixo.

<div style='clear: both;'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <div class='coluna-post-1' style='float: left; width: 48%'>
<b:section class='sidebar-up' id='magazine-left-2-up' showaddelement='yes'>
  <b:widget id='Label11' locked='false' title='Labels' type='Label'>
    <b:includable id='main'>
<b:if cond='data:title'>
<h2><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTy_x9sXbUCGQ1xJJmzbJfaQlBIiRyi4x4rL9p1o1NDdyG2_YEVhgrIM9LA6Tv7pi0k5bIiG1RPn7uHedpKw93EPa6xgRpVzgjalxxcFs3JpcU3XJRbUaZMG0HE3s8NBugocCJdtNP90g/s1600/tag_icon%252624.png'/> <data:title/></h2>
</b:if>
<div class='widget-content'>
<select onchange='location=this.options[this.selectedIndex].value;' style='background: #eee;width:100%;  padding: 10px 0;'>
<option>Labels</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
</option>
</b:loop>
</select>

<b:include name='quickedit'/>
</div>
</b:includable>
  </b:widget>
</b:section>
  </div>
  <div class='coluna-post-2' style='float: left; width: 48%'>
<b:section class='sidebar-up' id='magazine-right-2-up' showaddelement='yes'>
  <b:widget id='Label13' locked='false' title='Labels' type='Label'>
    <b:includable id='main'>
<b:if cond='data:title'>
<h2><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTy_x9sXbUCGQ1xJJmzbJfaQlBIiRyi4x4rL9p1o1NDdyG2_YEVhgrIM9LA6Tv7pi0k5bIiG1RPn7uHedpKw93EPa6xgRpVzgjalxxcFs3JpcU3XJRbUaZMG0HE3s8NBugocCJdtNP90g/s1600/tag_icon%252624.png'/> <data:title/></h2>
</b:if>
<div class='widget-content'>
<select onchange='location=this.options[this.selectedIndex].value;' style='background: #eee;width:100%;  padding: 10px 0;'>
<option>Labels</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'><data:label.name/>
</option>
</b:loop>
</select>

<b:include name='quickedit'/>
</div>
</b:includable>
  </b:widget>
</b:section>
  </div>
<div style='clear: both;'/>
</b:if>

Salve.

Agora clique em Personalizar

Clique então em Avançado e depois em Adicionar CSS

E acima dele cole o código abaixo. Vá ajustando seus widgets onde está destacado.

/*Colunas sobre posts -----------------------------------------------*/

.coluna-post-1 .widget{ margin: 120px -10px 0 -30px;padding: 8px 2px; background: #808080;}
.coluna-post-2 .widget{ margin: 120px -33px 0 -10px; padding: 8px 2px; background: #808080;}