Neste tutorial usarei o photoscape, pois é um programa bastante simples e fácil para este tutorial. Podes usar paint, photoshop ou outros...

Para que servem estes códigos? Parece um quebra-cabeças mas é bastante simples. Se tens uma imagem com por exemplo a dizer "Links, Contactos, etc" come stes códigos numa só imagem podes colocar vários links (daí eu dizer o tutorial para repetirem múltiplas vezes o interior caso queiram mais links).

1. Abres a imagem que queres:



Repara que na parte de baixo está as coordenadas do sitio onde está o cursor do rato.

2. Queres as coordenadas (coords) para o código, logo terás de colocar o cursor do rato mesmo no sitio onde queres que fique o inicio da coordenada:



No canto superior esquerdo (do corte) tens a coordenada. Agora já tens um começo para o teu código. Logo agora queres o final da coordenada que veremos isso no ponto 3.

A coord inicial é: 17,320

3. Para saber a coordenada final basta fazeres o mesmo processo:



A coord final é: 979,491

4. Chegamos à parte do código, que será:



Forneço o código via bloco de notas alojado no MediaFire pois a Blogger não aceita códigos HTML nos tópicos o que é um pouco absurdo --'

http://www.mediafire.com/?dyheu485lxe7c74

Caso queira várias coords dentro da mesma imagem/código basta multiplicar quantas vezes as que quiseres a parte de dentro do código:




Basta apagar os 000's e colocar os números que usamos acima (as coordenadas).


Espero que seja útil.. Não se esqueçam de comentar. Qualquer dúvida basta responderem no tópico!

Totalmente criado por Daniel Mendes (eu)

Uma coisa, e para que serve colocar essas coordenadas?

Cumps

Bem eu já percebi mas apesar de nem toda a gente ficar a perceber pois não está explicito no post.
isso serve para que numa imagem possas definir áreas especificas da mesma onde poder por exemplo meter um link.
Aconselho-te a meter isso mais explicito pois esta tudo muito bem explicado como se faz e tal, mas não para que serve.

Tonito1 escreveu:Bem eu já percebi mas apesar de nem toda a gente ficar a perceber pois não está explicito no post.
isso serve para que numa imagem possas definir áreas especificas da mesma onde poder por exemplo meter um link.
Aconselho-te a meter isso mais explicito pois esta tudo muito bem explicado como se faz e tal, mas não para que serve.

Obrigado, já entendi...

realmente não está muito explicito no tópico.
Mas não deixa de ser uma boa dica. Desconhecia, mas será-me útil.

Thanks.

Ola bom tutorial,

Eu nunca uso isso posso fazer online, vou partilhar aqui um site para os que não conheçem: http://www.image-maps.com/

Olá a todos,

Peço desculpa por não ter sido explícito no tema, mas pensei que toda a gente soubesse o que era e como não é costume ver muitos tutoriais a falar sobre isto decidi criar.

Eu usei isto algumas vezes para blog's de amigos e afins.

É bastante simples embora pareça um quebra-cabeças. Com este código dá para definires um link ou mais links numa só imagem. (vou editar o tópico)

Obrigado FlashVitor ^^

FlashVitor escreveu:Ola bom tutorial,

Eu nunca uso isso posso fazer online, vou partilhar aqui um site para os que não conheçem: http://www.image-maps.com/

Muito Bom!
Com esse site fica mais fácil em pouco tempo temos o código pronto para usar.

Tópico editado.

Obrigado pela dica pessoal

Por acaso já conhecia as imagens com map, mas só conhecia a versão do Dave Mustaine, obrigado por compartilhares a tua FlashVitor