Vídeo-Tutorial para implementar Universal Analytics en Liferay 6.0

Este vídeo tutorial está orientado a usuarios de Liferay 6.0 que, aunque es una versión bastante antigua de Liferay, existen numeros portales que la usan.

Dado que tenía que documentar para un proyecto de un cliente cómo hacer esta implementación he aprovechado para compartir el proceso con todos vosotros. 

Si necesitas información adicional sobre versiones superiores de Liferay puedes leer el artículo Universal Analytics en Liferay Portal: nuevo código de seguimiento, dónde hablo de las diferencias entre versiones. 

Implementar Analytics en Liferay 6.0

Liferay es una aplicación web por lo que modificar directamente los ficheros sobre el servidor no es el procedimiento adecuado. Básicamente lo que tendremos que hacer es un Hook de Liferay, un pequeño plugin que nos sobreescriba los dos ficheros que tenemos que modificar. 

Estos dos ficheros son bottom.jsp y top_head.jsp que los podemos encontrar en /ROOT/html/common/themes

Los pasos a seguir serán:

  1. En Liferay IDE usar el asistente para crear un Hook nuevo con el SDK de Liferay 6.0.6 y un runtime de esta misma versión, un portal en el que podamos desplegar nuestro plugin para probar
  2. Creamos la estructura de carpetas bajo WEB-INF añadiendo de forma anidada estos 3 directorios html > common > themes
  3. Metemos dentro de la carpeta themes nuestras copias de bottom.jsp y top_head.jsp
  4. Editamos bottom.jsp para eliminar las líneas del script de Analytics y guardamos, el código es el siguiente:
    <%-- Google Analytics --%>
    <%
    UnicodeProperties groupTypeSettings = layout.getGroup().getTypeSettingsProperties();
    String googleAnalyticsId = groupTypeSettings.getProperty
  5. ("googleAnalyticsId");
    if (Validator.isNotNull(googleAnalyticsId)) {
    %>
    <script type="text/javascript">
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', '<%= googleAnalyticsId %>']);
    _gaq.push(['_trackPageview']);
    (function() {
    var ga = document.createElement('script');
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    ga.setAttribute('async', 'true');
    document.documentElement.firstChild.appendChild(ga);
    })();
    </script>
    <%
    }
    %>
  6. Editamos el fichero top_head.jsp para añadir nuestro nuevo código de Universal Analytics y guardamos, el código es el siguiente:
    <%-- Google Analytics --%>
    <%
    UnicodeProperties groupTypeSettings = layout.getGroup().getTypeSettingsProperties();
    String googleAnalyticsId = groupTypeSettings.getProperty("googleAnalyticsId");
    if (Validator.isNotNull(googleAnalyticsId)) {
    %>
    <script>
     (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
     (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
     m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
     })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
     ga('create', '<%= googleAnalyticsId %>', 'auto');
     ga('send', 'pageview');
    </script>
    <%
    }
    %>
  7. Compilamos el Hook y lo desplegamos en el directorio /deploy del portal.

SEORCH Snippet Optimizer vs otros optimizadores

En esta ocasión os cuento en este vídeo review de pocos minutos las ventajas de usar el optimizador de snippets SEORCH frente a otros más conocidos como el de SEOmofo o el de MOZ entre otros.

MOZ Title tag preview tool (2014 edition)

Hasta hace un año más o menos me gustaba revisar la optimización de snippets con la herramienta de MOZ ya que permitía simular una búsqueda introduciendo un criterio y ver así si el número de caracteres introducidos en el Título HTML se mostraba completo o no. Esta herramienta quedó desfasada en el momento que Google eliminó el texto en negrita del Título HTML de las SERPs.

https://moz.com/blog/new-title-tag-guidelines-preview-tool

SEOMofo Google SERP Snippet Optimization Tool

