Introducción
Fancy Etch es una librería de componentes y un conjunto de plantillas listas para usar para el constructor de páginas Etch. Aporta bloques creativos y distintivos — heros, headers, acordeones, paneles offcanvas, tabla de contenidos — para que puedas construir un sitio que destaque sin conformarte con los diseños estándar que empujan la mayoría de los page builders.
Todo en Fancy Etch está construido igual que los componentes nativos de
Etch: HTML semántico, un pequeño conjunto de clases fe-*, y variables CSS
personalizadas en la clase raíz de cada componente para que puedas
retematizar una instancia desde el Style Manager sin abrir jamás un
selector anidado.
Tu tienda, construida en Etch
Etch construye páginas, no tiendas. Fancy Etch añade los componentes de WooCommerce que Etch no trae —ficha de producto, catálogo y filtros, buscador, carrito, mini carrito, checkout y la cuenta del cliente— como componentes reales de Etch que colocas, estilas y enlazas como cualquier otro.
WooCommerce sigue haciendo el trabajo: su carrito, sus impuestos, sus pasarelas de pago y los plugins que las amplían. Sólo cambia el marcado, así que una tienda vestida con Fancy Etch sigue funcionando al día siguiente de actualizar WooCommerce.
Y el propio Etch, un poco mejor
El plugin mejora además el builder en el que trabajas: un @keyframes escrito
dentro del CSS de una clase funciona de verdad, el panel de estructura sigue a lo
que seleccionas y puede cerrar todo lo demás, un nombre cortado se ve completo al
señalarlo, el campo Content crece con su texto y la barra del CSS se alcanza con
el ratón. Un interruptor por mejora, en cualquier página que construyas con Etch,
haya tienda o no — Mejoras a Etch.
Qué vas a encontrar en esta documentación
- Primeros pasos — lo que Fancy Etch necesita para funcionar (Requisitos previos), el framework de variables gratuito con el que viene (Fancy Framework), la alternativa premium (ACSS 4), y cómo pegar tu primera plantilla (Inicio rápido).
- Mejoras a Etch — lo que el plugin añade al propio builder, y el interruptor y el filtro que hay detrás de cada cosa.
- WooCommerce — cada componente de la tienda, agrupado como lo agrupa el panel del builder, con sus opciones, sus variables CSS y guías paso a paso (Visión general).
- Componentes avanzados — componentes individuales con sus props, variables CSS y comportamiento documentados por completo. El Acordeón es la referencia más completa por ahora; el resto se va completando a medida que se re-verifican.
- Layouts avanzados — layouts de sección/página completos, construidos combinando varios componentes.
- Theme — el sistema de tokens de diseño compartido (espaciado, escala tipográfica, color, breakpoints responsivos) del que lee cada componente.
Este sitio reemplaza el contenido anterior de docs.fancyetch.com con documentación real y verificada en vez de páginas de relleno — crece un componente a la vez, a medida que cada uno se construye y se prueba, en vez de todo de golpe.