APB-DOC-PT-BUILD body. Idioma desta tradução: português do Brasil. O arquivo de vídeo é compartilhado.
Entrar, compor, publicar e ver como visitante
APB-DOC-PT-BUILD. Esta gravação é o percurso do editor nesta demo. demo_editor entra pelo Gin, cria uma página básica, adiciona Simple content, Feature box, Accordion, Tabs e Links, salva, e depois a mesma URL aparece deslogada. O resultado ao vivo fica em /learn/building-a-page. Espanhol e português mantêm este MP4 e traduzem as faixas.
O que você verá
Login Gin, Add content, o campo Page Builder e Inline Entity Form. APB-DOC-PT-BUILD-TAB1.
Simple content, Feature box, Accordion, Tabs e Links. Layout fica no pai. Texto fica no item.
Depois de Save, saia. A página publicada não tem toolbar. Esse é o resultado anônimo.
Como esta gravação foi feita
Xvfb, Google Chrome e ffmpeg capturaram a interface. A narração é inglês americano. APB-DOC-PT-BUILD-ACC.
A galeria continua congelada. A página em /learn/building-a-page é o resultado publicado, de demo_editor.
python3 scripts/tutorial/produce-build-tutorial.py grava um MP4 novo e recria essa página básica. Depois rode este script de novo.
Veja o resultado
Abra a página ao vivo que o editor publicou, ou o tour do produto.
Transcrição completa do percurso do editor. A narração do vídeo está em inglês americano; esta é a tradução para o português, com os mesmos tempos.
0:01 Start at Sign in — Começamos na página de login do site de demonstração. Este percurso segue o caminho do editor, de entrar até uma página publicada.
0:12 Enter the demo_editor account — Digitamos o usuário, demo editor, e a senha. Usar a conta de editor, não a de administrador, deixa esta gravação honesta: é exatamente a interface que a sua equipe verá.
0:28 Log in — Gin is the admin theme — Entrar: o Gin, tema de administração, assume a interface.
0:34 Add content, then Basic page — Em Add content escolhemos Basic page. Neste site, esse tipo já traz o campo Page Builder.
0:44 Set the page title — Toda página começa com um título. Esta se chama Building a page with Aero Page Builder.
0:51 URL alias: /learn/building-a-page — Depois um alias de URL: learn, building a page. Esse será o endereço da página publicada.
1:00 Page Builder is the canvas — Este é o campo Page Builder, a tela. Cada botão insere um componente pai. Layout (largura, cor) fica no pai; o texto fica nos itens aninhados.
1:15 Add Simple content — O primeiro pai é Simple content, a ferramenta de layout. Adicionamos e damos um título à seção.
1:25 Add a Simple content item, then Create — Agora o texto. Adicionamos um item — aninha com Inline Entity Form —, escrevemos uma introdução breve e apertamos Create para salvar o item.
1:38 Add Feature box — a row of cards — Segundo pai: Feature box, uma fileira de cards. Tipo, altura e o estilo de cor azul são ajustes do pai.
1:48 First card: for editors — Cada card é um item com título e um corpo curto. Este primeiro card fala com os editores.
1:57 Second card: for the front end — E um segundo card, sobre o front-end. O tema renderiza a fileira: visitantes nunca veem este formulário.
2:05 Add Accordion — turn on Open first — Terceiro pai: um Accordion, para perguntas. Ligamos Open first para a primeira linha já abrir no carregamento.
2:17 Question: do I edit the gallery? — Primeira pergunta: eu edito a galeria? Não: páginas congeladas continuam congeladas. Você constrói numa página nova, como esta.
2:26 Question: where does layout live? — Segunda pergunta: onde fica o layout? No pai. Os campos do item são só texto.
2:35 Add Tabs — Quarto pai: Tabs. Agrupam texto relacionado numa só faixa e, no telefone, viram um acordeão.
2:46 Tab 1: the editor canvas — A primeira aba descreve o lado do editor: Gin, o campo Page Builder e Inline Entity Form.
2:55 Tab 2: the visitor page — A segunda descreve o lado do visitante: os mesmos parágrafos, renderizados como seções da página.
3:04 Add Links — the call to action — O último pai é Links, a chamada à ação. Esta fileira aparece como botões.
3:13 Button: See it live — O primeiro botão aponta para o tour See it live. O tipo de link é URL e o caminho é interno.
3:23 Button: Request a demo — O segundo aponta para Request a demo. Dois botões, um pai: e isso completa a composição.
3:33 Save publishes this Basic page — Hora de salvar. As páginas básicas neste site não têm moderação, então Save publica na hora.
3:43 Published page — still logged in — E aqui está a página publicada, ainda logado: veja a barra Gin no topo. As cinco seções aparecem em ordem: intro, cards, acordeão, abas e os botões.
3:58 Log out — Agora saímos da sessão, para ver o que um visitante realmente vê.
4:04 Anonymous view — no toolbar — A mesma URL, sem sessão. Sem toolbar, sem controles de edição: só a página. Esse é o resultado anônimo do que construímos.
4:16 Editor path complete — request a demo — Esse é o caminho do editor: entrar, compor, salvar e conferir. Peça uma demo se quiser o Aero Page Builder no seu site Drupal.