Otro optimizador que tenemos, uno de los más conocidos y utilizados, es el de SEOMofo pero de este no me gusta la recomendación que hace de disponibilidad de caracteres ya que muestra un límite de 70 caracteres para el meta-title y muy probablemente este número de caracteres hará que se corte el texto y aparezcan los puntos suspensivos y salvo que la redacción del title tenga el objetivo de generar interés con esos puntos suspensivos no nos interesaría que se cortase.

Como funcionalidades complementarias la herramienta de SEOMofo nos permite:

  • Activar un simulador de resultados de búsqueda (SERPs simulator) añadiendo resultados orgánicos y/o resultados de pago en sus dos variantes
  • Simular resultados en formato Rich Snippet con o sin estrellas de Review
  • Añadir una fecha al resultado de búsqueda
  • Añadir palabras en negrita al Título HTML (obsoleto)

http://www.seomofo.com/snippet-optimizer.html

Portent SERP Preview Tool

Otra que podíamos encontrar entre el repertorio de herramientas de optimización de snippets es la de portent.com dónde ya encontramos una optimización de Título HTML ortientada a un ancho máximo en píxeles de 512px, el dato que realmente deberíamos tener en cuenta para optimizar la visibilidad completa o no de este texto.

Como funcionalidades complementarias en esta tenemos:

  • Añadir una fecha al snippet
  • Añadir formato de Rich Snippet

https://www.portent.com/serp-preview-tool

SEORCH Snippet Optimization Tool

Por último me voy a centrar en SEORCH, la que os recomiendo, ya que es la que veo más completa.

  • En el Título HTML y en la meta descripción tenemos el número de píxeles y caracteres disponibles a medida que vamos escribiendo, la única que tiene esa doble orientación.
  • Una de las funcionalidades más interesantes es que podemos extraer el contenido del Título HTML y la meta-descripción al poner una URL y procesarla haciendo clic en “Fetch data from URL” y empezar a optimizar a partir de ahí.
  • La otra funcionalidad que considero también muy interesante es poder visualizar formatos de snippets en resultados de búsqueda de escritorio, móvil con una resolución de iPhone 6 a 375px y tablet tomando de muestra la de iPad a 768px ambas en formato vertical (portrait).

SEORCH Optimization Tool

Además tenemos también en esta ocasión otras funcionalidades complementarias que afectan a la visualización de los textos del snippet, estas son:

  • Simular la fecha en el snippet
  • Mostrar el texto “Mobile-Friendly” en los resultados para dispositivos móviles

Para terminar cabe destacar que nos mostrará cómo debería ser el marcado HTML para Open Graph y Twitter Cards partiendo de los datos introducidos en los primeros 4 campos. Esto nos podría valer de referencia para comprobar que el plugin o la programación que estemos usando para esto los está generando correctamente pero poco más.

http://seorch.eu/html/snippet-optimization-tool.html

¿Utilizas alguna de estas herramientas o tu preferida no es ninguna de ellas? Entonces deja tu comentario! :)

Unboxing del hardware SEOBOX y el RankBox de seobox.club

Hoy os traigo un artículo cortito pero con vídeo incluido tras haber probado como betatester el sistema SEOBOX y en el que además no hablo de mi plataforma de portal preferida, increíble pero cierto!! :)

¿Qué es SEOBOX?

Pues ni más ni menos que un hardware para SEOs en el que se apoyan multitud de herramientas SEO online para convertirte en todo un experto seo! :P

Aquí os dejo el vídeo y a continuación la transcripción adaptada.

La forma de conectar SEOBOX es super sencilla pero es importante que sigáis del mismo modo los pasos que os cuento en este vídeo. Vamos allá!

El contenido como se puede apreciar no es más que el SEOBOX que no deja de ser una Raspberry Pi con su memoria, dónde se encuentra el sistema de SEOBOX, 4 puertos USB, tarjeta de red etc.. y un cargador como los del móvil con un conector miniUSB estándar.

