+34 650908608 contacto@creandowp.es
Seleccionar página
Optimizar web con wp-rocket y sg optimizer

Divi es un tema excepcional, pero como todo nada es perfecto, uno de los principales problemas que podemos encontrar en él es la baja cantidad de iconos sociales que podemos cargar desde el header por defecto, quedándo reducido a Twitter, Facebook, Instagram y RSS.
Sin embargo en algunos proyectos necesitaremos añadir otras redes, como por ejemplo LinkedIn, Discord, TikTok, Behance, etc. En esta entrada te vamos a mostrar rápidamente como hacerlo con unas pocas líneas de código PHP dentro del tema Divi.

Como añado estos iconos sociales en Divi

Como mencionaba anteriormente no nos dejará desde el panel de Divi, por tanto hay que buscar añadirlos de una manera un poco más técnica aprovechando que Divi cuenta en su core con los iconos de Font-awesome.

Lo primero que tenemos que hacer es entrar en los archivos de Divi dentro del core del theme buscaremos la carpeta “Includes”.

Como añadir iconos sociales al header de divi - Core del theme

Una vez dentro de la carpeta includes vamos a buscar el archivo social_icons.php.

Como añadir iconos sociales al header de divi - Core del theme

Ya estamos dentro del archivo que debemos modificar, bien lo único que haremos en copiar la última línea de código (en este caso es la de RSS) y vamos a hacer unas pequeñas modificaciones, la primera será cambiar la clase del elemento li que es la que controla la carga del icono, seguido de esto modificaremos el enlace añadiendo. laspripiedades que necesitemos y por último en la etiqueta span modificaremos ‘RSS’ por la red social que deseemos implementar, en este caso es linkedin.

Modulo contador divi no se ve

Una vez hayamos aplicado los cambios el código debería quedar así:

Modulo contador divi no se ve

Perfecto, pero ¿Cómo los añado al header de un child theme?

Es algo muy simple, solamente debemos copiar la carpeta includes del tema padre dentro del child con el archivo social-icons.php modificado.

Modulo contador divi no se ve

Este es el resultado final tras implementar estas líneas de código

Modulo contador divi no se ve

Hasta aquí perfecto, pero ¿Cómo se que clase añadir para seleccionar el icono social que quiero añadir?

Bien, la respuesta es sencilla, simplemente debemos ir a la página de fontawesome y ahí tenemos todo el listado de iconos sociales que podemos añadir. Es solamente hacer click en la marca que deseamos añadir, y nos dará la clase que debemos añadir, normalmente es el nombre de la misma red social.

Te dejamos un vídeo de Elegant Themes dónde muestran como añadir un icono social al header en Divi.