Web Louca

Home scripts Links de Afiliados com Javascript - Update

Links de Afiliados com Javascript - Update


No inicio do ano escrevi um artigo onde dáva a conhecer uma forma de criar links de afiliados com Javascript e PHP. Esse mesmo artigo pode ser consultado em Links de afiliados com javascript e Php do qual se aconselha a leitura para melhor entender este artigo.

O objetivo deste update ao script apresentado no artigo anteriormente referido é o de corrigir alguns problemas que surgiram com a utilização e implementação do mesmo.


Que problemas são esses?


O seguinte script é o que apresentei anteriormente.

<script type="text/javascript">

  var msg=document.getElementById("content").innerHTML;
  msg=msg.replace(/palavra/gi,"<a href='/links.php?m=link2'>palavra</a>");
  document.getElementById("content").innerHTML=msg;

</script>

 

Este script percorre um determinado texto em busca das palavras definidas e substituías por um link. No entanto, caso a palavra definida se encontre contida dentro de um link ou dentro de uma imagem o script iria gerar código parecido com os exemplos que lhe darei de seguida.

Caso seja um link:
<a alt="isto é uma palavra">palavra</a>
<a alt="isto é uma <a href='/links.php?m=link2'>palavra</a>"><a href='/links.php?m=link2'>palavra</a></a>

No caso de uma imagem:
<img src="/caminho/umapalavra.jgp"/>
<img src="/caminho/uma<a href='/links.php?m=link2'>palavra</a>.jpg"/>

Como pode denotar o código acima criará problemas se o trecho de texto a substituir conter imagens ou links que incluam a palavra a ser substituída por um link de afiliado.

A solução passa por modificar o script para que este guarde todos os links e imagens sob o formato de um marcador que seja substituído mais tarde. O script ficará algo do género: 

<script type="text/javascript">
//weblouca.com - AffLinks
//Licença Creative Commons Atribuição-Uso Não-Comercial 2.5 Portugal
//@Gonçalo Martins
//V2 - 1 Set 2009

var i=-1;

//Vai buscar todo o conteúdo da div com o id 'content'
var msg=document.getElementById("content").innerHTML;

if(msg!=""){

//Guarda e substitui as imagens e links por um marcador, utilizando Regex
var msgaux=msg.match(/<img[^>]*>|<a[^>]*>.*<\/a>/gi);
msg=msg.replace(/<img[^>]*>|<a[^>]*>.*<\/a>/gi,"mak09");

//Substitui 'palavra' por um link (duplicar linha para mais palavras)
msg=msg.replace(/palavra/gi,"<a href='/links.php?m=link2'>palavra</a>");


//Coloca novamente imagens e links no texto
msg=msg.replace(/mak09/g, remarca );

//Imprime texto substituido no ecran
document.getElementById("content").innerHTML=msg;

}

function remarca(){
i=i+1;
return msgaux[i];
}
</script>

De novo aconselha-se a leitura da versão 1 deste script aqui.

Trackback(0)
Claudivan
Abril 28, 2011

Olá Gonçalo, otimo tutorial.

A minha dúvida é? Onde e como informo a(s) palavra(s) chaves para os links?

Grato,

Claudivan


Escreva o seu Comentario
 
  pequeno | maior
 

busy
Subscreve a newsletter gratuita e começa hoje mesmo a criar websites e a ganhar dinheiro na internet!


jsimageNeste artigo vou-lhe demonstrar como rodar imagens e qualquer elemento desde div a span co...
phpthumbAtualmente praticamente todos os websites possuem a necessidade de listar os seus artigos...
benchmarksA pouco mais de um ano falei sobre uma ferramenta para otimizar imagens (Artigos/optimize...
phpimageredRedimensionar uma imagem com php pode ser um processo complicado. Quando por exemplo um wo...
linksafiliadosNo inicio do ano escrevi um artigo onde dáva a conhecer uma forma de criar links de afili...