Para conectarla primero debemos localizar el conector de red y una vez que hayamos conectado el cable RJ45 al router lo conectamos comprobando que esté bien enganchado, cogemos el cable de alimentación localizando la pequeña toma de corriente junto al HDMI y esperar a que la tarjeta de red reciba datos y se iluminen los leds empezando así a trabajar.

Dentro también tenemos otro led para comprobar el encendido pero en principio con tener encendidos los de la tarjeta de red ya tenemos confirmación de que está bien conectado y funcionando.

Organizamos un poco los cables y a correr!

Bien, pues una vez que lo tengamos ya todo conectado y esté funcionando en la red, nuestro SEOBOX ya estará activado formando parte así del club y ya podemos entrar en members.seobox.club con los datos de acceso que hayamos recibido para empezar a trabajar con nuestros proyectos.

Para agregar un proyecto hay que ir a Herramientas > Crear un proyecto nuevo, añadir el dominio y los criterios que queremos monitorizar y darle a guardar. Hecho esto Rankbox empezará a escanear las posiciones de todas las palabras clave introducidas y finalmente nos mostrará los resultados. Situando el puntero sobre la posición podremos conocer la ciudad desde la que se ha obtenido el dato gracias a otro SEOBOX y haciendo clic en las barras de estadísticas veremos su evolución de posiciones.

Por ahora solamente tenemos disponible en el sistema Rankbox, que no es poco, la cual consiste en una herramienta clásica de monitorización y seguimiento de posiciones de palabras clave, en la que podemos consultar el ranking de criterios viendo la URL que se muestra para ese criterio o bien analizar las URLs viendo todos los criterios para los que responde dicha URL.

Lo interesante es lo que vendrá próximamente, tendremos:

GEOBOX

Con el que podemos visualizar rankings geolocalizados en cualquier ciudad de España y solo para esa ciudad que tengamos configurada.

CacheBOX

Con el que podemos monitorizar la frecuencia con la que Google pasa por nuestras páginas.

y la joya de la corona...

UX-BOX

Con el que podemos hacer experimentos con la nueva tendencia de subir CTR mediante experiencia de usuario. Aquí es dónde encontraremos muchas cosas para experimentar.

La versión móvil es muy interesante y se visualiza estupendamente!

El acceso a SEOBOX por ahora funciona solo bajo invitación y tiene 4 niveles de servicio con costes que van desde 5 €/mes hasta 35 €/mes.

Por haber sido beta-tester tengo disponibles varias invitaciones así que si quieres la tuya solo tienes que entrar en la sección de contacto y enviarme una petición.

Espero que os resulte útil el vídeo y el post y que os animéis a probarlo y a formar parte del club!!

Liferay Symposium 2015: Hacia el inbound marketing y más allá

Otro año más he cumplido con mi cita obligada al Symposium de Liferay, este ha sido algo especial pues en 2015 se han cumplido 10 años desde que empecé a usar Liferay Portal...casi nada!

Como viene siendo costumbre en los últimos años el congreso se centra principalmente en todas las novedades a nivel de desarrollo y funcional que nos traerá Liferay 7 y como dijo @majulvez , lo que viene... es Sci-Fi!!! ;)

Mi pretensión inicial era hacer un resumen, como en el artículo sobre el Liferay Sysmposium de 2014, en el que relatar de forma más o menos cronológica lo sucedido en el evento pero este año le voy a dar otro enfoque más apropiado para la audiencia habitual de este humilde blog :)

La mayoría de vosotros, mis lectores, estáis relacionados más con la edición de contenido, el marketing digital y como mucho el desarrollo frontend y la administración del portal, por esto he decidido “prescindir” de los contenidos más técnicos a los que asistí a lo largo del simposio para centrarme en lo que creo que esperáis leer y en lo que cualquier responsable de marketing de contenidos debería conocer para asistir el año que viene sin pensarlo.

Dicho esto divido este resumen de novedades en 3 partes:

Edición de contenido

