[TUTORIAL] Mudar rubrica do tema Landscape

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

[TUTORIAL] Mudar rubrica do tema Landscape

Mensagem por Oto! em 14/07/12, 07:09 pm



Mudar imagens da rubrica do tema Landscape
Com o uso do CSS, os blogs podem ser personalizados. A rubrica ou header do blog é chamado de cabeçalho e será onde vamos encontrar as imagens padrões dos temas fornecidos pelo Criarumblog. Neste tutorial vamos modificar essas imagens conhecendo a estrutura do CSS.

--> Tutoriais dicas, e astúcias <--
Mudar imagens da rubrica do tema Landscape


- Como localizar a função do CSS do blog:
Como os fóruns do Forumeiros, o serviço Criarumblog disponibiliza aos administradores a oportunidade de melhorar a aparencia do fórum através do CSS. Nos blogs o CSS é igual para todos os temas, o que mudas são as imagens. Aceda à: Painel de controle ->> Multiblog ->> Tema personalizado ->> Edição expert ->>.

(carregue na imagem para aumentar)

Agora vamos adicionar o código CSS para modificar as imagens do tema.

- Explorando o código CSS da coluna 1:
Não será nada difícil, pois vamos apenas modificar o campo "ENDEREÇO_DA_SUA_IMAGEM" que contém no código para o endereço da imagem que desejamos.

#header_title h2 {
margin: 0;
text-transform: lowercase;
text-align: center;
font-weight: normal;
padding: 120px 0 0 0;
background: url(ENDEREÇO_DA_SUA_IMAGEM) no-repeat 50% 30px;
letter-spacing: -1px;
font-size: 36px;
}
O header_title h2 é a localização da imagem das folhas vermemlhas:

Para modificar o fundo vermelho do header_title h2, vamos usar outra classe em CSS.
#header_title {
float: left;
width: 220px;
height: 220px;
background: #AD1011 url(ENDEREÇO_DA_SUA_IMAGEM);
}
Logo, vamos apenas alterar o endereço da imagem. Lembre-se de que a imagem é mostrada no blog com bordas arredondadas, mas não é por causa do CSS e sim pela própria imagem.

- Explorando o código CSS da coluna 2:
A coluna dois será representada pelas supostas montanhas do México, com o CSS próprio vamos alterar a mesma.
#header_explanation{
margin-left:233px;
margin-right:45px;
width:470px;
height:30px;
background:#fff url(ENDEREÇO_DA_SUA_IMAGEM) no-repeat right top;
padding-top:170px;
}

- Tabela de informação do código:
Veja abaixo as propriedades do CSS que foi passado acima, assim, com as informações adicionais você poderá alterar conforme o seu gosto as imagens do seu blog.
Tradução do código para facilitar aplicação
margin-left:Posição da imagem "a esquerda".
margin-right:Posição da imagem "a direita".
width:Largura da imagem exibida.
heightAltura da imagem exibida.

--> FAQ do Tutorial <--
Mudar rubrica do tema Landscape


  • Por que as imagens que adiciono não estão arredondadas?
    O arredondamento só vai ocorrer se o próprio autor da imagem editá-la com a mesma borda das imagens padrões. Infelizmente o efeito no CSS não faz com que a borda da imagem que você adicionou seja modificada.

  • Não consegui o resultado que esperava, onde questionar?
    Poderá obter suporte mútuo na seção exclusiva para suporte ao Criaumblog: Suporte Criarumblog.




© Suporte Criarumblog

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Mudar imagens da rubrica do tema Landscape
avatar

Oto!
Hiperativo

Inscrito dia : 07/04/2011
Mensagens : 3363
Pontos Ativos : 4818

Ver perfil do usuário http://ajuda.forumeiros.com

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum