Nesse post estou atendendo ao pedido do amigo cláudio do site DownAge, primeira coisa a ser feita antes de começar o tutorial é fazer um backup, para poder voltar ao formato anterior caso você faça alguma coisa errada. Para backup do template acesse: 1) Painel, 2) Layout, 3) Editar HTML, 4) Baixar modelo completo Interpretação do pedido: Como faço para centralizar o menu de títulos do template do meu blog, tem blogs com o template igual ao meu, só que com o alinhamento do título da slidebar centralizado, olha essa imagem link ele modificou a barra de título da coluna e centralizou o nome. Tutorial centralizando a slidebar da lateral do blogger: 1) No painel de controles do blogger depois de ter feito o backup descrito acima marque a opção: Expandir modelos de widgets 1) Logo após clique dentro do quadrado onde se encontra o código do template do seu blog e precione a tecla (Ctrl) + (F) do seu teclado, para abrir a pesquiza. 2) Localize o trecho de código /* Sidebar Content , abaixo deste trecho, encontra-se o código que é responsável por toda a formatação da slidebar do blog, o qual pode ser um pouco diferente do mostrado abaixo. Assim:

/* Sidebar Content ----------------------------------------------- */ .sidebar h2 { margin: 1.6em 0 .5em; padding: 4px 5px; background-color: $sidebarTitleBgColor; font-size: 100%; color: $sidebarTitleTextColor; }

3) Nesse trecho podemos alterar tamanhos, cores e margem do slide bar, mais para alterar o alinhamento é necessário acrescentar o trecho text-align: center; antes do fechamento das chaves " }" ficando assim. trecho modificado ----

/* Sidebar Content ----------------------------------------------- */ .sidebar h2 { margin: 1.6em 0 .5em; padding: 4px 5px; background-color: $sidebarTitleBgColor; font-size: 100%; color: $sidebarTitleTextColor; text-align: center; }

Acima eu mostrei um exemplo centralizado mais você pode alterar a para text-align: left; = alinhado a esquerda text-align: right; = alinhado a direita trecho modificado ---- 4) Agora clique em salvar modelo e clique em visualizar e pronto pode curtir as modificações deseijadas. ---------- Agora para modificar a imagem que fica de fundo você vai ter que localizar o aquivo de imagem responsável e trocar o endereço da imagem, fazer isso em um tutorial é muito arriscado já que cada template usa um método diferente de exibir uma imagem de fundo no blog, mais no dicadedica a tag responsável é: background-image:url(http:\\endereço_da_imagem.gif); Já no template do meu outro blog essa tag simplesmente não existe mais pode ser acrescentada no trecho (1). É isso, espero ter atendido ao pedido do Cláudio e de outros blogueiros aventureiros como eu e o Cláudio. Abraços e mandem perguntas, a medida do possível, vou atendendo a todas!!! Obrigado!!!

