Creando Themes para Wordpress

Otras formas de comenzar: los starter themes y los constructores de temas

Además de porgramando desde 0 tu propio theme, hay otra forma de ponerse en marcha en la creación de themes propios, que es emplear un starter theme. Un starter theme es un theme "en blanco", pero con todo lo necesario. Para este propósito podemos utilizar alguno sencillo que encontremos en el repositorio (durante mucho tiempo muchos hemos utilizado los themes por defecto), podemos utilizar uno que ya hayamos creado nosotros, o podemos utilizar uno como underscores http://underscores.me

La gran ventaja de comenzar con un starter theme, es sobre todo de tiempo, al tener de partida todo lo básico ya creado, la estructura de archivos, los loops, algo de css... También, para aquellos que no estén muy duchos en php, les resultará mas fácil modificar el aspecto de un theme "soso" que crear, definir o descubrir por si mismos las funciones necesarias para que la web funcione.

Y por último, tenemos los constructores de temas. Se trata de temas con funcionalidades especiales para la creación de temas desde el mismo interfaz de wordpress. La ventaja que tienen es que son muy fáciles de usar, y es posible conseguir un tema bastante resultón sin tener ni idea de programación. La gran desventaja es que incluyen tal cantidad de código “basura” que no son precisamente seo-amigables.

Google Analytics: Los informes (parte 3)

Los informes personalizados son informes que se crean de forma manual y nos brindan la posibilidad de medir los aspectos más relevantes de nuestra presencia en internet, poniendo de esta forma en relieve indicadores de aquello que merece ser optimizado en una página web.

Para crear un informe personalizado debe especificarse como mínimo una dimensión y una métrica.

Las dimensiones sirven para contabilizar las visitas de todo tipo, los visitantes, las páginas visitadas, los productos (si los hubiera) y los eventos que podamos tener definidos.

Algunas de las dimensiones que se pueden citar como ejemplo “Tipo de visitante” (tanto nuevas visitas como recurrentes), “Fuente” (nombre de una página web de referencia o motor de búsqueda), “Ciudad” o “Navegador” entre otras.

Por otra parte, las métricas son valores numéricos como Páginas vistas, Visitas, Porcentaje de rebote y Tiempo de Permanencia.

Sin ir más lejos, bien se podría definir un reporte que indicara los visitantes únicos y las páginas vistas, abierto por país y fuente de tráfico. En este caso los “Visitantes Únicos” y las “Páginas Vistas” serían las métricas, y el “País” y “Fuente de Tráfico” las dimensiones.

Es importante puntualizar que ciertas métricas y dimensiones no pueden ser combinadas en un mismo informe personalizado.

Para crear un informe de éste tipo, haz clic en la pestaña “Informes personalizados” y a continuación en “Visión general” en el panel de navegación de la izquierda.

Posteriormente haz clic en “+ Nuevo informe personalizado” para crear un nuevo informe.

Puedes editar, compartir o suprimir un informe en el botón “Acciones” situado en el lado derecho de cada informe creado.

Google Analytics:Los Informes (parte 2)

Informes estandar: menú adquisición

Dentro de visión general del menú Adquisición encontraremos inicialmente un reporte con el número y porcentaje de visitas, Fuente, y Página de destino.

Así mismo, en él encontraremos los siguientes informes:

Todo el tráfico: Mide las métricas principales agrupadas por la combinación Fuente/Medio.

También nos muestra qué URLs son los destinos más populares para el tráfico directo. Saber a qué páginas los visitantes acceden de forma directa permite adaptar su diseño para que satisfagan de forma rápida y efectiva las necesidades que puedan tener nuestros visitantes.

Así mismo podemos también conocer nuestro tráfico de referencia. Al acceder a este informe podremos ver qué dominios (y páginas en esos dominios) dirigen tráfico al sitio, cuánto tráfico dirigen, qué páginas de destino son las más visitadas y hasta que punto los visitantes de referencia interactúan con el sitio web.

Informes estandar: menú AdWords

Dentro del Menú AdWords podemos revisar y analizar el tráfico proveniente de nuestras campañas de Google AdWords.

Puede ocurrir que observas que una campaña dirige muchos visitantes a tu sitio web, pero muchas de esas visitas se van después de ver solo una página o de ver varias páginas sin llegar a convertir, entonces es posible que la página de destino asociada a esa campaña, o las páginas enlazadas a esa página de destino, no sean las adecuadas.

