Mejorando el marketing digital. Compartiendo en Facebook con Open Graph desde nuestro Oscommerce.

Es muy común disponer de una tienda en Internet, con una amplia lista de productos y no disponer de un botón para compartir ese artículo en Facebook. Algunas plataformas como Oscommerce incluso están algo atrasadas y al incluir el módulo de “Like/Share” no suelen adjuntar la imagen del articulo si no una cualquiera que les aparece en la misma página.

¿Podemos aumentar la precisión de lo que comparten para mejorar el marketing online?

Algunos de vosotros me preguntáis, ¿como puedo hacer que cuando se comparta un artículo de mi tienda en Internet aparezcan los datos que yo quiero?

La solución se llama Open Graph, el protocolo Open Graph, nos permitirá mediante la programación de nuestro código HTML indicarle a facebook que queremos compartir exactamente.

Los “meta” de Open Graph hay que incluirlos en la cabecera <head></head> para ello la única forma que dispondremos para realizar dicha operación en Oscommerce es aprovechar los módulos “head_tags” para ello sera necesario modificar unos de estos módulos (preferiblemente ht_product_description.php).

Estos módulos se alojan en :

“/includes/modules/header_tags/ht_product_description”

En la línea 48, veremos que hay la consulta contra la base de datos de las descripciones de los artículos y tendremos que añadir un par de variables que vamos a necesitar para recuperar el nombre de la imagen y el nombre del producto. Asi pues la consulta quedaría algo como así:

$product_info_query_raw = " select pd.products_description, p.products_image, pd.products_name from " . TABLE_PRODUCTS . "join " . TABLE_PRODUCTS_DESCRIPTION . " pd on pd.products_id = p.products_id

p.products_image, pd.products_name son las nuevas variables que he añadido a la consulta Mysql para que podamos compartir estos valores en Facebook.

Con estas dos variables en la consulta puedo extraer la ruta de la imagen y el nombre del artículo que usaremos para compartir en Facebook.

Y posteriormente tan solo me queda añadir a la variable de $header_description los metadatos del OpenGraph

Que quedaría algo así:

$head_description = '<meta name="description" content="' . $head_description . '" />' . "\n";
//facebook share Open Graph
$head_description .= '<meta property="og:title" content="'. $microdata_name .'">' . "\n";
$head_description .= '<meta property="og:type" content="article">' . "\n";
$head_description .= '<meta property="og:site_name" content="Plastidip España">' . "\n";
$head_description .= '<meta property="og:url" content="https://www.plasti-dip.es/product_info.php?products_id='.$products_id.'">' . "\n";
$head_description .= '<meta property="og:image" content="https://www.plasti-dip.es/images/'. $microdata_image .'">'. "\n";
$head_description .= '<meta property="og:description" content="'. strip_tags($product_info['products_description']) .'">' . "\n";//end facebook open graph

donde $microdata_name es el valor del titulo del producto a compartir, $microdata_image es la ruta de la imagen a compartir.

Evidentemente tendréis que cambiar el nombre del dominio, en este caso he usado el de www.plasti-dip.es que tendréis que cambiar por la ruta del vuestro.

Así pues, recordad añadir estos comandos dentro de vuestro <head> mejorareis la información compartida por vuestros clientes en Facebook y por tanto mejorareis vuestro marketing digital.

<meta property="og:title" content "titulo del articulo">
<meta property="og:type" content "articule">
<meta property="og:site_name" content "Nombre de la página web">
<meta property="og:url" content "URL que queréis compartir">
<meta property="og:image" content "Ruta de la imagen que quereis que aparezca en facebook como compartida">
<meta property="og:description" content "Texto descriptivo de la imagen o articulo">

Alex Rubio

Anuncios

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s