JuGifs²: Add widget Cabeçalho

add Widgets no cabeçalho

Adcione um Widget ao lado na header

Bem, para você alterar a sua header você precisa fazer pequenos ajustes na sua folha de estilo, não custa muito, mais o resultado é muito bom, você pode colocar o que você quiser no seu cabeçalho que será dividido ficando o título de um lado e o widget do outro.

Para isso procure por essa parte em sua folha

#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}

O que vamos fazer é dividir o cabeçalho, eu irei mostrar o tamanho, mais você pode ajustar ao seu gosto, para isso substitua o código acima por isso:

#header {
width: 300px;
float: left;
margin: 5px;
text-align: center;
color:$pagetitlecolor;
}
#header-right {
width: 300px;
float: right;
color: $pagetitlecolor;
margin: 5px;
padding: 5px;
}

você pode trocar o tamanho em width: 300px; (não deve ser maior que o seu outer-wrapper) Agora encontre esse código:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='TITULO DO SEU BLOG (Header)' type='Header'/>
</b:section>
</div>

Substitua esse código por esse:

<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='TITULO DO SEU BLOG (Header)' type='Header'/>
</b:section>
<b:section class='header' id='header-right' showaddelement='yes'>
</b:section>
</div>

Pronto, dê uma olhada em seu painel você verá os dois elementos como na imagem abaixo.

Com esse novo widget você pode por exemplo adicionar o seu perfil ou o que você desejar.