() translation by (you can also view the original English article)
Este es el segundo tutorial perteneciente a una serie sobre Google DoubleClick for Publishers. DFP es un servicio que puede parecer increíblemente complicado para los no iniciados, por lo que el objetivo de esta serie es explicar las cosas de la forma más sencilla posible.
Si tienes uno o dos sitios web que obtienen cantidades moderadas de tráfico web y deseas conocer la mejor forma de generar ingresos, vender anuncios directamente a empresas y optimizar tus ingresos, entonces esta serie es para ti. Haré todo lo posible para guiarte paso a paso poniendo como ejemplo el proceso que realizo en mis propios sitios web, usando un lenguaje sencillo y explicando los conceptos fundamentales. Por favor, empieza leyendo la primera parte de esta serie, Introducción a Google DFP Small Business.
Como recordatorio, participo en los debates que se abren en la sección de comentarios al final del artículo. Si tienes una pregunta o sugerencia sobre este tema, por favor publica un comentario a continuación. También puedes seguirme en Twitter @reifman o enviarme un correo electrónico directamente.
¿Qué es Google DFP Small Business?
Simplemente para refrescar la memoria, Google DFP proporciona un servicio gratuito de publicidad que puede impulsar la entrega de anuncios en todos tus sitios web. Puedes utilizarlo para insertar anuncios del propio marketplace de AdSense de Google, así como de anunciantes a los que vendas directamente e incluso otras redes de terceros. Este video introductorio proporciona una sencilla visión general:
Ahora comencemos a preparar y utilizar nuestro sitio web para Google DFP.
Definir de nuestro inventario de anuncios
Como hemos revisado en la primera parte, el Inventario de anuncios es todo el espacio publicitario que tienes disponible para vender en tu sitio web. Si has registrado cada página de su sitio web con ese fin y has seleccionado y apilado todos los anuncios, esa pila representa tu inventario.
Instrumentalizar un sitio web básico
Como ejemplo para este tutorial, te guiaré a través de la configuración de publicidad que he implementado en un nuevo sitio que estoy configurando denominado ProTools.io. El sitio utiliza un tema de base de conocimiento para facilitar la búsqueda de servicios web y herramientas para desarrolladores y editores.
Vamos a definir nuestro inventario de anuncios para el sitio web de ProTools:
Inicialmente, ofreceré tres anuncios por página. Habrá dos en el sidebar o barra lateral derecha: un cuadrado pequeño de 250 x 250px, y otro banner horizontal tipo "skyscraper" de 160 x 600px. Y también habrá uno por encima de los comentarios, un pequeño banner de 468 x 60px. Para obtener más información sobre esto, consulta la Guía de Google AdSense sobre los tamaños de anuncio.
Creación de Bloques de anuncios
DFP hace referencia a todos los espacios publicitarios de tu sitio web donde los anuncios se organizan como Bloques de anuncios. O como dice Google, "un bloque de anuncios es una representación en DFP de un espacio en el cual se pueden entregar anuncios". Para empezar, necesitamos crear bloques de anuncios para cada uno de los tres puntos que hemos descrito anteriormente.
En DFP, visita la página Inventario para empezar:
Haz clic en Nuevo bloque de anuncios para definir cada uno de estos tres bloques de anuncios:
Es útil nombrar los bloques de anuncios de forma descriptiva utilizando el nombre, la sección, la ubicación y las dimensiones del anuncio del sitio web. Por ejemplo, mi anuncio cuadrado de la barra lateral superior se denomina protools_sidebar_top_square_250x250.
Puedes dejar los valores predeterminados tal y como están y guardar el bloque de anuncios. Ten en cuenta que el valor predeterminado permite a Google AdSense rellenar el espacio publicitario que no haya sido solicitado por tus propios clientes.
Cuando hayas añadido los tres, podrás ver los Bloques de anuncios que se enumeran a continuación:
Para futuras referencias, Google ofrece algunos buenos ejemplos sobre cuándo crear bloques de anuncios adicionales:
Si tienes el mismo espacio publicitario de 300 x 250 en la parte superior de todas las páginas de contenido, es posible que quieras crear un único bloque de anuncios. Sin embargo, si vendes tu inventario en base a distintas secciones de tu sitio web, es posible que necesites bloques de anuncios independientes para cada sección. Si tienes espacios publicitarios en la parte superior e inferior de las páginas de contenido, es probable que quieras crear bloques de anuncios independientes para poder segmentarlos, asignarles un precio e informar sobre estos espacios publicitarios de forma independiente.
Generar etiquetas: añadir código DFP a tu sitio web
Para obtener el JavaScript de Google de nuestros anuncios, utilizamos la función situada en la barra lateral izquierda denominada Generar etiquetas. Las etiquetas son un nombre poco intuitivo de Google para el código JavaScript del anuncio.
En la página Generar etiquetas añadiremos los tres bloques de anuncios que queremos usar. A continuación, haz clic en el botón Generar etiquetas.
Google te dará dos conjuntos de código. En primer lugar, el JavaScript para Google DFP que pertenece a tu bloque <head></head>.
Este es un ejemplo del script de mi <head>:
1 |
<script type='text/javascript'> |
2 |
var googletag = googletag || {}; |
3 |
googletag.cmd = googletag.cmd || []; |
4 |
(function() { |
5 |
var gads = document.createElement('script'); |
6 |
gads.async = true; |
7 |
gads.type = 'text/javascript'; |
8 |
var useSSL = 'https:' == document.location.protocol; |
9 |
gads.src = (useSSL ? 'https:' : 'http:') + |
10 |
'//www.googletagservices.com/tag/js/gpt.js'; |
11 |
var node = document.getElementsByTagName('script')[0]; |
12 |
node.parentNode.insertBefore(gads, node); |
13 |
})();
|
14 |
</script> |
15 |
|
16 |
<script type='text/javascript'> |
17 |
googletag.cmd.push(function() { |
18 |
googletag.defineSlot('/1056613/protools_above_comments_full_banner_468x60', [468, 60], 'div-gpt-ad-1427669183026-0').addService(googletag.pubads()); |
19 |
googletag.defineSlot('/1056613/protools_sidebar_mid-skyscraper_160x600', [160, 600], 'div-gpt-ad-1427669183026-1').addService(googletag.pubads()); |
20 |
googletag.defineSlot('/1056613/protools_sidebar_top_square_250x250', [250, 250], 'div-gpt-ad-1427669183026-2').addService(googletag.pubads()); |
21 |
googletag.pubads().enableSingleRequest(); |
22 |
googletag.enableServices(); |
23 |
});
|
24 |
</script> |
Debajo de esto, verás bloques individuales <div> para cada uno de los bloques de anuncios:
Para ser claros, el script de la parte superior <head> debe aparecer en cualquier página que contenga un anuncio. Sin embargo, el script del bloque de anuncios individual solo debe aparecer exactamente donde desees colocar el anuncio.
Este es un ejemplo de JavaScript para mostrar mi banner publicitario de 468 x 60px situado por encima de los comentarios:
1 |
<!-- protools_above_comments_full_banner_468x60 --> |
2 |
<div id='div-gpt-ad-1427669183026-0' style='width:468px; height:60px;'> |
3 |
<script type='text/javascript'> |
4 |
googletag.cmd.push(function() { googletag.display('div-gpt-ad-1427669183026-0'); }); |
5 |
</script> |
6 |
</div> |
Colocar etiquetas en WordPress
A continuación, empezaremos a colocar el código JavaScript de DFP en WordPress. Primero, pegaremos el bloque de código <head> en nuestro archivo header.php del tema de WordPress que estemos usando. Puedes acceder a esto a través de la opción Editor de temas del escritorio de WordPress Apariencia > Personalizar.
Nota: si utilizas un repositorio de código como GitHub para tus temas, asegúrate de integrar este cambio en el repositorio.
Para el banner pequeño de 468x60px situado sobre los comentarios, editamos el archivo que muestra las entradas individuales en WordPress, single.php. Este cambio también lo tienes que trasladar a tu repositorio de código en caso de que uses uno.
A continuación, añadiremos widgets de texto a la barra lateral para cada uno de los dos anuncios que vayan a figurar en ella. No es necesario añadir estos widgets al repositorio de código:
Centrar Google Ads
He descubierto que centrar Google Ads mediante un div contenedor con style="text-align:center;" no funciona, pero que la etiqueta obsoleta <center></center> sí funciona.
La página terminada con anuncios
Cuando vuelvas a ver la página, podrás ver que los anuncios aparecen de inmediato:
¿Qué viene a continuación?
En este episodio, has aprendido a definir el inventario de anuncios para tu sitio web, a crear bloques de anuncios, a generar etiquetas (o código) y a colocar este código en las áreas adecuadas de tu sitio web. Espero que hayas encontrado esto ilustrativo. Como puedes ver, estoy intentando deliberadamente mantener el alcance de cada episodio de esta serie al mínimo. Es fácil sentirse abrumado por DFP, y prefiero que sientas un cierto nivel de confianza en cada nueva área.
En el siguiente episodio, exploraremos las ubicaciones de DFP de Google de manera que podamos segmentar anuncios en base a áreas calientes de nuestro sitio web, por ejemplo, páginas relacionadas que reciban mucho tráfico de búsqueda.
Por favor, no dudes en publicar tus preguntas y comentarios a continuación. También puedes seguirme en Twitter @reifman o enviarme directamente un correo electrónico. También puedes visitar mi página de instructor de Tuts+ para ver otros tutoriales que he escrito.
Enlaces relacionados