La primera ponencia en la que tuvimos ocasión de ver las mejoras en experiencia de uso del editor de contenido estuvo a cargo de @sgonzalezortiz, quien hizo un recorrido por los nuevos Puntos de Extensión de Liferay 7 y nos deslumbró con lo fácil que es extender las funcionalidades y personalizar el nuevo editor para adaptarse a las necesidades según el tipo de usuario responsable de la redacción o el dispositivo habitual de redacción. Como ejemplo vimos lo fácil que era añadir un botón de cámara a la interfaz de usuario para capturar fotos de nuestros dispositivos móviles a medida que estamos redactando el contenido.

Custom Alloy Editor

El nuevo selector de imágenes es mucho más usable y versátil ya que no solo nos permitirá añadir imágenes desde nuestro portal o URLs externas como era habitual sino que podemos consumir éstas desde Flickr u otros proveedores de imágenes. Ahora tendremos previews en carrusel, un mejor buscador, información relevante del archivo, mayor fluidez, etc.

@jbalsas también nos puso los dientes larguísimos, aún falta bastante hasta LR7, con su ponencia sobre Alloy Editor, un auténtico avance en la edición de contenido web y en blogs directamente sobre la página en la que estamos mostrando ese contenido al público, dónde podemos hacer drag&drop de imágenes desde el escritorio al contenido o embeber mapas y vídeos con tan solo copiar y pegar las URLs de Maps o Youtube entre otros muchos otros servicios, lo dicho...Sci-Fi! :)

@jorgeferrer es todo un maestro del “hype” y como era de esperar en su ponencia sobre las novedades de Liferay 7 nos habló de jugosas funcionalidades en la edición de contenido, esto es lo que llegará:

  • Geolocalización de contenidos y documentos
  • Autocompletado de nombres de usuario con link al perfil en la redacción de blogs y en comentarios que además notifica al usuario que ha sido mencionado, algo parecido a lo que ya hace Facebook en sus publicaciones cuando empiezas a escribir el nombre de alguien.
  • Nueva herramienta de creación de formularios, ahora podremos hacer formularios de varios pasos.

Marketing de contenidos

El año pasado tuvimos la presentación de Audience Targeting, un plugin potentísimo con el que hacer segmentación de contenidos en función de las demandas e intereses de tus usuarios y este año se nos ha caído la baba, al menos a mi, con las novedades que traerá Audience Targeting 2, al cual podremos acceder antes de que salga Liferay 7 ya que estará disponible a principios de año para Liferay 6.2

Si sueles trabajar con conceptos como Inbound Marketing, Buyer Persona, Customer Journey, tienes que echarle un ojo a este plugin si o si. Ya te enseñé en un vídeo-tutorial cómo probar Liferay Portal, una vez instalado en local puedes añadir el plugin y hacer tus pruebas.

Segmentación de Contenidos - Audience Targeting Liferay

Tal y como nos contó @juanferrub con Audience Targeting 2 podremos cerrar el ciclo completo de Inbound Marketing ya que ahora además de poder crear reglas para Segmentar Contenidos específicos para usuarios y ayudar en la Conversión tendremos una herramienta de Automatización de Marketing y una de Medición.

Entre otras funcionalidades tendremos:

  • Integración con Salesforce
  • Orientación hacia el Marketing Multicanal, todo lo que podemos hacer con Audience Targeting en el portal se puede hacer con las Apps nativas conectadas al portal
  • Se ha añadido el concepto ”Promoción”, la cual puede lanzarse a distintos segmentos usando múltiples canales:
    • Mail, tendremos editor de newsletters!!
    • Envío de SMS (con Twilio)
    • Notificaciones Push
    • Apps móviles. Con el nuevo Consumer Manager podremos seleccionar para cualquier aplicación móvil que hayamos desarrollado y “conectado” al portal aquellas a las que queramos dirigir nuestras campañas.

Por último gracias al Report Builder tendremos la capacidad de definir KPIs con los que hacer medición de la efectividad de las campañas:

  • Análisis del rendimiento de la audiencia
  • Ratios de conversión
  • Rendimiento de cada canal
  • Análisis de Funnels de conversión
  • ...

