O Editor
O conteúdo do corpo de páginas e posts é escrito em um editor de rich text (Quill) - botões de formatação familiares, HTML puro por baixo, com alguns auxiliares específicos do Chinaski para imagens, links e blocks de conteúdo. Esta página cobre o que há na barra de ferramentas, os auxiliares inteligentes embutidos nela e as regras para o que conta como conteúdo de corpo válido.
Onde ele aparece
O editor é o campo Corpo (Body) no editor de páginas e no editor de posts. Ele edita apenas o conteúdo - títulos, slugs, campos de SEO, datas e todo o resto dessas telas são campos de formulário separados. Os arquivos do editor são servidos do seu próprio servidor (sem CDN externa) e verificados por integridade como o resto da UI administrativa.
A barra de ferramentas
| Grupo | Botões |
|---|---|
| Texto | Negrito, itálico, sublinhado, tachado |
| Títulos | Heading 2, 3, 4 e Normal, os títulos começam no H2 |
| Blocks | Citação em bloco, bloco de código |
| Listas | Numerada, com marcadores |
| Objetos inline | Link, Imagem |
| Limpeza | Limpar formatação |
Não há H1 no editor de corpo, o próprio campo de título da página/post é o único h1; os títulos do corpo começam no H2 para que toda página tenha uma única hierarquia de títulos consistente. Também não há seletores de fonte ou cor: a tipografia é trabalho do tema, e é isso que mantém o site publicado consistente (e livre de JavaScript em tempo de execução).
Trabalhando com imagens
O botão de imagem abre a biblioteca de mídia em um seletor, em vez de pedir uma URL. Escolha a imagem que você já enviou (ou faça o upload ali), e ela é inserida no seu cursor. As imagens, portanto, sempre vêm da biblioteca, você a abastece primeiro e as usa nas páginas depois.
Trabalhando com links
O botão de link, ou Ctrl/Cmd+K em qualquer lugar do editor, abre um painel de links. Enquanto você digita, ele sugere páginas e posts publicados no seu próprio site por título ou slug (no mesmo idioma em que você está editando, quando aplicável), incluindo a URL completa de páginas aninhadas. Pressione Enter (ou clique) em uma sugestão para usá-la, ou cole qualquer URL externa. As sugestões incluem apenas páginas que estão realmente no ar, então você não pode acidentalmente criar links para rascunhos.
Blocks de conteúdo no corpo
Blocks de conteúdo reutilizáveis (CTAs, citações, galerias, formulários…) são incorporados ao corpo como shortcodes {{block:name}} - mas o editor os exibe como chips amigáveis em vez de código bruto:
- Inserir um block: use o botão Inserir Block (um diálogo com busca que lista seus blocks), digite
/no texto para abrir um seletor de blocks em linha (setas + Enter, Esc para cancelar) ou insira um shortcode a partir da Biblioteca de Conteúdo. - Os chips mostram o que são: cada chip é rotulado com o nome do block em vez de expor a sintaxe do shortcode.
- Os chips são clicáveis: clique em um chip para abrir a tela de edição daquele block em uma nova aba, ajuste o block, e ele já estará atualizado em todos os lugares em que é usado no próximo rebuild.
- Ao salvar, os chips se tornam shortcodes reais no corpo armazenado; ao recarregar, eles voltam a ser chips. Colar conteúdo contendo marcas
{{block:…}}no editor também os transforma em chips.
Como o seu texto se comporta com o servidor
Algumas regras de qualidade existem para que meses de edição não corrompam lentamente as páginas:
- Linhas vazias são limpas. As linhas em branco que o mecanismo do Quill adiciona a cada salvamento são colapsadas, parágrafos vazios repetidos viram um só, e a linha em branco perdida no final de um artigo é removida.
- O corpo não pode ficar vazio. Uma página ou post precisa de conteúdo no corpo: texto visível, uma imagem ou um block incorporado, apenas espaços em branco e tags vazias são rejeitados com uma mensagem clara de "Body is required", tanto no formulário quanto de novo no servidor.
- Todo o resto é armazenado como está. O HTML que o editor produz é exatamente o que o site publicado serve.
Rascunhos
Enquanto você edita, seu trabalho é salvo periodicamente no servidor como rascunho. Se o seu navegador fechar ou travar, o editor mostra um banner oferecendo o rascunho salvo para que você continue em vez de redigitar. (Depois que você salvar corretamente, o repositório de rascunhos é sincronizado para corresponder.)
Superfícies de editor relacionadas
- Um modal de seletor de documentos está disponível nos editores de página/post para criar links para documentos gerenciados.
- O editor é compartilhado entre páginas e posts, então ambos usam as mesmas regras de títulos, o mesmo tratamento de imagens e a mesma incorporação de blocks.