{"id":7881,"date":"2026-05-27T16:30:49","date_gmt":"2026-05-27T16:30:49","guid":{"rendered":"https:\/\/etchenet.com\/master-components-showcase\/"},"modified":"2026-05-27T20:29:10","modified_gmt":"2026-05-27T20:29:10","slug":"master-components-showcase","status":"publish","type":"page","link":"https:\/\/etchenet.com\/es\/master-components-showcase\/","title":{"rendered":"Master Components Showcase"},"content":{"rendered":"
\n\n
\n\n
\n\n
\n\n
\n\n

Componentes bloqueados<\/p>\n\n<\/div>\n\n\n

\n\n

Validaci\u00f3n de la interfaz de usuario<\/p>\n\n<\/div>\n\n\n

\n\n

Reutilizaci\u00f3n estricta<\/p>\n\n<\/div>\n\n<\/div>\n\n\n

Componentes maestros
Escaparate<\/span><\/h1>\n\n\n

P\u00e1gina interna para la validaci\u00f3n visual y estructural de los componentes maestros del sistema de dise\u00f1o Gutenberg Etchenet.<\/p>\n\n\n

\n
Ver los componentes<\/a><\/div>\n
Ver la llamada a la acci\u00f3n principal<\/a><\/div>\n<\/div>\n\n\n
\n
Siguiente secci\u00f3n<\/a><\/div>\n<\/div>\n\n<\/div>\n\n<\/section>\n\n\n
\n\n
\n\n
\n\n

Encabezado de secci\u00f3n<\/p>\n\n\n

Encabezado de secci\u00f3n maestro<\/span><\/h2>\n\n\n

El t\u00edtulo, el estribillo y el encabezado utilizan clases tipogr\u00e1ficas validadas.<\/p>\n\n<\/div>\n\n\n

\n\n

Contrato de componentes<\/h3>\n\n\n

Clases:<\/strong> etch-header ethet-section-header ethet-content, etch-label ethet-section-kicker, etch-h2 ethet-section-title ethet-gradient-title, etch-sub ethet-section-lead<\/p>\n\n\n

Estructura :<\/strong> n\u00facleo\/grupo + n\u00facleo\/p\u00e1rrafo + n\u00facleo\/encabezado + n\u00facleo\/p\u00e1rrafo<\/p>\n\n\n

Reutilizar:<\/strong> Modifique \u00fanicamente el texto.<\/p>\n\n\n

Restricciones:<\/strong> Nunca reutilices los tama\u00f1os\/colores de un HTML antiguo.<\/p>\n\n<\/div>\n\n\n

\n
Siguiente secci\u00f3n<\/a><\/div>\n<\/div>\n\n<\/div>\n\n<\/section>\n\n\n
\n\n
\n\n
\n\n

Chevron a continuaci\u00f3n<\/p>\n\n\n

Navegaci\u00f3n entre secciones validado<\/span><\/h2>\n\n\n

El componente es un bot\u00f3n nativo de Gutenberg representado visualmente como una flecha.<\/p>\n\n<\/div>\n\n\n

\n
Siguiente secci\u00f3n<\/a><\/div>\n<\/div>\n\n\n
\n\n

Contrato de componentes<\/h3>\n\n\n

Clases:<\/strong> Secci\u00f3n siguiente de Ethet, bloque de navegaci\u00f3n descendente de Etch; bot\u00f3n de navegaci\u00f3n descendente de Etch, flecha del bot\u00f3n de Ethet, icono del bot\u00f3n de Ethet<\/p>\n\n\n

Estructura :<\/strong> n\u00facleo\/botones + n\u00facleo\/bot\u00f3n<\/p>\n\n\n

Reutilizar:<\/strong> Cambie \u00fanicamente la URL y la etiqueta del editor.<\/p>\n\n\n

Restricciones:<\/strong> No cree un bot\u00f3n de texto visible.<\/p>\n\n<\/div>\n\n\n

\n
Siguiente secci\u00f3n<\/a><\/div>\n<\/div>\n\n<\/div>\n\n<\/section>\n\n\n
\n\n
\n\n
\n\n
\n\n

M\u00e1ster final de CTA<\/p>\n\n\n

Listos para evolucionar
\u00bfCu\u00e1l es su presencia en l\u00ednea?<\/span><\/h2>\n\n\n

El marco visual pertenece al contenedor del bot\u00f3n. El enlace interno permanece transparente y sin doble borde.<\/p>\n\n\n

\n
+(33) 6 89 98 75 73<\/a><\/div>\n
Enviar mensaje<\/a><\/div>\n<\/div>\n\n\n

De lunes a s\u00e1bado: 9:00 \u2013 17:30 \u00b7 Pa\u00eds Vasco y toda Francia<\/p>\n\n<\/div>\n\n<\/div>\n\n<\/div>\n\n\n

\n\n

Contrato de componentes<\/h3>\n\n\n

Clases:<\/strong> ethet-cta-wrap grabado-cta-wrap; ethet-cta-box grabado-cta-box; ethet-cta-buttons<\/p>\n\n\n

Estructura :<\/strong> contenedor principal\/de grupo + caja principal\/de grupo + botones principales<\/p>\n\n\n

Reutilizar:<\/strong> Modifique los textos, los enlaces y las etiquetas; no cambie la estructura.<\/p>\n\n\n

Restricciones:<\/strong> No se permiten marcos dobles en .wp-block-button__link.<\/p>\n\n<\/div>\n\n\n

\n
Siguiente secci\u00f3n<\/a><\/div>\n<\/div>\n\n<\/section>\n\n\n
\n\n
\n\n
\n\n

Cuadr\u00edcula de estad\u00edsticas<\/p>\n\n\n

Cifras clave alineado<\/span><\/h2>\n\n\n

Cuadr\u00edcula digital con mapas de altura uniformes y alineaci\u00f3n de la parte inferior de la cuadr\u00edcula.<\/p>\n\n<\/div>\n\n\n

\n\n
\n\n

20+<\/p>\n\n\n

a\u00f1os de experiencia<\/p>\n\n<\/div>\n\n\n

\n\n

100+<\/p>\n\n\n

sitios web creados<\/p>\n\n<\/div>\n\n\n

\n\n

53<\/p>\n\n\n

Rese\u00f1a de 5 estrellas en Google<\/p>\n\n<\/div>\n\n\n

\n\n

16 a\u00f1os<\/p>\n\n\n

duraci\u00f3n m\u00e1xima para el cliente<\/p>\n\n<\/div>\n\n<\/div>\n\n\n

\n\n

Contrato de componentes<\/h3>\n\n\n

Clases:<\/strong> cuadr\u00edcula de estad\u00edsticas eteth; tarjeta-ethet-stat; n\u00famero-stat-ethet; etiqueta-ethet-stat<\/p>\n\n\n

Estructura :<\/strong> cuadr\u00edcula principal\/de grupo + tarjetas principales\/de grupo + p\u00e1rrafos<\/p>\n\n\n

Reutilizar:<\/strong> Cambia \u00fanicamente los n\u00fameros y las etiquetas.<\/p>\n\n\n

Restricciones:<\/strong> align-items:end, not stretch; no clases etcha-stat.<\/p>\n\n<\/div>\n\n\n

\n
Siguiente secci\u00f3n<\/a><\/div>\n<\/div>\n\n<\/div>\n\n<\/section>\n\n\n
\n\n
\n\n
\n\n

Cuadr\u00edcula de cartas 3<\/p>\n\n\n

Tarjetas de servicio maestros<\/span><\/h2>\n\n\n

Versi\u00f3n oficial obtenida de creation-site-web-test: estructura de tres columnas, iconos de colores, insignias, listas y acciones.<\/p>\n\n<\/div>\n\n\n

\n\n
\n\n
\n\n
<\/rect><\/path><\/path><\/svg><\/div>\n\n\n

Sitio web<\/p>\n\n\n

Creaci\u00f3n y gesti\u00f3n de sitios web<\/h3>\n\n\n

Creaci\u00f3n, redise\u00f1o, optimizaci\u00f3n y soporte para brindarle un sitio web claro y eficaz, adaptado a su negocio. WordPress, dise\u00f1o responsivo, optimizado para SEO.<\/p>\n\n\n