Brutal!! Para l@s ansio@s tendremos una Beta con la que trastear! :)

Desarrollo Frontend y nuevos Temas de Apariencia (Themes)

Entre las ponencias y Workshops de @jbalsas y @marcoscava pudimos hacernos una idea completísima de todo lo que traen los nuevos Temas para Liferay y su nueva forma de desarrollo.

Han puesto el foco en el Frontend Developer de modo que sea más fácil integrar nuevas librerías y frameworks de desarrollo más en línea a lo que se mueve en este perfil profesional a día de hoy como React, Babel o instaladores de paquetes como Bower o NPM.

Yeoman, Gradle y Bower

Cambios importantes en Liferay 7:

  • Generador de temas a partir de Yeoman. Nos hará las veces de asistente a la hora de seleccionar los parámetros de nuestros temas de apariencia facilitando así el trabajo
  • Ant o Maven no son muy amigables para el desarrollador frontend de modo que nos pasamos a Gradle y Gulp para nuestros builds.
  • Podemos instalar dependencias jquery boostrap usando Bower.
  • Nuevos estilos de bordes para portlets. Hasta la fecha teníamos con o sin borde y un único estilo cuando se presentaba con borde. Ahora podemos ampliar los estilos de estos bordes como si fuesen propiedades del theme en el liferay-look-and-feel.xml y los tendremos disponibles en el combo desplegable de las propiedades de apariencia.
  • Nuevo elemento “Themelet”, pequeñas piezas de un theme muy visuales y modulares, con una tarea podemos añadir o eliminar estos Themelets.
  • Un Tema _styled será como un theme de Boostrap básico.
  • Con gulp watch podremos hacer cambios en vivo en la programación del theme “en caliente” de modo que se repliquen en el server y los podamos visualizar con solo refrescar el navegador.

 

Cómo veis, mucha novedad para contarla con detalle en un post, así que ir reservando en vuestro calendario unos días en Octubre de 2016 y nos vemos allí para ver todo esto en funcionamiento! ;)

 

No podía faltar al cierre del primer día nuestra ya tradicional quedada del Liferay Spain User Group (#LSUG), este año con organización y registro oficial :)

@gonpinju nos enseño los avances que ha hecho personalmente sobre el primer proyecto de plugin que arrancó la comunidad, el Quota Control Portlet. Entre cañas y refrescos nos enseñó el estado actual del proyecto y nos organizmos para hacer de testers próximamente para poder subirlo al Marketplace. 

 

Otro buen motivo para no perderse este evento!

Optimización onpage para SEO local y plantilla para Liferay Portal

Optimización onpage SEO local y plantilla para Liferay Portal

Desde hace unos pocos meses las posibilidades de aparecer en los resultados locales de Google se han visto notablemente reducidas, hemos pasado de tener unos seis resultados a disponer tan solo de tres. Si antes era importante tener una buena optimización onpage, bien trabajada la ficha de My Business y cierto linkbuilding enfocado a SEO Local, ahora es vital si tu tráfico web depende en gran medida de este tipo de búsquedas.

Déjame que te cuente qué factores hay que tener en cuenta y sobretodo qué puedes hacer a nivel on-page para tener la página optimizada de cara a este tipo de posicionamiento en buscadores.

En este post vamos a ver:

Factores de posicionamiento en búsquedas locales

El mes pasado tuvimos la suerte, una vez más, de tener acceso a unos datos de lo más jugoso, la encuesta realizada por MOZ a más de 40 personas relacionada con todos los factores positivos y negativos que consideran que en mayor y menor grado pueden afectar de algún modo a los resultados de las búsquedas locales.

Como resultado de la encuesta encontramos que más del 50% de los factores considerados como más relevantes se centran solo en 3 puntos:

  • Altas/reseñas y opiniones externas
  • Calidad del perfil de enlaces
  • Factores de optimización on-page

Encuesta Moz factores de ranking en SEO local

Llevaba tiempo queriendo hacer este artículo sobre optimización onpage orientada al SEO local, especialmente por el regalo que encontrarás al final, y ahora que tenemos estos datos tan recientes creo que es el mejor momento :)