El informe relacionado con AdWords franjas horarias permite ver estadísticas según la hora del día y según el día de la semana.

Estas secciones anteriores pueden ser muy beneficiosas, ya que si vendes un servicio o producto en una región o un país, podrás orientar tus anuncios a horas específicas del día y/o a días concretos de la semana.

Si ofreces tus productos o servicios a nivel mundial, orientar tus anuncios a horas determinadas tiene menos importancia ya que siempre es medio día o son las 6 de la tarde en algún país del mundo.

También podrías añadir "Palabra clave" como dimensión secundaria para ver si una palabra clave en particular rinde más a distintas horas del día.

El informe URL de destino muestra el tráfico de AdWords en las diferentes páginas de destino de tu sitio web. Con esta información podrás determinar qué páginas son más efectivas a la hora de atraer usuarios y asistirles para que hagan las conversiones esperadas.

Si quieres comparar ubicaciones automáticas y gestionadas en la Red de Display de Google puedes hacerlo mediante el reporte de Ubicaciones de AdWords

Si las ubicaciones automáticas no ofrecen los resultados que esperabas, deberás sopesar cambiar a las ubicaciones gestionadas para así poder orientar tu publicidad a páginas web concretas, cuyo tráfico esté más relacionado con tu negocio online.

La opción Anuncios de televisión de AdWords permite ver estadísticas por campaña para el número de impresiones y reproducciones, el número de televisores que muestran el anuncio completo, el porcentaje de público que vio el anuncio de principio a fin, el costo de la campaña y el costo por cada mil impresiones.

Consultas de búsqueda: Estos datos se aplican al informe Tráfico de búsqueda de pago. La búsqueda de pago abarca el tráfico de AdWords, así como el tráfico de pago de otros motores de búsqueda.

Si realmente quieres optimizar el rendimiento de tu sitio web mediante el uso de palabras clave es vital conocer en cuáles debes centrarte.

Campañas: Muestra las métricas generadas por las campañas definidas en el etiquetado manual de Google Analytics.

El conjunto de Informes de Optimización en buscadores de Analytics ofrecen datos acerca de las consultas de las búsquedas de Google que han devuelto resultados de URL de tu sitio web.

Estos informes sólo están visibles sólo si has verificado tu sitio web en las Herramientas para webmasters de Google.

El Menú Social nos proporciona estadísiticas sobre las visitas recibidas en tu sitio web desde las redes sociales como Youtube, Facebook y Twitter.

Google Analytics: Los Informes

Informes estandar: menú comportamiento

Dentro del Módulo de Comportamiento de Analytics puedes hacer seguimiento a la interacción de tus visitas con lo que ofreces en tu sitio web.

Dentro del submenú "Contenido del sitio" puedes conocer las páginas a través de las cuales tus visitas llegan a tu sitio web y por cuales lo abandonan.

También puedes conocer la frecuencia con la que se visita cada página y la duración de estas visitas, el nivel de interacción con ciertos elementos y la frecuencia con la que efectúan clic en tus anuncios de AdSense.

De esta forma podrás sacar conclusiones, como por ejemplo, si las páginas de entrada tienen un elevado porcentaje de rebote puede deducirse que el contenido no satisface con las expectativas de tus visitantes o que la página no los incita lo suficiente como para seguir navegando por el sitio web.

El informe “Velocidad del sitio” mide el tiempo promedio de carga de una página, según una muestra de páginas vistas y descargadas en un sitio web.

Dentro del menú "Búsquedas en el sitio" podemos saber la cantidad de visitantes que utilizan el motor de búsqueda en tu sitio web, en el caso que lo tengas habilitado.

El seguimiento de “Eventos” es una función que también se encuentra disponible en Google Analytics, y que puedes utilizar para realizar seguimiento a eventos que no están generando vistas de página.

Por ejemplo, si tienes un video en una de tus páginas web y quieres saber cuántas veces se hace play al día en él. Una vez lo etiquetes podrás medir toda la actividad que este registre, información que podrás ver a través del reporte de "Eventos principales".