Gusto? Então copie esse post para seu Blog: <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://bp0.blogger.com/_eZ4RDyPwpoA/SGuZoTO2xpI/AAAAAAAAAFs/igLh_vzTSKU/s1600-h/alinhando_novo_blogger.png"><img style="margin: 0pt 10px 10px 0pt; float: left; cursor: pointer;" src="http://bp0.blogger.com/_eZ4RDyPwpoA/SGuZoTO2xpI/AAAAAAAAAFs/igLh_vzTSKU/s200/alinhando_novo_blogger.png" alt="" id="BLOGGER_PHOTO_ID_5218433510875252370" border="0" /></a> Nesse post estou atendendo ao pedido do amigo cláudio do site DownAge, primeira coisa a ser feita antes de começar o tutorial é fazer um <span style="font-weight: bold;">backup</span>, para poder voltar ao formato anterior caso você faça alguma coisa errada. <span style="font-weight: bold;">Para backup do template acesse: </span> 1) Painel, 2) Layout, 3) Editar HTML, 4) Baixar modelo completo <span style="font-weight: bold;">Interpretação do pedido:</span> Como faço para centralizar o menu de títulos do template do meu blog, tem blogs com o template igual ao meu, só que com o alinhamento do título da slidebar centralizado, olha essa imagem <a href="http://img382.imageshack.us/img382/4580/lolexplicaosc2.jpg">link</a> ele modificou a barra de título da coluna e centralizou o nome. <span style="font-weight: bold;">Tutorial centralizando a slidebar da lateral do blogger: </span>1) No painel de controles do blogger depois de ter feito o backup descrito acima marque a opção: <span id="fullpost"> <span style="font-weight: bold;">Expandir modelos de widgets </span>1) Logo após clique dentro do quadrado onde se encontra o código do template do seu blog e precione a tecla (Ctrl) + (F) do seu teclado, para abrir a pesquiza. 2) Localize o trecho de código <span style="font-weight: bold;">/* Sidebar Content , </span><span><span id="fullpost">abaixo deste trecho, encontra-se o código que é responsável por toda a formatação da slidebar do blog, o qual pode ser um pouco diferente do mostrado abaixo. Assim:</span></span> <span id="fullpost"><blockquote><p>/* Sidebar Content ----------------------------------------------- */ .sidebar h2 { margin: 1.6em 0 .5em; padding: 4px 5px; background-color: $sidebarTitleBgColor; font-size: 100%; color: $sidebarTitleTextColor; <span style="color: rgb(204, 0, 0);"></span>}</p></blockquote>3) Nesse trecho podemos alterar tamanhos, cores e margem do slide bar, mais para alterar o alinhamento é necessário acrescentar o trecho </span><span style="color: rgb(204, 0, 0); font-weight: bold;"><span id="fullpost"><span style="color: rgb(204, 0, 0);">text-align: center; </span></span></span>antes do fechamento das chaves " }" ficando assim. <span id="fullpost"><span style="font-weight: bold;">trecho modificado ----</span></span> <p></p><blockquote>/* Sidebar Content ----------------------------------------------- */ .sidebar h2 { margin: 1.6em 0 .5em; padding: 4px 5px; background-color: $sidebarTitleBgColor; font-size: 100%; color: $sidebarTitleTextColor; <span style="color: rgb(204, 0, 0); font-weight: bold;">text-align: center; </span> }</blockquote><p></p>Acima eu mostrei um exemplo centralizado mais você pode alterar a para <span style="color: rgb(204, 0, 0); font-weight: bold;">text-align: left; </span><span style="color: rgb(204, 0, 0);"><span style="color: rgb(0, 0, 0);">= alinhado a esquerda</span></span><span style="color: rgb(204, 0, 0); font-weight: bold;"> </span><span style="color: rgb(204, 0, 0); font-weight: bold;">text-align: right; </span><span style="color: rgb(0, 0, 0);">= alinhado a direita</span> <span id="fullpost"><span style="font-weight: bold;">trecho modificado ---- </span></span>4) Agora clique em <span style="font-weight: bold;">salvar modelo</span> e clique em<span style="font-weight: bold;"> visualizar </span>e pronto pode curtir as modificações deseijadas. ---------- Agora para modificar a imagem que fica de fundo você vai ter que localizar o aquivo de imagem responsável e trocar o endereço da imagem, fazer isso em um tutorial é muito arriscado já que cada template usa um método diferente de exibir uma imagem de fundo no blog, mais no dicadedica a tag responsável é: background-image:url(<span style="color: rgb(153, 0, 0); font-weight: bold;">http:\\endereço_da_imagem.gif</span>); <span id="fullpost">Já no template do meu outro blog essa tag simplesmente não existe mais pode ser acrescentada no <span style="font-weight: bold;">trecho (1). É isso, espero ter atendido ao pedido do Cláudio e de outros blogueiros aventureiros como eu e o Cláudio. Abraços e mandem perguntas, a medida do possível, vou atendendo a todas!!! Obrigado!!! </span></span>