terça-feira, dezembro 29, 2009

Inserir botões no código HTML do seu blog (completo)

Mais 3 vídeo aulas  para vocês… dessa vez ensino a colocar botões no blog…usando um estilo CSS…esses botões são semelhantes aos que tenho no blog… no qual você  passa o mouse e ele muda de cor…ensino vocês a mudarem a cor de fundo dos botões para deixarem de acordo com o seu blog.. até mesmo colocar marcadores entre outras coisas… Não é nada complicado garanto que após assistirem as vídeo aulas vocês irão  fazer  na maior facilidade…

Primeiro passo… faça o back-Up do blog… Veja como que se faz (AQUI)

Segundo passo… Faça 2 imagens para servirem de botão… (AQUI) nessa vídeo aula ensino a criar imagens  para servirem de botões para sites e blogs… lembrando que para criá-las não necessita de programa algum… pois é feita diretamente na internet, mas você pode usar um editor de imagens… Ex: FotoShop, Gimp, Paint etc…

Terceiro passo… armazenar essas imagens na internet… para que possamos pegar a URL delas… (AQUI)

Vejam essa vídeo aula também… Pois ela ensina a descobrir o nº da cor, caso você precise modifica-lá…para deixar o fundo do blog semelhante a Gadget… (AQUI)

Agora vejam as 3 vídeo aulas…

Vídeo aula 1

 

Vídeo aula 2

 

Vídeo aula 3

 

Agora veja os Códigos…

Procure em editar HTML a palavra …( BODY ) acima dela cole esse código…

.botao a{text-decoration: none;

font-family: Arial, Helvetica, sans-serif;

color: #000000;

background-color: #F2DBB9;

background-image: url(http://img10.imageshack.us/img10/5389/overuar.jpg);

width: 210px;

text-indent: 5px;

height: 30px;

display: block;

line-height: 30px;

font-size: 12pt;

}

.botao a:hover{

color: #000099;

background-color: #cbe1ec;

background-image: url(http://img254.imageshack.us/img254/6578/outa.jpg);

}

 

Depois faça uma Gadget e cole nela esse código…

<div class="botao">

<div style="text-align: center;"><a href="http://www.baixakijhou.blogspot.com/search/label/blog" target="_blank"><span style="color:#FFFFFF;" class="Apple-style-span"><b><i><span style="font-size: x-large;" class="Apple-style-span"><span style="font-family:'courier new';" class="Apple-style-span">Flash</span></span></i></b></span></a></div>

<div style="text-align: center;"><a href="http://www.baixakijhou.blogspot.com/search/label/blog" target="_blank"><span style="color:#FFFFFF;" class="Apple-style-span"><b><i><span style="font-size: x-large;" class="Apple-style-span"><span style="font-family:'courier new';" class="Apple-style-span">Flash</span></span></i></b></span></a></div>

</div>

 

Onde está de azul você irá colocar o nome do seu blog…

Onde está de rosa você irá colocar o nome do marcador…

Onde está de verde você irá colocar o nome do botão…

Lembrando que você poderão modificar a fonte do botão…

Como vocês podem ver existem dois botões…  para criar outro é só você copiar e colar um deles entre…

<div class="botao">

Aqui

</div>

Se algo estiver errado envie-nos um comentário…

Caso você gostou de Ctrl+D

Nenhum comentário:

Postar um comentário

Leia as regras
Todos os comentários são lidos e moderados previamente.
São publicados aqueles que respeitam as regras abaixo:

- Seu comentário precisa ter relação com o assunto do post;
- Em hipótese alguma faça propaganda de outros blogs ou sites;
- Não inclua links desnecessários no conteúdo do seu comentário;
- Ofensas pessoais, ameaças e xingamentos não são permitidos;
_ Sempre que enviar um comentario deixe seu E-mail, principalmente no caso de perguntas, Caso contrário não terá como haver resposta...

Nos tutoriais:
- Leia os comentários, sua dúvida pode já estar respondida;
- Caso não esteja, não garanto resposta para as perguntas...

Baixar Subir