Para poder acceder a datos de AdSense en la cuenta de Google Analytics debes enlazar ambas cuentas. Antes de 24 horas los datos serán incluidos en los informes que se encuentran en el submenú Adsense del menú contenido.

El informe de “Analítica de página” también está disponible en la menú Contenido. Permite realizar una evaluación visual de cómo los usuarios interactúan con tu página web.

Teniendo esta información a tu alcance podrás responder preguntas del tipo:

¿Es adecuado el diseño de mi página?,

¿Están viendo los usuarios el contenido que quiero que vean?,

¿Están encontrando los usuarios lo que buscan en cada página del sitio web?

En resumidas cuentas: el Menú de Contenido puede ser un gran aliado para mejorar el diseño y optimización de tu sitio web.

Google Analytics: Creación de cuentas y perfiles

A través de una cuenta de Google (asignada a micorreodegoogle@gmail.com por ejemplo) podrás tener acceso directo a múltiples cuentas de Google Analytics, estando cada una enlazada a diferentes grupos de informes o perfiles.

Un perfil en Google Analytics es una serie de parametros que definen un grupo de informes en particular.

Es cierto que es necesario al menos un perfil para poder visualizar la información de tus visitantes, pero al crear una cuenta por primera vez se creará un primer perfil asociado a la totalidad de la información que está disponible, sin parámetros o filtros asociados.

Una página web puede tener más de un perfil asociado dependiendo de como se quiera agrupar la información.

Por ejemplo, puedes separar la información de un país en particular sobre el tráfico proveniente del resto del mundo, o separar los datos provenientes de tus campañas de marketing por correo .

Al igual que configurar múltiples perfiles para un único proyecto, en Google Analytics puedes administrar diferentes sitios web por medio de una única cuenta, así como también diferenciar múltiples sitios web y sus perfiles en cuentas diferentes.

Gracias a ello se conserva la privacidad de los datos (diferentes usuarios visualizan diferentes datos de distintas cuentas) y podrás clasificar los perfiles de cada sitio web según las áreas de responsabilidad que existan.

Por ejemplo, un equipo de personas encargada de dar respuesta al área de Atención al cliente del sitio web tendrá unos objetivos muy diferentes que el área comercial encargada de las ventas (si es que son independientes, y aunque no lo fueran sería aconsejable hacerlo en cualquier caso).

Atención a clientes deseará siempre minimizar el tiempo de permanencia de cada visitante, visitantes que encuentren pronta respuesta a sus consultas en un principio tendrán un tiempo menor de permanencia en el sitio web.

Por el contrario, si lo miramos desde el punto de vistas de las ventas será preferido tener visitantes interesados en lo que se les ofrece, con un tiempo alto de permanencia en cada rincón del sitio y donde el proceso de finalizar compra está claramente marcado y medido a través de un embudo de conversión.

Por todo lo anterior mantener un perfil independiente para cada área, que otorgue la posibilidad analizar de mejor forma la información relevante puede ser algo muy positivo en términos de simplicidad de análisis y tiempo.

Una vez hayas creado un nuevo perfil, deberás aplicar los filtros necesarios para que los informes ofrezcan la información que deseamos obtener.

Los perfiles y los filtros pueden ser creados y configurados en el "Administrador" de Google Analytics ubicado en el lado superior derecho de la pantalla.

Cómo funciona google analytics

La tarea de registrar datos empieza cuando un visitante llega a tu sitio web. Independiente desde donde provenga (otro sitio web, motor de búsqueda, campaña de emails, otros).

Cuando un usuario visita una de tus páginas web con el código de seguimiento de Google Analytics, una solicitud automática se realiza para descargar el archivo ubicado en www.google-analytics.com/ga.js

Este es el archivo maestro de Google Analytics (/ga.js) y será descargado – y almacenado en la memoria cache del navegador - sólo una vez durante la presente visita o sesión.

Si el visitante visitó previamente una página web que incluía el GATC, el archivo /ga.js ya se encontrará descargado y almacenado en la memoria cache del navegador, lo que evitará que éste sea descargado nuevamente.

En el momento de escribir estas líneas, Google Analytics ha terminado de implementar la modificación de la estructura de su código a una versión asincrona, lo que quiere decir que el sitio web descargará y correrá más rápido que antes.

