Crear Twitter Cards en prestashop sin módulos
El post de esta noche lo voy a dejar aquí por que ayer un “cliente” me ha informado de que en Twitter su prestashop no mostraba las imágenes asociadas a las Twitter Cards. Existen módulos para poner estas cards de manera automática, pero como le pasó al hombre este, twitter no validaba la tarjeta de su tienda, por eso opté por buscar información al respecto. Resulta que eliminando el módulo de turno y colocando algunas etiquetas oportunas Twitter te concede la validación. Esto solo lo he probado en la versión 1.6.1.1 de Prestashop, no lo he probado en otras versiones, pero el proceso será parecido y solo habrá que buscar las variables oportunas.
Cuando compartes una pagina WEB en Twitter, si esta pagina contiene ciertas etiquetas se genera una Twitter Card como ves en la foto de arriba.
Tal como viene Prestashop 1.6 las Twitter Cards no se generan solas, es decir que cuando le das a compartir en cualquier pagina de un producto, solo aparece el texto y el enlace pero nada más, lo cual queda tremendamente soso.
Etiquetas para generar las Twitter Cards en Prestashop
Colocando las siguientes etiquetas en el header.tpl de nuestra tienda conseguiremos que Twitter nos valide la Twitter Card sin problema:
1 2 3 4 5 6 | <meta name="twitter:card" content="summary_large_image"> <meta name="twitter:title" content="{$meta_title|escape:'html':'UTF-8'}"> <meta name="twitter:description" content="{$product->description_short}"> <meta name="twitter:image" content="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'large_default')|escape:'html':'UTF-8'}"> <meta name="twitter:site" content="@usuarioTwitter"> <meta name="twitter:creator" content="@usuarioTwitter"> |
Solo tienes que cambiar @usuarioTwitter por tu nombre de usuario de Twitter.
Y estas líneas las añades al header.tpl de tu theme activo de Prestashop. Como he usado la plantilla por defecto el fichero header.tpl que hay que editar está en /directorioTienda/themes/default-bootstrap del directorio donde tengas instalada la tienda Prestashop.
¿Dónde se añaden?, puedes ponerlas justo debajo de la ultima linea que veas que empieza también con <meta name=…, lo imprescindible es colocarlas antes del </header>
La pagina principal no tendrá Twitter Card porque las variables estarán vacías y las paginas de categorías tampoco, pero lo que me interesaba es que las paginas de los productos tuvieran una bonita Twitter Card y con estos sencillos pasos nos la genera de forma automática.
No me hago responsable de las tonterías que cada cual pueda cometer en su tienda, bastante tengo con lo mío…
Deja un comentario