Guías

Recorridos cortos y prácticos para el trabajo diario en WebBlocks CMS. Cada guía cubre una tarea, en pocos pasos, con capturas de pantalla.

¿Es nuevo por aquí? Empiece por Inicie sesión en el panel de administración y siga el enlace Siguiente al final de cada guía. ¿Busca cómo se comporta una función en vez de cómo usarla? Eso vive en la documentación de referencia.

WebBlocks CMS dashboard showing the sidebar and an overview of pages, blocks, and media.

Inicie sesión en el panel de administración

Abra el panel de administración, inicie sesión y oriéntese en el panel de control.

Pages list showing page titles, paths, and publishing status.

El panel de administración en dos minutos

Qué vive dónde en la barra lateral y qué pantallas usará de verdad.

Layout Slots tab showing which slots the page layout defines and which the page has.

Página, layout, slot, bloque

Las cuatro palabras que el CMS usa para todo, en lenguaje llano.

Profile screen showing name, email, interface language, and the password section.

Su perfil y su idioma

Cambie su nombre, su correo, su contraseña y el idioma del panel de administración.

New page form with title, slug, and page layout fields.

Crear una página

Añada una página nueva a un sitio y guárdela como borrador.

Block picker showing the common block types including Header and Image.

Añadir un encabezado y un párrafo

Ponga sus primeras palabras en una página con los bloques Header y Plain Text.

Media Library picker dialog with a list of images and a Select button on each.

Añadir una imagen

Coloque una imagen de la biblioteca de medios en una página, con un texto alternativo que la describa.

Public preview of a draft page with a preview mode notice at the top.

Publicar una página

Previsualice su trabajo y luego haga la página visible para los visitantes.

Translation editor with routing fields, list excerpt, and SEO fields.

Cambiar la dirección de una página

Renombre el slug y la ruta de una página y ajuste sus campos SEO y sociales.

Rich Text block editor showing the formatting toolbar and a formatted paragraph with a list.

Rich Text: formato, listas y enlaces

Negrita, cursiva, enlaces y listas anidadas en un solo bloque editable.

Hero block form showing eyebrow, title, intro, CTA fields, variant, and layout.

Hero: construir una sección de apertura

El banner de la parte de arriba de una página: título, introducción, botones y una imagen de fondo.

CTA block form showing eyebrow, heading, body copy, and two call-to-action pairs.

Botones y CTA

Un solo botón, o un panel de llamada a la acción completo con encabezado y acciones.

Quote block form showing the quote text, author, source, and variant fields.

Cita y aviso

Destaque las palabras de alguien, o marque algo que el lector no debe pasar por alto.

Public page showing a list of linked notes with dates and descriptions, above a data table.

Listas de enlaces y tablas

Una lista de enlaces ordenada con descripciones, y datos tabulares de verdad.

Code block form showing the title, filename label, code sample, and syntax language.

Bloques Code y HTML

Muestre un ejemplo de código como es debido, y sepa cuándo el bloque HTML es la respuesta equivocada.

Media Library showing uploaded files with search, kind, and usage filters.

Subir archivos a la biblioteca de medios

Meta imágenes y documentos en la biblioteca una vez y reutilícelos donde quiera.

Image Variants panel listing thumbnail, card, and content sizes with a regenerate action.

Texto alternativo, pies y variantes de imagen

Los detalles que hacen usable una imagen, y los tamaños que el CMS genera por usted.

Public page showing a three-column image gallery with captions under each image.

Construir una galería

Varias imágenes como una sola cuadrícula, con pies y una lightbox opcional.

Video block form showing video title, external video URL, and supporting copy.

Añadir un bloque de vídeo o audio

Incruste un clip alojado o apunte a uno que vive en otro sitio.

Download block form showing the download label, helper text, and selected document.

Ofrecer un archivo descargable

Una acción de descarga clara para un PDF o un documento, en vez de un enlace pelado.

Media Library showing folder chips and a document assigned to the Studio documents folder.

Organizar los medios en carpetas

Mantenga la biblioteca localizable cuando ya no cabe en una pantalla.

Public page showing a heading and paragraph constrained to a readable measure.

Section y Container: controlar el ancho de la página

Las dos envolturas que deciden cuánto ancho ocupa su contenido y cuánto aire recibe.

Public page showing a three-column set with intro copy above a grid of cards.

Columns y Grid

Ponga cosas una al lado de otra, con texto propio o como disposición desnuda.

Cluster block form showing name, width, justify, align, wrap, and gap.

