Iconos de alérgenos en WordPress Woocommerce
Tabla de Contenidos
Como desarrollador web, me he encontrado muchas veces con un problema recurrente cuando trabajo con clientes del sector de la restauración y alimentación: la necesidad de mostrar información clara sobre alérgenos en sus sitios web de WordPress.
La normativa europea obliga a los establecimientos a informar sobre la presencia de los 14 alérgenos principales en sus productos, y aunque existen soluciones comerciales, muchas veces resultan excesivamente caras o complejas para las pequeñas y medianas empresas del sector.
El problema que intenté resolver
- Mostrar de forma visual y clara los alérgenos presentes en cada producto
- Diferenciar entre ingredientes y trazas
- Compatibilidad con WooCommerce para tiendas online
- Funcionar también en posts y páginas normales de WordPress
- Ser fácil de usar para personas sin conocimientos técnicos
- Permitir personalización de iconos para mantener la imagen de marca
Alergenos icons plugin wordpress
Decidí desarrollar Alergenos Icons, un plugin de WordPress completamente gratuito y open source que permite gestionar alérgenos de forma profesional y sencilla pero con un enfoque diferente.
Características principales
El plugin incluye funcionalidades que he ido puliendo basándome en feedback real de usuarios:
- 14 alérgenos incluidos: Todos los alérgenos principales según normativa (gluten, huevos, pescado, soja, lácteos, cacahuetes, frutos de cáscara, apio, mostaza, sésamo, crustáceos, sulfitos, altramuces y moluscos)
- Doble categorización: Puedes marcar alérgenos como ingredientes o como trazas, algo fundamental para cumplir correctamente con la normativa
- Compatible con múltiples tipos de contenido: Funciona con productos WooCommerce, posts y páginas normales
- Iconos personalizables: Incluye iconos por defecto, pero puedes reemplazarlos con tus propias imágenes (PNG, SVG, WebP)
- Textos adicionales: Campos de texto para añadir información extra sobre ingredientes y trazas
- Panel de configuración: Opciones para ocultar títulos y personalizar la visualización
- Compatible con editores populares: Funciona perfectamente con Gutenberg, Elementor, Divi, WPBakery, Beaver Builder y más
Simplicidad de uso
Una de mis prioridades fue que cualquier persona pudiera usarlo sin necesidad de conocimientos técnicos:
- Instalas el plugin desde tu WordPress
- Editas tu producto, post o página
- En la columna lateral aparecen dos metaboxes: uno para ingredientes y otro para trazas
- Marcas las casillas de los alérgenos correspondientes
- Guardas y insertas el shortcode [mostrar_alergenos] donde quieras que aparezcan
Casos de uso reales
- Restaurantes: Muestran alérgenos en sus cartas digitales usando posts de WordPress
- Panaderías: Tiendas online con WooCommerce que venden sus productos con información completa de alérgenos
- Servicios de catering: Páginas de menús con información detallada para eventos
- Blogs de cocina: Bloggers que comparten recetas con información de alérgenos
Descarga y Documentación
El plugin está disponible gratuitamente y puedes encontrar toda la documentación en el repositorio. Incluye:
- Instrucciones detalladas de instalación
- Guía de uso paso a paso
- Documentación de personalización CSS
- Lista completa de los 14 alérgenos incluidos
- Ejemplos de implementación
Y si eres desarrollador, el código está abierto para que puedas revisarlo, mejorarlo o adaptarlo a tus necesidades específicas.
Porque cumplir con la normativa de alérgenos en WordPress debería ser simple, accesible y profesional.
¿Tienes dudas, sugerencias o quieres contribuir al proyecto? Estaré encantado de escucharte.