El código de seguimiento de Google Analytics (GATC: Google Analytics Tracking Code) es una porción de código que debe ser instalado en cada una de las páginas del sitio web, y se ejecuta a través del método llamado trackPageView().

En este punto las cookies de origen (first-party cookies) de Google Analytics son creadas si es la primera visita, o reescritas si el visitante ya había visitado el sitio web.

Una cookie de origen es un trozo de texto que posee información sobre tus visitantes y las veces que han visitado anteriormente tu sitio web.

Las cookies de origen o first-party cookies (como las utilizadas por Google Analytics) posibilitan reforzar la seguridad de tus datos ya que sólo se comunicarán con el servidor propio de cada dominio, no entregando jamás información a otros servidores que puedan en muchas ocasiones ser desconocidos y por ende riesgosos.

Una vez se encuentra descargado el archivo maestro, la información referencial y otros datos adicionales al visitante y la visita (URL, duración, ID único, resolución de pantalla, etc.) serán recolectados y almacenados en las cookies creadas o cambiadas para poder realizar la identificación de la visita según sea el caso.

Por cada página visitada el GATC transmitirá los datos a los Servidores de Google a través del archivo _utm.gif (archivo de registro que se basa en la información proveniente de las cookies).

Transcurridas algunas horas Google procesará toda esta información recolectada y la facilitará a sus usuarios en los informes de Google Analytics.

En la actualidad Google Analytics posee una sección de datos en tiempo real que permite ver lo que está sucediendo en una página web segundo a segundo (ideal para medir por ejemplo campañas de email marketing.)

El codigo de seguimiento (GATC)

El Código de Seguimiento de Google Analytics (GATC) posee principalmente tres partes:

1. La llamada al archivo javascript de Google Analytics ubicado en los servidores de recolección de datos de Google. Este archivo de 18 Kb de tamaño contiene el código necesario para realizar la recolección de datos. Una vez este fichero ha sido descargado se almacena en la memoria cache del navegador del visitante.
2. El identificador único de la cuenta de Google Analytics mostrado de la forma UAXXXX-YY. Este ID de identificación es único para cada cuenta y debe ser utilizado tal y como nos lo proporciona Google, ya que de lo contrario tus datos podrían ser enviados a otra cuenta.
3. La llamada a la rutina javascipt _trackPageview() que recolecta la URL de la página vista en el navegador de un visitante, incluyendo parametros asociados como puede ser el tipo de browser, configuración de lenguaje, referencias y duración.

