añadir iconos redes sociales en Prestashop 1.7

En el post de hoy vamos a mostrarte como añadir los iconos y enlaces a tus redes sociales en Prestashop 1.7, una acción imprescindible en vuestra tienda online.

Para mostrar los iconos de redes sociales en Prestashop 1.7 tenemos instalado por defecto un módulo muy sencillo llamado Enlaces de seguimiento a través de las redes sociales y que solo tenemos que activar y configurar.

En las opciones de configuración debemos insertar los enlaces a cada red social que deseamos mostrar en la página de inicio. El módulo nos da la opción de mostrar los iconos de las 8 principales redes sociales (Facebook, Twitter, Youtube, Google +, Pinterest, Vimeo, Instagram y RSS).

añadir iconos redes sociales prestashop 1.7

Una vez que habéis insertado la url de cada una de vuestras redes sociales solo tenéis que dar le a GUARDAR y ver los cambios en vuestra home.

añadir iconos redes sociales prestashop 1.7

¿Cómo añadir nueva red social diferente?

En alguna ocasión hemos tenido cliente que necesitaban incluir una red social diferente a las que el módulo ofrece, por lo que os vamos a explicar como hacerlo.

Pondremos como ejemplo el caso de un cliente que quería mostrar el típico icono de localización que aparece en mapas de google con un enlace a Google Maps.

Para conseguirlo tenemos primero que preparar la imagen del icono que mostraremos. El módulo usa vectores de tamañoa 40x40px, como podéis ver en el siguiente enlace.

https://sps-sport.com/themes/classic/assets/css/afb2ed6d67613a724a420a39b4fe5b0d.svg

En el ejemplo que os vamos a explicar hemos sustituido el icono de Pinterest por el del puntero de localización siguiente:

https://sps-sport.com/themes/classic/assets/css/map-icon.png

Como podéis observar vamos a usar una imagen en formato png (sin color de fondo) en lugar de un vector (os recomendamos usar un vector).

Una vez que tenemos la imagen (o vector) a reemplazar debemos subirla a nuestro servidor en la ruta:

/themes/classic/assets/css/

y editar el archivo theme.css que se encuentra en la misma ruta anterior. En este archivo tenemos que sustituir

afb2ed6d67613a724a420a39b4fe5b0d.svg

por el nombre de la imagen que hemos subido (no olvidéis indicar el tipo de archivo .png, .svg, .jpg…).

A continuación guardamos y nos vamos a configurar el módulo Enlaces de seguimiento a través de las redes sociales para insertar el link al mapa que queremos mostrar a los usuarios en nuestra tienda online.

El resultado sería algo parecido a;

añadir iconos redes sociales prestashop 1.7Este pequeño truco lo podéis usar con cualquier tipo de enlace que necesitéis incluir y que el módulo no os da la opción de incluir.

Esperamos os sirva de ayuda.

Hosting

About the author: Franky Martin (ADMIN)

Leave a Reply

Your email address will not be published.

nueve − cuatro =