29 março 2015

Como fazer um cabeçalho para seu blog

Crédito da matéria:Blog Choco Lovers


Big Tutorial: Como fazer um cabeçalho para seu blog


É muuuuito simples, você não precisa de Photoshop, apesar que nele fica bem mais bonito, 
mais você precisa só do Photoscape, se você não tiver, baixe- o aqui.
 Então, vamos começar.

Primeiramente, baixe essa imagem. Obs: Não vai dá pra ver porque ela é 
transparente, mais é só clicar nela com o botão direito do mouse:


Agora abra o Photoscape e abra a Imagem Transparente que você salvou. 
Ela vai aparecer branca, mais é assim mesmo. Agora você vai cortar um pedaço 
dessa imagem, veja um exemplo:


        Depois que você cortá- la, o resultado vai ser esse:


                        Agora você vai escrever o nome do seu blog, 
 usando a ferramenta Texto: 



Veja um exemplo:


Nesse exemplo foi usada a fonte Adine Kirnberg Scipt, com um rosinha claro.
 Um contorno marrom serve pra destacar. Fontes indicadas:




Depois que escreveu o nome do seu blog, vá em Objeto e vá em Modo caixa arredondada:


Escolha a cor que você quiser, deixe no modo pontilhado, sem contorno, 
a espessura é 3 e o redondo é 12, eu usei a mesma cor da fonte, ou seja, rosa.
 Resultado:

Personalize o cabeçalho com brushes. Vá em Objeto, Fotografia (montanha com sol),
 Foto...  e escolha o brushe que você quiser. 

Aqui como ficou:




Se tiver sobrado algum espaço em branco, corte- o. Veja um exemplo:



Seu cabeçalho está pronto. Veja o resultado:


     Colocar no Blog 



Vá no seu blog, layout, onde está escrito "Nome do seu blog(Cabeçalho), 
vá em Editar,se o seu blog já tiver imagem vá em Remover imagem, se 
não tiver pule pra próxima etapa. Marque a opção Em vez de título e
descrição e vá em Escolher arquivo. Procure sua imagem, clique nela 
e em abrir. Espere carregar, vá em Salvar. Ai a janelinha vai fechar e 
você vai em Salvar alterações.



Centralizar o cabeçalho



Vá em Modelo, Editar HTML, Prosseguir, clique em Expandir
 modelos de widgets. Agora dê um CTRL + V e procure pelo código:
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>

Antes do ínicio desse código cole <center> e no final coloque </center>.
 O código completo vai ficar assim:

<center><img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/></center>


2 comentários:

  1. Que legal adorei as dicas desejo muito sucesso pra você beijos da Ju http://www.cantinhojutavares.com

    ResponderExcluir
  2. Obrigado pelo comentário! Fico muito feliz, que você tenha gostado!

    ResponderExcluir