Pasos previos a la optimización onpage

Lo primero de todo es que completes tu ficha de Google My Business ya que los datos que allí queden reflejados deberán coincidir al 100% con lo que pongas en tu sitio web en el momento de la optimización.

Puedes encontrar muchos posts al respecto pero voy a tratar de sintetizar en unas líneas lo básico ya que aquí nos centraremos en los factores internos de tu sitio web, no en optimizar la ficha de My Business.

  • Regístrate en MyBusiness. Para verificar tu negocio tendrás que validarlo con un PIN que recibirás por correo
  • Completa tu ficha con todos los datos:
    • Copia correctamente la dirección y el teléfono, fíjate bien en el formato, y asegúrate de que estos datos estarán igual en tu web
    • La web que pongas en el tu perfil debe coincidir con el formato que se usa al navegar, es decir, si usas www.dominio.com pon esto en tu perfil, si usas sin www. ponto como corresponde dominio.com
    • Incluye los horarios de apertura
    • Clasifica tu negocio en la categoría que más se aproxime
    • Incluye una buena descripción que contenga las palabras clave principales relacionadas con tu actividad, productos y/o servicios.

Ejemplo ficha My Business

Optimización onpage para SEO Local

Lo más importante es que la URL que enlaces desde tu perfil de My Business contenga lo que se conoce como NAP del inglés Name, Address & Phone, es decir que debemos tener sin falta y con el mismo formato que pusimos en My Business el nombre de la empresa, la dirección completa de localización y el número de teléfono.

A estos datos además podemos añadirle otros como la ubicación en el mapa, los horarios de apertura y las formas de pago que son aceptadas en el negocio. Para terminar de enriquecer todo este contenido podemos hacer un estupendo marcado de datos de los que le gustan a Google. Todo esto podemos incorporarlo en nuestra página de contacto para que haga las veces de landing para SEO local.

 Google recomienda este marcado de datos para ayudar a entender cada una de las propiedades que puede tener una entidad de “negocio local” añadiendo sintaxis de Schema.org para:

  • Nombre de empresa
  • Descripción
  • Dirección
  • Teléfonos
  • Ubicación (coordenadas)
  • Horarios de apertura
  • Formas de pago admitidas

También podríamos usar el marcado de datos con hcard, de hecho es el formato recomendado, pero dado que se usa class de CSS esto podría colisionar con algunas en uso y hacerlo en Schema me parece más flexible.

Plantilla de Liferay para tu Landing de SEO Local

Para facilitarte más el trabajo con esta tarea en Liferay Portal he hecho una estructura y una plantilla en Velocity a modo de ejemplo. Está hecha sin maquetación ni estilos de CSS para que libremente puedas adaptarlo a tu portal, es más, sustituyendo las variables en la plantilla por el texto que quieras que se muestre valdría perfectamente para cualquier web, con o sin Liferay, ya que es casi todo HTML.

El ejemplo usa marcado para LocalBusiness pero puedes personalizarlo para restaurantes, tiendas o farmacias. 

Plantilla Liferay Portal para landing de SEO local

Si eres suscriptor del blog recibirás en breve los dos ficheros, la estructura y la plantilla de velocity, si no eres suscriptor y quieres conseguir este regalito tan solo tienes que suscribirte haciendo clic aquí ;) ....

Suscripción miguelpau.es

 

Espero que os resulte de utilidad!

— 5 Resultados por página
Mostrando el intervalo 1 - 5 de 25 resultados.

Proyectos en los que colaboro

XML Portlet Factory: CRUD portlet development

 

Licencia de Creative Commons
This obra by Miguel Ángel Pau is licensed under a Creative Commons Reconocimiento-NoComercial-CompartirIgual 3.0 Unported License.