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 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).

criar enquetes com imagens
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

<img src="endereço da imagem" /><hr/>
<input name="opcao" type="radio" value="5060693">PhotoScape

<img src="endereço da imagem" /><hr/>
<input name="opcao" type="radio" value="5060694">GIMP

<img src="endereço da imagem" /><hr/>
<input name="opcao" type="radio" value="5060695">PhotoFiltre

<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.

Olá,

Olá, membro. "ⓢⓣⓐⓨ" seu mini-tutorial foi ótimo. Area certa, tópico verdadeiro e etc.

Bom obrigado por nos ajudar postando.

@adminsitração