Cluster y espaciado

Alinee unas pocas cosas en fila y controle el aire entre todo lo demás.

Public page showing a grid of cards above a feature grid.

Card, Feature Grid y Stat Card

Tres formas de empaquetar una unidad pequeña de contenido, y cuándo encaja cada una.

Layout Slots tab showing present, missing, and extra slots for the page.

Elegir y cambiar el layout de una página

Elija el marco en el que se renderiza una página y cámbielo después sin perder contenido.

Public page showing an on-this-page list of anchored headings above a breadcrumb trail.

Tabla de contenidos y migas de pan

Dos bloques pequeños que ayudan a los lectores a situarse en una página larga.

Navigation items screen showing the site and menu selectors above the list of links.

Construir un menú de navegación

Añada, agrupe y reordene los enlaces que pulsan los visitantes.

Shared slot block list showing a navbar with brand, navigation, and header actions nested inside.

Construir una cabecera como Shared Slot

Construya la cabecera una vez y luego apunte todas las páginas a ella.

Shared slot block list showing a section, container, header, text, and link list.

Construir un pie como Shared Slot

Cree desde cero un área reutilizable y llénela de bloques de verdad.

Shared slot edit screen showing the usage panel listing the pages that use it.

Actualizar un Shared Slot con seguridad

Editar un área compartida cambia todas las páginas a la vez. Así se hace sin romper nada.

Page overview showing draft status with submit for review and publish actions.

Borrador, revisión y publicación

Los cuatro estados por los que pasa una página, y quién la mueve.

Page revision history listing workflow and block changes with author and restore actions.

Revisiones: ver el historial y restaurar

Descubra qué cambió, quién lo cambió y devuélvalo a su sitio.

Add user form showing name, email, password, role, and per-site access checkboxes.

Roles: quién puede hacer qué

Los tres roles, hasta dónde llega cada uno y cómo añadir a un colega.

Duplicate page screen showing target site, new title and slug, and what carries over.

Duplicar, mover y archivar páginas

Copie una página como punto de partida, muévala entre sitios o retírela sin borrarla.

Contact messages inbox listing submissions with their status.

Añadir un formulario de contacto y leer los mensajes

Ponga un formulario en una página y luego encuentre lo que enviaron los visitantes.

Comments moderation screen listing pending comments with approve, reject, and spam actions.

Comentarios y valoraciones

Deje que los lectores respondan y revise lo que dicen antes de que aparezca.

Search form block showing accessible label, placeholder, button label, and variant.

Búsqueda del sitio

Ponga una caja de búsqueda en el sitio y mantenga el índice honesto.

Translation editor showing SEO title, description, keywords, and social image fields.

Campos SEO, imagen social y favicon

Qué muestran los resultados de búsqueda y los enlaces compartidos, y dónde se define.

Site settings locales tab showing enabled languages for the site.

Añadir un idioma a un sitio

Dos pasos: registrar el idioma y luego activarlo en el sitio que lo necesita.

Add translation form showing routing fields for the German version of a page.

Traducir una página

Dé a una página un segundo idioma, con su propia dirección y su propio SEO.

Sites screen listing the sites in the installation with their domains.

Gestionar más de un sitio

Una instalación, varios sitios: qué se comparte y qué no.

Site variables tab listing reusable public tokens with their keys and values.

Variables del sitio

Escriba un valor una vez, úselo en todo el sitio, cámbielo en un solo lugar.

Lo que viene

  • Texto y estructura: Rich Text · Hero · botones y CTA · cita, aviso destacado, alerta · listas y tablas · code y HTML
  • Imágenes y medios: subida a la biblioteca de medios · texto alternativo y pies · galerías · vídeo y audio · descargas · carpetas de medios
  • Disposición de la página: Section y Container · Columns y Grid · espaciado · cards y feature grids · elegir el layout de una página
  • Contenido estructurado: FAQ y Accordion · Tabs · Slider · tabla de contenidos y migas de pan
  • Navegación y áreas reutilizables: menús de navegación · la cabecera como Shared Slot · Shared Slots de pie y de CTA · actualizar un Shared Slot con seguridad
  • Trabajar en equipo: borrador, revisión, publicación · revisiones y restauración · roles · duplicar, mover, archivar
  • Visitantes: formularios de contacto y mensajes · comentarios y valoraciones · búsqueda del sitio · SEO e imágenes sociales
  • Más sitios e idiomas: añadir un idioma · traducir una página · varios sitios · variables del sitio