Posteriormente esta información se almacenará en las cookies, y después será enviada a los servidores Google a través del archivo _utm.gif. Si bien el código de seguimiento trabaja bien la mayoría de las veces, en ciertos casos será necesario realizar pequeños cambios para adaptar el seguimiento a situaciones como cuando se requiere hacer seguimiento a subdominios (http://subdominio.mipagina.com) o a dominios de nivel superior (.com .net .org .es etc).

Una de las mayores ventajas de usar un código asíncrono es que puedes incorporarlo al comienzo del código html de tu sitio web, puntualmente antes de la etiqueta

.

Cuando tengamos instalado el código de seguimiento en cada una de las páginas del sitio web, la información tardará aproximadamente 24 hrs. en aparecer en los reportes.

Una buena manera de verificar si el código quedó bien instalado es mirar los informes pasadas algunas horas desde su instalación.

Otra forma de comprobarlo es visitando el código fuente de cualquiera de las páginas de tu sitio web.

Haciendo click con el botón derecho del ratón, selecciona la opción "ver código fuente de página" para ver el código completo en una nueva ventana.

Acto seguido, verifica que se encuentra en el lugar que seleccionaste (idealmente antes de la etiqueta

).

Si estás peleado con el código, siempre puedes instalar Google Analytics en tu WordPress por medio del plugin All In One SEOPack...

Plugins y Themes de Wordpress

Una de las características que hacen de Wordpress uno de los mejores y mas versátiles CMS, son sus themes (plantillas) y plugins. Tanto unos como otros se instalan en pocos clics y los podemos encontrar tanto gratuitos como de pago. De la misma forma, para aquellos que conozcan php y html no será difícil desarrollar sus propios themes o plugins, la imaginación es el limite. 

En este capitulo vamos a ver la estructura básica de un theme y de un plugin, como modificar o crear themes y child-themes y unas nociones básicas acerca de crear plugins. A continuación me gustaría hablaros de algunos plugins y themes recomendables de cara a mejorar la visibilidad de la web en Google, para terminar con algunos consejos a la hora de escoger los mismos cuando visitemos el repositorio o un marketplace.

Plugins y Themes, qué son y para qué sirven

Los plugins son los responsables de extender las funcionalidades de nuestra web, los hay desde para efectuar tareas muy simples, como quitar la palabra "category" de la URL, hasta sistemas completos de comercio online (por ejemplo con woocommerce) o de red social (buddypress). Como de serie solo trae el llamado Akismet (un antispam) solo deberemos instalar y activar los plugins que vayamos a utilizar, de esta forma mantendremos la complejidad del panel de control en la justa y necesaria (así como evitaremos la sobrecarga de la web, lo cual repercutiría negativamente en la velocidad de la misma).

Por su parte, el theme será el que determine el aspecto de la web. Puede incluir funcionalidades propias, lo cual hace que a veces la frontera entre plugin y theme pueda ser un tanto difusa, pero su tarea principal es la de mostrarnos los contenidos y "decidir" si la pagina tendrá aspecto de blog o de otra cosa.

Creando tus themes

Estructura básica de un Theme

Un Theme de wordpress puede ser (técnicamente) tan simple como un par de archivos o algo realmente complejo. Pero comenzando por lo mas sencillo, hay 2 archivos imprescindibles index.php y style.css

En index.php es donde tenemos todo el marcado html (la maquetación) y el llamado loop, el pedazo de código con el cual el motor de wordpress recorre la entradas y las muestra. En style.css por su parte, ademas de las propias definiciones de estilos, tenemos la información sobre el theme: nombre, ruta, autor... sin esa información el CMS no podrá identificar el theme.

Aparte de estos 2 archivos hay otros 2 muy importantes, como son functions.php y sidebar.php. El primero es donde se colocan todas esas funcionalidades como habilitar los thumbnails, ajustar los excerps... . El archivo sidebar.php es como su nombre indica para definir el contenido por defecto y la maquetación interna de nuestro sidebar.

Como decía antes, puede haber muchísimos mas archivos en la carpeta de un theme, pero casi todos (salvo Javascript o imágenes) serán herederos de uno de los anteriormente descritos, en el caso de los archivos que muestran el contenido (a partir de ahora templates) tienen una jerarquía, de forma que si el archivo no existe se muestra el siguiente en la cadena, si no el siguiente... así hasta llegar al index.php

Podéis ver esta imagen más grande en http://codex.wordpress.org/images/9/96/wp-template-hierarchy.jpg o una versión interactiva en http://wphierarchy.com

Aunque lo mínimo es index.php y lo máximo (que no hay como tal pero para entendernos) sería crear todos y cada uno de los archivos mostrados en la imagen anterior (cuadros azules y naranjas) más una larga lista de archivos de funciones, js..., lo habitual es crear un fichero para las vistas de entradas individuales (single.php), uno para las paginas (page.php), uno para las categorías (category.php), uno para los resultados de búsqueda (search.php), uno para los no encontrado (404.php), uno para mostrar los comentarios (comments.php) y uno para la home (home.php o front-page.php).

Esa sería la estructura básica, pero seguramente a estas alturas alguno estará pensando que dónde me he dejado header.php y footer.php. Bueno, pues aunque son archivos ampliamente usados, no son imprescindibles en el sentido que si nuestro theme es francamente simple (apenas index.php, style.css y poco mas) podemos incluir la información perteneciente a esos archivos en el mismo index.php. Aun así, y puesto que lo habitual y cómodo es ponerlos aparte, a nuestra lista de archivos necesarios los añadiremos, quedando la lista como sigue:

• index.php
• single.php
• page.php
• category.php
• search.php
• 404.php
• front-page.php
• header.php
• footer.php
• comments.php
• functions.php y
• style.css

Ojo! index.php, style.css y functions.php tienen que tener esos nombres de archivo sí o sí, sin embargo, header y footer pueden realmente tener el nombre que queramos, aunque lo mejor es utilizar esos ya que Wordpress trae funciones pre-escritas para incluirlos, y si utilizamos otro nombre tendríamos que incluirlas de una forma más “artesanal” desaprovechando lo que ya hay.