Content Widgets
Widgets de artículo como bloques de contenido: avisos, acordeones, pestañas, pasos, cajas de producto, incrustaciones, código, tarjetas, citas, índice y últimas entradas.
Extensión
Content Widgets
Widgets de artículo como bloques de contenido: avisos, acordeones, pestañas, pasos, cajas de producto, incrustaciones, código, tarjetas, citas, índice y últimas entradas.
Descripción
Content Widgets
Demostración en vivo: emdashhq.com/blog/widget-gallery — los diecinueve widgets mostrados en un solo artículo.
Un conjunto de widgets de artículo para sitios EmDash: recuadros de aviso, acordeones, pestañas, listas de comprobación, botones, incrustaciones de YouTube e iframe, cajas de producto/reseña, citas destacadas, tablas de datos, un índice automático, navegación de series y una lista dinámica de «últimas entradas».
Cada widget es un tipo de bloque de un campo blocks, de modo que los editores pueden soltarlos en cualquier campo basado en bloques — contenido de páginas, cuerpos de entradas del blog, páginas de aterrizaje — dondequiera que su esquema lo permita.
Qué incluye
Diecinueve tipos de bloque, todos con el prefijo widget_: Prose, Notice, Accordion, Tabs, Checklist, Steps, Button, YouTube, Embed, Image, Code, Product box, Link cards, Pull quote, Facts table, Table of contents, Series nav, Latest posts y Divider.
Cómo funciona
Los plugins en sandbox no pueden incluir componentes de renderizado de Astro, así que los widgets se distribuyen como JSON de tipos de bloque + componentes Astro ya hechos dentro del directorio site/ del paquete. Los copia en su sitio una sola vez; el plugin aporta el comportamiento compartido en tiempo de ejecución (modo de privacidad de YouTube, la línea de divulgación de afiliados, la consulta de entradas) mediante dos rutas públicas que los componentes llaman dentro del mismo proceso — sin viaje de ida y vuelta por HTTP.
El plugin también añade una página de administración Widget catalog que documenta los campos de cada bloque, y una página Setup guide con los pasos exactos de instalación y el estado de los ajustes.
Instalación
Instalación
1. Instalar el plugin
Instale @bitdoze.com/emdashhq-widgets desde el registro de plugins de EmDash, o enlácelo como dependencia de archivo y regístrelo bajo sandboxed: en astro.config.mjs:
import widgetsPlugin from "emdashhq-widgets";
emdash();
El plugin solicita content:read y schema:read — apruébelos para que el widget Latest posts y la ruta posts funcionen. Los widgets estáticos se muestran sin ellos.
2. Añadir los tipos de bloque a su esquema
Copie site/block-types/*.json en el array blockTypes de su archivo seed (o envíe con POST el contenido de cada archivo a /_emdash/api/schema/block-types en un sitio en producción), y luego enumere los tipos en los allowedTypes de los campos blocks que deban aceptarlos — por ejemplo pages.content o posts.body.
3. Registrar los renderizadores
Copie site/components/*.astro, site/components/config.ts, site/components/icons.ts, site/widget-components.ts y site/WidgetBlocks.astro en su proyecto, y luego muestre WidgetBlocks para un campo solo de widgets:
o expanda widgetComponents en su mapa existente:
const blockComponents = defineBlockComponents();
4. Configurar
Los ajustes están en Plugins → Content Widgets → Settings:
- Privacy-enhanced YouTube embeds — sirve los reproductores desde
youtube-nocookie.com(activado por defecto). - Affiliate disclosure — línea en letra pequeña dentro de los widgets Product box; vacía, se oculta.
- Posts collection — colección predeterminada para el widget Latest posts y la ruta
posts.
Preguntas frecuentes
Preguntas frecuentes
¿Por qué tengo que copiar archivos en lugar de que lo haga el plugin?
Los plugins en sandbox se ejecutan en un entorno aislado y no pueden registrar componentes de renderizado de Astro. El directorio site/ incluye los mismos JSON de tipos de bloque y componentes que usa el autor del plugin, así que la instalación es una copia única en su repositorio — después, los widgets se comportan como cualquiera de sus propios tipos de bloque.
¿Funcionan los widgets sin el plugin instalado? Los estáticos sí — Prose, Notice, Accordion, Tabs, Checklist, Button, Embed, Quote, Facts, TOC y Series solo necesitan los tipos de bloque y los componentes. YouTube, Product box y Latest posts leen los ajustes o las rutas del plugin; sin el plugin recurren a los valores predeterminados (sin cookies activado, sin divulgación, lista vacía).
¿El widget de YouTube establece cookies?
No se carga ningún reproductor hasta que el visitante hace clic en la miniatura. Con el ajuste de privacidad predeterminado, el reproductor procede entonces de youtube-nocookie.com, que no establece cookies de seguimiento ni siquiera entonces.
¿Cómo construye Latest posts su lista?
El componente llama a la ruta pública posts del plugin dentro del mismo proceso (sin solicitud HTTP). La ruta enumera las entradas publicadas, de la más reciente a la más antigua, de la colección configurada y resuelve la URL pública de cada entrada a partir del urlPattern de su colección.
¿Puedo cambiar el estilo de los widgets?
Sí — cada componente usa clases wgt-* y lee sus tokens de diseño (--color-brand, --color-surface, …) con valores de reserva neutros. Sobrescriba las clases o los tokens para que coincidan con su tema.
¿Funcionan los widgets también dentro de páginas normales?
Sí. Añada los tipos widget_* a los allowedTypes de cualquier campo blocks — páginas, entradas o cualquier otra cosa.
Registro de cambios
Registro de cambios
1.0.4
- Pestañas sin JavaScript: las etiquetas se degradan a anclas dentro de la página y cada panel permanece visible. Con JS pasan a ser pestañas reales con teclas de flecha, Inicio/Fin y tabindex itinerante.
- Documentación: el enlace de la demostración de la galería lleva parámetros UTM.
1.0.3
- Product box: se corrigió el diseño sin imagen que comprimía el contenido en una columna estrecha; la columna de medios ahora solo se muestra cuando hay una imagen establecida
- Nuevo estilo de Product box: línea de divulgación en fuente monoespaciada, etiqueta de precio, marcas de verificación/cruz en ventajas e inconvenientes, botón con el estilo de los botones del sitio
- El conjunto de iconos del sitio ganó un icono
xpara la columna de inconvenientes
1.0.2
- Documentación: la descripción enlaza con la entrada de demostración de la galería de widgets en vivo
1.0.1
- Recursos de la ficha del registro: icono del plugin, banner y capturas de pantalla
- Correcciones de documentación: lista de los 19 bloques en la descripción y el registro de cambios
1.0.0
- Versión inicial: 19 tipos de bloque
widget_*(prose, notice, accordion, tabs, checklist, steps, button, YouTube, embed, image, code, product, link cards, quote, facts, table of contents, series nav, latest posts, divider) - JSON de tipos de bloque y componentes Astro autónomos en
site/ - Ruta pública
configpara los ajustes compartidos (modo de privacidad de YouTube, divulgación de afiliados, colección de entradas) - Ruta pública
postsque enumera las entradas publicadas más recientes con sus URL resueltas - Páginas de administración de Block Kit: catálogo de widgets y guía de configuración