Para quem ainda não conhece, o HotWords é um programa totalmente brasileiro de monetização para blogs e sites que funciona através de pequenos anúncios em palavras específicas no texto do seu site ou blog.
Bem, o próprio HOTWords fornece um exemplo de integração com o WordPress e, inclusive, disponibiliza em seu site um plugin criado pelo Bernardo Bauer (http://www.bernabauer.com) que funciona corretamente e consegue indexar perfeitamente todas as palavras para que o programa funciona perfeitamente em qualquer blog com WordPress. O grande “problema” que encontrei nesse plugin foi que ele cria uma DIV adicional para “alocar” o conteúdo indexável pelos robôs do HOTWords. O problema, ao meu ver, não é nem a criação da DIV em si, mas o atributo ID associado à essa DIV. Como a maioria dos desenvolvedores sabe, cada elemento dentro de um website deve ter apenas um atributo ID atribuído à cada elemento da página e essa ID deve ser ÚNICA para cada elemento, e foi nessa hora que as pulgas que residem na parte posterior do meu pavilhão auditivo começaram a pular e gritar incessantemente dizendo “essa não é a forma correta”.
Vamos à algumas explicações simples para a coisa toda: O atributo ID fornece um identificador único para um elemento. Ora, se ele é um atributo que fornece um identificador ÚNICO, significa que se utilizarmos dois elementos com o mesmo atributo ID estaremos duplicando algo que deveria ser único. A grosso modo, é como se estivéssemos fornecendo o mesmo número de CPF para dois elementos diferentes.
Pensando nisso, comecei a pentelhar o pessoal da HOTWords para que eles me fornecessem um código válido que não fizesse com que dois elementos da minha página tivessem a mesma identificação que deveria ser única. Depois de muito insistir com o paciente suporte técnico da HOTWords (ele está com a vaguinha dele no céu garantida por me aturar) ele me passou o seguinte código:
<script type=”text/javascript” src=’http://adsXXXX.hotwords.com.br/show.jsp?id=XXXX&tag=AAA&atr=BBB&vatr=CCC‘></script>
Vamos à “legenda” do código:
- XXXX = ID fornecido para o site que você cadastrou no HOTWords. Caso não saiba qual o seu ID, basta fazer login na sua conta do HOTWords e ir até a aba “Sites” do seu painel de controle, lá você verá uma lista dos sites cadastrados e aprovados pelo HOTWords;
- AAA – Será a tag HTML que conterá o texto indexável pelo HOTWords, no caso do WordPress, colocaremos a tag DIV (no código a tag vai com letras minúsculas, logo, no código vai “div” mesmo, sem as aspas);
- BBB – No nosso caso será o atributo que a tag DIV receberá. Vamos utilizar aqui o atributo CLASS (como sempre, no código vai com letras minúsculas);
- CCC – Corresponde ao valor do atributo, que para o WordPress, será “entry”, sem aspas.
O nosso código ficará parecido com isso:
<script type=”text/javascript” src=’http://adsXXXX.hotwords.com.br/show.jsp?id=XXXX&tag=div&atr=class&vatr=entry‘></script>
Isso dirá para o script fornecido pela HOTWords que ele deverá procurar pelas divs que tenham como atributo a classe “entry”. Note que ao invés de utilizarmos o atributo ID, utilizaremos o atributo CLASS com um valor pré-definido chamado “entry”. E se você não alterou a estrutura padrão do Wordpres, note que todos os seus posts ficam dentro da <div class=”entry”> e caso você tenha modificado esse valor de atributo no seu tema (ou template), basta você indicar no script qual foi o atributo que você utilizou para “encapsular” seus posts. Dessa forma você utilizará o HOTWords normalmente sem que seja necessário quebrar a semântica do seu código HTML.
Gostaria de deixar bem claro aqui que a intenção desse post não foi criticar o plugin criado cordialmente pelo Bernabauer que, aliás, foi uma ótima iniciativa e foi criado de acordo com as instruções fornecidas pela HOTWords. Não quero também, de forma alguma, criticar o pessoal da HOTWords pois o código deles não está completamente errado e, além de não estar semântico, funciona perfeitamente. O código fornecido pela HOTWords, inclusive, funciona perfeitamente nas páginas “singlepage” e “singlepost” do WordPress perfeita e semanticamente. A minha intenção ao criar esse post foi apenas de compartilhar uma solução semântica para a página principal do WordPress e para as demais páginas que apresentem mais de um post, nada mais que isso.
Caso você ainda não conheça a HOTWords ou não tenha feito a sua inscrição lá por ser uma empresa “ligeiramente” desconhecida, não perca mais tempo e vá lá agora mesmo fazer o seu cadastro, garanto que o retorno é muito bom!
Update
Caros amigos, esqueci de mencionar o fato de que o script do Hotwords deverá ser colocado no final da página, da mesma forma como era antes. Agradeço ao Fábio por me lembrar, mesmo que sem querer, que eu havia esquecido de relatar isso no post.
Bem interessante o código, você ajudou em um problema que venho tendo a algum tempo e acho que agora vai ser possivel resolver.
O Hotwords por carregar no rodapé da página acaba criando um load a mais no site, o que acaba fazendo que todo video que eu postasse no meu site (embed) rodasse normalmente no firefox mas bugava no Internetexplorer. =D
Caro Fábio, mas o código deve sim ficar no rodapé da página! 🙂 Vou até fazer um update no post porque esqueci de mencionar esse detalhe do script permanecer no rodapé da página, como sempre 🙂
Você tá usando algum plugin pra rodar os vídeos na página? Aqui eu rodo vídeos normalmente e nunca tive qualquer problema de compatibilidade com vídeos.
Então como comentei no email resolvi acabou não adiantando muito, inclusive pedi opinião de outras pessoas e aparentemente o problema é exclusivamente comigo =D
Lei de murfy só pode..Acabei mandando um email para o suporte do Hotwords e estou esperando uma resposta, se conseguir resolver o problema eu te aviso ja que acho que você deve estar curioso também pra entender esta bizarrice, hehe
Ricardo,
Cheguei a seu blog através do Google justamente pelo mesmo problema do Fabio.
Você fala nos comentários que nunca teve problema com os vídeos. No Firefox funciona normalmente. O problema é com videos dentro dos posts. Naveguei em seu blog e nos posts onde tem vídeo, simplesmente acontece um erro no Internet Explorer (6 e 7). A página não carrega e surge um alerta: “O Internet Explorer não pode abrir o site”, ao clicar em Ok, a página simplesmente não carrega (“A página não pode ser exibida”).
Não seria incompatibilidade do embed do Youtube com Hotwords?
Abraço
Caro Ricardo,
Acabei de ver seu comentário aqui e fui conferir o problema e realmente o blog começou a apresentar o problema de o vídeo do Youtube não carregar junto com o script do HotWords. Aqui não deu o problema do Internet Explorer de “A página não pode ser exibida”.
Vou ter que deixar sem o script do Hotwords até que essa situação seja resolvida pois monetizar o blog é importante, mas o conteúdo é muito mais importante do que isso!
Muito obrigado pela dica! Assim que eu conseguir resolver essa situação volto a atualizar esse post!
galera estou encontrando o mesmo problema e creio que a culpa seja do hotwords, durante o carregamento do css deles =/
Ola pessoal preciso de uma ajuda urgente
instalei o hotwords no FireFOX ele funciona perfeito ja no IE ele nao funciona o que pode ser me ajudemmmm…
Sempre que instalo o código do HotWords, os vídeos desaparecem no IE. O mesmo não acontece no Firefox ou Chrome. O HotWords me disse que é um problema no IE, mas como a maioria dos internautas ainda usa o IE, não posso prejudicar meu blog por causa do HorWords. Preferi retirar os anúncios.