Paso 1: Incluir Font Awesome en tu tema de WordPress
Primero, debes asegurarte de que Font Awesome esté incluido en tu tema. Puedes hacerlo añadiendo el siguiente código a tu archivo functions.php de tu tema o tema hijo:
function enqueue_font_awesome() {
wp_enqueue_style(‘font-awesome’, ‘https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css’);
}
add_action(‘wp_enqueue_scripts’, ‘enqueue_font_awesome’);
Paso 2: Uso correcto del icono de Facebook en el menú
Ahora puedes usar el código HTML correcto para mostrar el icono de Facebook en tu menú de WordPress. El código es casi correcto
<i class=”fa-brands fa-square-facebook”></i>
pero necesita asegurarse de que la clase de Font Awesome se esté usando correctamente. Aquí está el código HTML corregido:
<i class=”fab fa-facebook-square”></i>
Agregar el icono en el menú desde el administrador de WordPress:
- Ve a “Apariencia” > “Menús” en el panel de administración de WordPress.
- Selecciona el menú al que deseas agregar el icono.
- Añade un nuevo enlace personalizado al menú con la URL de tu página de Facebook.
- En el campo de “Etiqueta del enlace”, puedes añadir el siguiente código HTML
<i class=”fab fa-facebook-square”></i> Facebook
-
- Guarda el menú.
- Estilos adicionales (opcional): Si deseas personalizar aún más el estilo del icono en el menú, puedes añadir CSS adicional en tu tema:
.menu-item i.fab {
margin-right: 5px; /* Espacio entre el icono y el texto */
color: #3b5998; /* Color del icono de Facebook */
font-size: 1.2em; /* Tamaño del icono */
}
Este código CSS añadirá un margen derecho al icono, cambiará su color al azul de Facebook y ajustará su tamaño.
Algunos usuarios encontraron esta publicación buscando: No funciona insertar iconos de redes sociales en menú de Fontawesome.com