27 de janeiro de 2011

Depois de muito pedidos e muitas perguntas, finalmente resolvi criar uma categoria com dicas para o Orkut e para o Blogger {Blogspot}. Eu vou passar pra vocês algumas dicas básicas e espero que gostem :D

Hoje, eu vou ensinar como colocar link em uma imagem no Blogger. Ou seja, como fazer para que quando alguém clique sobre uma certa imagem que está em seu blog, essa pessoa seja redirecionada para uma página da web. Por exemplo, eu criei utilizando o PhotoScape, um pequeno banner e eu quero que quando as pessoas cliquem sobre ele, elas sejam redirecionadas para o site www.pensador.info, vejam como ficou:
Vamos aprender como fazer:
O1. Primeiramente, você deve hospedar a imagem que deseja utilizar. Aqui no blog tem um tutorial ensinando como hospedar imagens, clique aqui para o ler.
O2. Copie o endereço da imagem que é conhecido como link direto ou URL, e cole-o em um bloco de notas ou no Word, tanto faz.
O3. Copie o código abaixo e cole-o no local onde você deseja que a imagem apareça:


<a href="LINK DO SITE"><img src="LINK DA IMAGEM" border=0 /></a>

O4. Agora vamos fazer as devidas alterações no código. Onde está escrito LINK DO SITE, você apaga e coloca o link do site para onde quer que a imagem redirecione e onde está escrito LINK DA IMAGEM, você também apaga e coloca no lugar o endereço da imagem que você colocou no bloco do notas {ou no Word}.
O5. Pronto agora é só salvar! Você pode utilizar este código nas postagens ou no widget HTML/JavaScript quando quiser colocar na lateral do seu blog.

Efeito 3D

O1. Abra o seu PhotoScape, clique em "Editor" e mude para a ala "Objeto".
O2. Abra a imagem na qual você deseja aplicar o texto e clique na ferramenta "Texto".
O3. Escreva o que quiser na caixinha, escolha uma cor, uma fonte, o tamanho e deixe a opacidade no máximo. Não use contorno nem sombra. Ao terminar, clique em "OK" e ajuste o texto na sua imagem.
O4. Clique novamente na ferramenta "Texto", as configurações estarão do jeito que você deixou. Coloque a "Opacidade" assim:

Marque a opção "Sombra" e ajuste:

Ao terminar os ajustes, clique em "OK".
O5. Coloque este texto que você criou por último, sobre o primeiro texto. Para saber a localização exata, dê um duplo clique sobre o primeiro texto, copie os valores do "Anchor" e digite-os no "Anchor" do segundo texto.
O6. Ao terminar, clique em "Foto+Objeto", marque a opção "Combine sua foto com objetos" e dê "OK". Pronto!

RESULTADO:

Efeito 3D Iluminado

O1. Abre o Scape, clique no "Editor" e vá para a ala "Objeto".
O2. Abre uma imagem e clique na ferramenta "Texto".
O3. Escreva o seu texto na caixinha, coloque a cor branca, escolha uma fonte e defina o tamanho. Marque a opção "Contorno", escolha uma cor, e ponha a espessura 2 e deixe marcada a opção "Contorno + Texto". Veja o print:

O4. Clique novamente na ferramenta "Texto", e o que você escreveu ainda vai estar lá. Mude o cor branca para a cor que você usou no contorno e arraste a setinha da "Opacidade" toda para o lado esquerdo. Desmarque a opção "Contorno", marque a opção "Sombra", coloque a mesma cor que você agora está usando no texto e ajuste assim:
Depois de ajustar tudo, clique em "OK".
O5. Coloque este texto que você criou por último, sobre o primeiro texto. Para saber a localização exata, dê um duplo clique sobre o primeiro texto, copie os valores do "Anchor" e digite-os no "Anchor" do segundo texto.
O6. Ao terminar, clique em "Foto+Objeto", marque a opção "Combine sua foto com objetos" e dê "OK". Pronto =P

RESULTADO: