Video file
Anonymous (not verified)
Duration
4:28

APB-DOC-ES-BUILD body. Idioma de esta traducción: español. El archivo de vídeo se comparte.

Entrar, componer, publicar y mirar como visitante

APB-DOC-ES-BUILD. Esta grabación es el recorrido del editor en esta demo. demo_editor entra por Gin, crea una página básica, añade Simple content, Feature box, Accordion, Tabs y Links, guarda, y luego se muestra la misma URL sin sesión. El resultado en vivo está en /learn/building-a-page. Español y portugués conservan este MP4 y traducen las bandas.

Qué verá

Inicio de sesión Gin, Añadir contenido, el campo Page Builder e Inline Entity Form. APB-DOC-ES-BUILD-TAB1.

Simple content, Feature box, Accordion, Tabs y Links. El diseño vive en el padre. El texto vive en el ítem.

Después de Guardar, cierre sesión. La página publicada no tiene barra. Ese es el resultado anónimo.

Cómo se hizo esta grabación

Xvfb, Google Chrome y ffmpeg capturaron la interfaz. La locución es inglés estadounidense. APB-DOC-ES-BUILD-ACC.

La galería sigue congelada. La página en /learn/building-a-page es el resultado publicado, de demo_editor.

python3 scripts/tutorial/produce-build-tutorial.py graba un MP4 nuevo y recrea esa página básica. Luego vuelva a ejecutar este script.

Transcript

Transcripción completa del recorrido del editor. La locución del vídeo está en inglés estadounidense; esta es la traducción al español, con los mismos tiempos.

  1. 0:01 Start at Sign in — Empezamos en la página de inicio de sesión del sitio de demostración. Este recorrido sigue el camino del editor, desde entrar hasta una página publicada.

  2. 0:12 Enter the demo_editor account — Escribimos el usuario, demo editor, y la contraseña. Usar la cuenta de editor, no la de administrador, mantiene esta grabación honesta: es exactamente la interfaz que verá su equipo.

  3. 0:28 Log in — Gin is the admin theme — Entrar: Gin, el tema de administración, toma el control.

  4. 0:34 Add content, then Basic page — En Añadir contenido elegimos Página básica. En este sitio, ese tipo ya incluye el campo Page Builder.

  5. 0:44 Set the page title — Toda página empieza con un título. Esta se llama Building a page with Aero Page Builder.

  6. 0:51 URL alias: /learn/building-a-page — Luego un alias de URL: learn, building a page. Esa será la dirección de la página publicada.

  7. 1:00 Page Builder is the canvas — Este es el campo Page Builder, el lienzo. Cada botón inserta un componente padre. El diseño (ancho, color) vive en el padre; el texto vive en los ítems anidados.

  8. 1:15 Add Simple content — El primer padre es Simple content, la herramienta de maquetación. Lo añadimos y damos título a la sección.

  9. 1:25 Add a Simple content item, then Create — Ahora el texto. Añadimos un ítem — se anida con Inline Entity Form —, escribimos una introducción breve y pulsamos Create para guardar el ítem.

  10. 1:38 Add Feature box — a row of cards — Segundo padre: Feature box, una fila de tarjetas. Tipo, altura y el estilo de color azul se configuran en el padre.

  11. 1:48 First card: for editors — Cada tarjeta es un ítem con título y un cuerpo breve. Esta primera tarjeta habla a los editores.

  12. 1:57 Second card: for the front end — Y una segunda tarjeta, sobre el front-end. El tema pinta la fila: los visitantes nunca ven este formulario.

  13. 2:05 Add Accordion — turn on Open first — Tercer padre: un Accordion, para preguntas. Activamos Open first para que la primera fila arranque abierta.

  14. 2:17 Question: do I edit the gallery? — Primera pregunta: ¿edito la galería? No: las páginas congeladas se quedan congeladas. Se construye en una página nueva, como esta.

  15. 2:26 Question: where does layout live? — Segunda pregunta: ¿dónde vive el diseño? En el padre. Los campos del ítem son solo texto.

  16. 2:35 Add Tabs — Cuarto padre: Tabs. Agrupan texto relacionado en una sola banda y, en el teléfono, se pliegan en un acordeón.

  17. 2:46 Tab 1: the editor canvas — La primera pestaña describe el lado del editor: Gin, el campo Page Builder e Inline Entity Form.

  18. 2:55 Tab 2: the visitor page — La segunda describe el lado del visitante: los mismos párrafos, renderizados como secciones de página.

  19. 3:04 Add Links — the call to action — El último padre es Links, la llamada a la acción. Esta fila se muestra como botones.

  20. 3:13 Button: See it live — El primer botón apunta al recorrido See it live. El tipo de enlace es URL y la ruta es interna.

  21. 3:23 Button: Request a demo — El segundo apunta a Request a demo. Dos botones, un padre: y eso completa la composición.

  22. 3:33 Save publishes this Basic page — Hora de guardar. Las páginas básicas de este sitio no tienen moderación, así que Guardar publica al momento.

  23. 3:43 Published page — still logged in — Y aquí está la página publicada, aún con sesión: fíjese en la barra Gin arriba. Las cinco secciones se ven en orden: intro, tarjetas, acordeón, pestañas y los botones.

  24. 3:58 Log out — Ahora cerramos sesión, para ver lo que ve un visitante.

  25. 4:04 Anonymous view — no toolbar — La misma URL, sin sesión. Sin barra, sin controles de edición: solo la página. Ese es el resultado anónimo de lo que construimos.

  26. 4:16 Editor path complete — request a demo — Ese es el camino del editor: entrar, componer, guardar y comprobar. Solicite una demo si quiere Aero Page Builder en su sitio Drupal.