Content Widgets
Widgets de artigo como blocos de conteúdo: avisos, acordeões, separadores, passos, caixas de produto, incorporações, código, cartões, citações, índice e últimas publicações.
Extensão
Content Widgets
Widgets de artigo como blocos de conteúdo: avisos, acordeões, separadores, passos, caixas de produto, incorporações, código, cartões, citações, índice e últimas publicações.
Descrição
Content Widgets
Demonstração ao vivo: emdashhq.com/blog/widget-gallery — os dezanove widgets mostrados num só artigo.
Um conjunto de widgets de artigo para sites EmDash: caixas de aviso, acordeões, separadores, listas de verificação, botões, incorporações de YouTube e iframe, caixas de produto/análise, citações em destaque, tabelas de factos, um índice automático, navegação de séries e uma lista dinâmica de «últimas publicações».
Cada widget é um tipo de bloco de um campo blocks, pelo que os editores os podem largar em qualquer campo baseado em blocos — conteúdo de páginas, corpos de publicações do blogue, páginas de destino — onde quer que o seu esquema o permita.
O que inclui
Dezanove tipos de bloco, todos com o prefixo 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 e Divider.
Como funciona
Os plugins em sandbox não podem incluir componentes de renderização do Astro, por isso os widgets são distribuídos como JSON de tipos de bloco + componentes Astro já prontos dentro do diretório site/ do pacote. Copia-os para o seu site uma só vez; o plugin fornece o comportamento partilhado em tempo de execução (modo de privacidade do YouTube, a linha de divulgação de afiliados, a consulta de publicações) através de duas rotas públicas que os componentes chamam dentro do mesmo processo — sem viagem de ida e volta por HTTP.
O plugin também acrescenta uma página de administração Widget catalog que documenta os campos de cada bloco, e uma página Setup guide com os passos exatos de instalação e o estado das definições.
Instalação
Instalação
1. Instalar o plugin
Instale @bitdoze.com/emdashhq-widgets a partir do registo de plugins do EmDash, ou ligue-o como dependência de ficheiro e registe-o em sandboxed: no astro.config.mjs:
import widgetsPlugin from "emdashhq-widgets";
emdash();O plugin pede content:read e schema:read — aprove-as para que o widget Latest posts e a rota posts funcionem. Os widgets estáticos são mostrados sem elas.
2. Adicionar os tipos de bloco ao seu esquema
Copie site/block-types/*.json para o array blockTypes do seu ficheiro seed (ou envie com POST o conteúdo de cada ficheiro para /_emdash/api/schema/block-types num site em produção) e depois indique os tipos nos allowedTypes dos campos blocks que os devem aceitar — por exemplo pages.content ou posts.body.
3. Registar os renderizadores
Copie site/components/*.astro, site/components/config.ts, site/components/icons.ts, site/widget-components.ts e site/WidgetBlocks.astro para o seu projeto e depois mostre WidgetBlocks para um campo só de widgets:
ou expanda widgetComponents no seu mapa existente:
const blockComponents = defineBlockComponents();4. Configurar
As definições estão em Plugins → Content Widgets → Settings:
- Privacy-enhanced YouTube embeds — serve os leitores a partir de
youtube-nocookie.com(ativado por predefinição). - Affiliate disclosure — linha em letra pequena dentro dos widgets Product box; vazia, fica oculta.
- Posts collection — coleção predefinida para o widget Latest posts e a rota
posts.
Perguntas frequentes
Perguntas frequentes
Porque tenho de copiar ficheiros em vez de o plugin o fazer?
Os plugins em sandbox correm num ambiente isolado e não podem registar componentes de renderização do Astro. O diretório site/ inclui os mesmos JSON de tipos de bloco e componentes que o autor do plugin usa, pelo que a instalação é uma cópia única para o seu repositório — depois disso, os widgets comportam-se como qualquer um dos seus próprios tipos de bloco.
Os widgets funcionam sem o plugin instalado? Os estáticos sim — Prose, Notice, Accordion, Tabs, Checklist, Button, Embed, Quote, Facts, TOC e Series só precisam dos tipos de bloco e dos componentes. O YouTube, a Product box e o Latest posts leem as definições ou as rotas do plugin; sem o plugin recorrem aos valores predefinidos (sem cookies ativado, sem divulgação, lista vazia).
O widget do YouTube define cookies?
Nenhum leitor é carregado até o visitante clicar na miniatura. Com a definição de privacidade predefinida, o leitor vem então de youtube-nocookie.com, que não define cookies de rastreio nem mesmo nessa altura.
Como é que o Latest posts constrói a sua lista?
O componente chama a rota pública posts do plugin dentro do mesmo processo (sem pedido HTTP). A rota lista as entradas publicadas, da mais recente para a mais antiga, da coleção configurada e resolve o URL público de cada entrada a partir do urlPattern da sua coleção.
Posso mudar o estilo dos widgets?
Sim — cada componente usa classes wgt-* e lê os seus tokens de design (--color-brand, --color-surface, …) com valores de reserva neutros. Substitua as classes ou os tokens para combinar com o seu tema.
Os widgets funcionam também dentro de páginas normais?
Sim. Adicione os tipos widget_* aos allowedTypes de qualquer campo blocks — páginas, publicações ou qualquer outra coisa.
Registo de alterações
Registo de alterações
1.0.4
- Separadores sem JavaScript: as etiquetas degradam-se para âncoras dentro da página e cada painel permanece visível. Com JS passam a ser separadores reais com teclas de seta, Início/Fim e tabindex itinerante.
- Documentação: a ligação da demonstração da galeria leva parâmetros UTM.
1.0.3
- Product box: corrigida a disposição sem imagem que comprimia o conteúdo numa coluna estreita; a coluna de multimédia só é agora mostrada quando há uma imagem definida
- Novo estilo da Product box: linha de divulgação em tipo de letra monoespaçado, etiqueta de preço, marcas de visto/cruz nas vantagens e desvantagens, botão com o estilo dos botões do site
- O conjunto de ícones do site ganhou um ícone
xpara a coluna das desvantagens
1.0.2
- Documentação: a descrição liga à publicação de demonstração da galeria de widgets ao vivo
1.0.1
- Recursos da ficha do registo: ícone do plugin, banner e capturas de ecrã
- Correções de documentação: lista dos 19 blocos na descrição e no registo de alterações
1.0.0
- Versão inicial: 19 tipos de bloco
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 bloco e componentes Astro autónomos em
site/ - Rota pública
configpara as definições partilhadas (modo de privacidade do YouTube, divulgação de afiliados, coleção de publicações) - Rota pública
postsque lista as entradas publicadas mais recentes com os URL resolvidos - Páginas de administração do Block Kit: catálogo de widgets e guia de configuração