Colocar Imagens nas Opções das Enquetes

Recebemos uma pergunta interessante em um comentário em uma de nossas postagens. E esse tutorial é uma resposta para a pergunta como criar enquetes usando imagens. Na verdade é uma adaptação que fizemos utilizando o serviço de enquetes grátis do site enquetes.com.br, veja aqui como criar sua enquete.

Depois que criar sua enquete o site (http://enquetes.com.br) fornece um código html (Opção 3 - formulário com a enquete em formato HTML) ou javascript (Opção 2 - formulário com a enquete e recursos Java) ambos funcionam no blogger e pode ser colocado pela pagina designer > adicionar gadget > html/javascript para colocar no seu blog, mas antes de colocar o código no blog vamos trocar os textos por imagens nas opções da pesquisa (enquete).


Vamos usar como exemplo a enquete sobre qual o melhor programa gratuito para editar imagens que já publicamos neste blog, o código da opção 2 na parte das opções é assim:

<input name="opcao" type="radio" value="5060692">Paint.NET<br>
<input name="opcao" type="radio" value="5060693">PhotoScape<br>
<input name="opcao" type="radio" value="5060694">GIMP<br>
<input name="opcao" type="radio" value="5060695">PhotoFiltre<br>

Então vamos alterá-lo para que fique deste jeito:

<input name="opcao" type="radio" value="5060692">
Paint.NET<br />
<img src="endereço da imagem" /><hr/>
<input name="opcao" type="radio" value="5060693">PhotoScape<br />
<img src="endereço da imagem" /><hr/>
<input name="opcao" type="radio" value="5060694">GIMP<br />
<img src="endereço da imagem" /><hr/>
<input name="opcao" type="radio" value="5060695">PhotoFiltre<br />
<img src="endereço da imagem" /><hr/>

Neste link tem uma demonstração desta modificação em funcionamento, publicamos essa enquete com imagens em nosso outro site.

Veja que apenas adicionamos o código para colocar a imagem e a tag <hr/> para fazer uma melhor separação entre as opções da enquete. Não apague o texto com as opções, pois na hora de votar e mostrar os resultados só aparecerá o texto sem imagens.

Você precisará hospedar as imagens para colocar no local indicado no código, pois isso é uma adaptação usando o serviço do site enquetes.com.br que não tem a opção de colocar imagens nas opções das enquetes.

Depois que fizer as alterações é só usar o código da enquete normalmente no seu blog como um gadget de html/javascript ou numa postagem do blog. Vamos pesquisa para achar algum site que faça as enquetes com imagens e assim fazer isso de maneira mais fácil, mas por enquanto os que achamos não funcionaram bem, portanto assim que possível vamos fazer uma atualização nesta postagem ou criar uma nova.