Página 1 de 1
Script JavaScript y PHP. Rota banners según país (GeoIP)
Publicado: 29 Ene 2015, 15:52
por Alejandro
El siguiente código permite rotar banners según la IP del visitante, puede ser útil para optimizar campañas publicitarias o simplemente mostrar contenidos diferentes según el país.
Es 100% JavaScript por lo cual se puede utilizar en blogs como los de Blogger o cualquier página HTML. Más abajo también dejo el código para el rotador en PHP.
Se basa en una API desarrollada por Frederic Cambus (
www.telize.com), es open source y se puede descargar para instalar en un servidor propio y así tener mayor control o mantenerlo en funcionamiento por si el sitio anterior es dado de baja.
Código JavaScript para rotar banners según el país:
Código: Seleccionar todo
<script type="application/javascript">
$(document).ready(function() {
$.getJSON("http://www.telize.com/geoip?callback=?",
function(json) {
// si la IP es de España
if (json.country_code === 'ES') {
// muestra banner para España
document.getElementById("banner").innerHTML='<a href="http://www.spamloco.net"><img src="imagen.jpg" /></a>';
}
// si la IP es de Brasil
else if (json.country_code === 'BR') {
document.getElementById("banner").innerHTML='<a href="http://www.spamloco.net"><img src="imagen.jpg" /></a>';
}
// para el resto del mundo
else {
document.getElementById("banner").innerHTML='<a href="http://www.spamloco.net"><img src="imagen.jpg" /></a>';
}
}
);
});
// ]]>
</script>
<div id="banner"></div>
En el ejemplo se mostraría en el mismo espacio un contenido para España (ES), otro para Brasil (BR) y un tercero para el resto de los países. Los códigos de dos letras para todos los países se encuentran
aquí
Este script simplemente hay que pegarlo en el lugar donde se desean mostrar los banners, para que funcione es necesario cargar jquery, si no se utiliza entonces hay que agregar la siguiente línea dentro del head:
Código: Seleccionar todo
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>
Es todo JavaScript por lo cual se ejecuta directamente en el navegador del usuario, en el lugar donde se quieran rotar los banners se puede colocar el script completo del rotador o sólo el DIV con id=banner, el JavaScript también se puede cargar en el head, en el footer o
de forma asíncrona para optimizar la carga del sitio.
Código PHP para rotar banners según país:
Con la misma api se puede hacer el rotador con PHP, el código quedaría así.
Código: Seleccionar todo
<?php
$var = file_get_contents('http://www.telize.com/geoip/'.$_SERVER['REMOTE_ADDR']);
$api = json_decode($var);
if($api->country_code == 'ES'){
?>
<a href="http://www.spamloco.net"><img src="imagen.jpg" /></a>
<?
}else if($api->country_code == 'BR'){
?>
<a href="http://www.spamloco.net"><img src="imagen.jpg" /></a>
<?
}else {
?>
<a href="http://www.spamloco.net"><img src="imagen.jpg" /></a>
<?
}
?>
Re: Script JavaScript y PHP. Rota banners según país (GeoIP)
Publicado: 02 Feb 2015, 14:49
por elQuique
Muy bueno, gracias por compartirlo :)
(I'm back !)
Re: Script JavaScript y PHP. Rota banners según país (GeoIP)
Publicado: 07 Feb 2015, 20:19
por jorgel
Hola alejandro, estoy hecho un lio, como hago para implementarlo en wordpress? Tengo que agregar el codigo php a functios.php? y si es asi como lo haria
Re: Script JavaScript y PHP. Rota banners según país (GeoIP)
Publicado: 07 Feb 2015, 21:44
por Alejandro
Hola jorgel, el código PHP puedes colocarlo por ejemplo en un widget de la barra lateral o al final de los post, en el lugar donde lo coloques se va a mostrar el banner según la IP.
Para ejecutar código PHP adentro de un Widget te recomiendo este plugin:
https://wordpress.org/plugins/php-code-widget/ sin el plugin, en los widget sólo podrías ejecitar HTML/JavaScript.
Re: Script JavaScript y PHP. Rota banners según país (GeoIP)
Publicado: 07 Feb 2015, 23:57
por jorgel
Hola alejandro, todo muy bien entendido muchas gracias. Tengo otra pregunta: como hago para mostrar el mismo banner para varios paises seria algo asi? ($api->country_code == 'ES', 'AR' 'CO') o como seria
Re: Script JavaScript y PHP. Rota banners según país (GeoIP)
Publicado: 08 Feb 2015, 23:45
por Alejandro
Mmmm no, no sé, no lo he probado de esa forma.
Lo más sencillo es agregar más else if, uno nuevo para nuevo país y ahí colocar el código del banner aunque sea el mismo de otros países.
Por ejemplo:
Código: Seleccionar todo
<?php
$var = file_get_contents('http://www.telize.com/geoip/'.$_SERVER['REMOTE_ADDR']);
$api = json_decode($var);
if($api->country_code == 'ES'){
?>
<a href="http://www.spamloco.net"><img src="imagen1.jpg" /></a>
<?
}else if($api->country_code == 'AR){
?>
<a href="http://www.spamloco.net"><img src="imagen1.jpg" /></a>
<?
}else if($api->country_code == 'BR'){
?>
<a href="http://www.spamloco.net"><img src="imagen2.jpg" /></a>
<?
}else {
?>
<a href="http://www.spamloco.net"><img src="imagen.jpg" /></a>
<?
}
?>
En este ejemplo para España y Argentina se muestra lo mismo; para Brasil otro y para el resto del mundo otro diferente.
Con este otro código también puedes
rotar varios banners al azar en una ubicación.
Re: Script JavaScript y PHP. Rota banners según país (GeoIP)
Publicado: 13 Abr 2015, 12:12
por juanvazquez
hola amigo gran aporte,
yo uso blogger solo que tengo ciertas dudas,
donde debo de poner mi codigo de banner? en que parte del script ya que no lo logro detectar soy algo nuevo y creo que esta duda la debemos tener varios.
ojala me puedas ayudar con el siguiente ejemplo de mis banners como debería quedar ya completo.
Código: Seleccionar todo
(mi banner para españa)
<a href="http://track.adtual.com/aff_c?offer_id=2810&aff_id=13618&file_id=99774" target="_blank"><img src="https://media.go2speed.org/brand/files/adtual1/2810/836_Amoory_ES_250x250.gif" width="250" height="250" border="0" /></a><img src="http://track.adtual.com/aff_i?offer_id=2810&aff_id=13618&file_id=99774" width="1" height="1" />
(mi banner para brasil)
<a href="http://track.adtual.com/aff_c?offer_id=2804&aff_id=13618&file_id=99902" target="_blank"><img src="https://media.go2speed.org/brand/files/adtual1/2804/836_Namorico_BR_250x250.gif" width="250" height="250" border="0" /></a><img src="http://track.adtual.com/aff_i?offer_id=2804&aff_id=13618&file_id=99902" width="1" height="1" />
(mi banner para el resto del mundo)
<a href="http://tc.tradetracker.net/?c=8236&m=607757&a=213904&r=&u=" target="_blank" rel="nofollow"><img src="http://ti.tradetracker.net/?c=8236&m=607757&a=213904&r=&t=html" width="250" height="250" border="0" alt="Mailrelay, email marketing" /></a>
otra cosa como arreglo eso del jquery o como y en donde y en que parte debo colocar la linea del head que pones ahi?
esta para ser muy claro:
Código: Seleccionar todo
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>
esto es lo único que le hace falta ami blog espero tu ayuda gran aporte y muchas gracias
Re: Script JavaScript y PHP. Rota banners según país (GeoIP)
Publicado: 13 Abr 2015, 22:48
por Alejandro
En las líneas de código document.getElementById("banner").innerHTML debes colocar el tuyo cambiando únicamente lo que aparece entre las comillas simples.
Así: document.getElementById("banner").innerHTML=' AQUI TU CODIGO ';
Todo el resto debe quedar igual y lo vas cambiando según el país, si necesitas agregar más países sólo debes agregar más elementos "else if".
El script de jquery sólo lo debes agregar en la cabecera del blog, es decir justo antes del </head>