[Tutorial] Como alinhar a imagem de cabeçalho no Blogger

Por
[Tutorial] Como alinhar a imagem de cabeçalho no Blogger



Neste tutorial, iremos tentar responder a uma das maiores dúvidas dos usuários, como alinhar a imagem de cabeçalho no Blogger. 
O cabeçalho do blog é uma das secções que carrega primeiro na página, e como tal, é importante criar um impacto positivo no visitante. No cabeçalho, é normal usar uma imagem de marca, ajudando a criar uma identidade para o seu blog.

Como alinhar a imagem de cabeçalho no Blogger.

O alinhamento pode ser feito através da linguagem de estilo CSS. Com algumas linhas de código você conseguirá alinhar a imagem à direita ou ao centro sem qualquer dificuldade.
Se você necessitar de um alinhamento mais específico, poderá usar as propriedades margin e padding para alinhar a imagem no cabeçalho.
Comece por fazer login na sua conta Blogger e aceda ao meu Modelo. Clique no botão Personalizar para aceder ao designer de Modelos do Blogger.
personalizar template blogger
Agora, clique na Opção avançadas -> CSS. Esta opção permite lhe adicionar o CSS diretamente no template sem aceder ao código fonte, ideal se para usuários com conhecimentos reduzidos de programação HTML e CSS.
alinhar a imagem de cabeçalho no Blogger
Se você usar a imagem de cabeçalho juntamente com o texto, ou seja, usar a imagem atrás do título. Digite o seguinte código:
Alinhamento à direita:
#header-inner {background-position: right !important; width: 100% !important;}
Alinhamento ao centro:
#header-inner {background-position: center !important; width: 100% !important; margin: auto;}
Se você usar a imagem do cabeçalho em vez do texto, digite o seguinte código:
Alinhamento ao centro:

#header-inner img {margin: 0 auto !important;}
#header-inner {text-align:center !important;}

Alinhamento à direita:
#header-inner img {margin: 0 auto 0 320px;}
Caso pretenda usar as propriedades margin ou padding para alinhar a imagem deverá usar o seguinte código:
#header-inner {margin-left: 50px;}
Altere o valor (50px) para um valor compatível com as suas necessidades.
Gostou? Deixe seu Comentário e Compartilhe com Seus amigos.
Últimos posts por Gilvan Alves (exibir todos)

Deixe um comentário