Crea tu primera página.

Aprende DXPR BuilderEmpieza aquíCrea tu primera página

Construye una página con DXPR Builder: una imagen junto a un encabezado, un párrafo corto y un botón. También puedes partir de una plantilla lista y cambiar sus palabras. Cualquiera de las dos lleva unos minutos, y terminas con una página guardada que previsualizas como la verán las visitas. Usa esta página después de instalar DXPR Builder.

El vídeo construye la página desde cero: sección, fila, imagen, botón y texto, y luego guardar y previsualizar.

Antes de empezar

  • DXPR Builder está instalado con tu clave de producto (Instala DXPR Builder en tu sitio Drupal).
  • Un tipo de contenido muestra el constructor: su campo de texto usa el formato DXPR Builder, como Drag and drop Page de dxpr_builder_page.
  • Tu rol tiene el permiso Edit with DXPR Builder.

Crea la página

  1. Ve a Content > Add content y elige un tipo de contenido que muestra el constructor.
  2. Escribe un Title y haz clic en Save.

La página guardada se abre con un constructor vacío. DXPR Builder funciona en esta página, no en el formulario de edición.

Opción A: empieza desde una plantilla

La pestaña Saved templates lista diseños que personas de tu sitio guardaron para reutilizar. DXPR CMS trae varios, como Colored icon boxes. En otros sitios la pestaña puede estar vacía; Choose a template en la página vacía ofrece entonces las plantillas de página que vienen con DXPR Builder. Inserta una plantilla guardada muestra estos pasos en un vídeo.

  1. Haz clic en Add Elements para abrir el selector de elementos.
  2. Cambia a la pestaña Saved templates.
  3. Haz clic en una plantilla para insertarla. Sus secciones, filas y elementos aparecen en la página, listos para editar.
  4. Haz clic en Save en la barra de herramientas.
  5. Abre el menú del ojo y elige Preview para ver la página como la verán las visitas.

Opción B: construye desde cero

El vídeo de arriba sigue estos pasos.

  1. Haz clic en Add Elements y elige Section en la pestaña Layout.
  2. Haz clic en + en la barra de controles de la sección y elige Row.
  3. Haz clic en el icono de cuadrícula en la fila, elige un preset de columnas como 1/3 + 2/3, y haz clic en Save.
  4. Haz clic en + en la columna izquierda, abre la pestaña Content y elige Image.
  5. Haz clic en Select Image, busca en el explorador de medios con Apply filters, marca una foto y haz clic en Insert selected.
  6. Abre el panel SEO, escribe el Alt attribute y haz clic en Save.
  7. Haz clic en + en la columna derecha y elige Button.
  8. Escribe el Title y Link, elige un Type y haz clic en Save.
  9. Haz clic en + en la barra de controles de la columna ancha y elige Text.
  10. Escribe un encabezado, defínelo como Heading 2, escribe un párrafo debajo y haz clic en Save.
  11. Haz clic en Save en la barra de herramientas.
  12. Abre el menú del ojo y elige Preview para ver la página como la verán las visitas. Elige Edit en el mismo menú para seguir trabajando.

Cambia lo que añadiste

  • Text: haz clic en un elemento Text para editarlo en su sitio. Una barra de herramientas ofrece negrita, cursiva, encabezados, enlaces, listas, color de fuente y más. Tu user profile decide qué botones aparecen.
  • Settings: abre More en la barra de controles de un elemento y elige Settings. Un Image tiene ancho, alto, un enlace y su texto alternativo; un Button tiene un Type, un tamaño y un enlace.
  • Order: arrastra un elemento por su barra de controles a otro lugar.

Haz clic en Save en la barra de herramientas cuando termines. El navegador te avisa si intentas salir de la página con cambios sin guardar.

Lo que ves

En Preview, la imagen queda a la izquierda. El encabezado, párrafo y botón quedan a la derecha, sin barras de controles. De vuelta en Edit, cada elemento muestra su barra de controles cuando pasas el cursor sobre él. DXPR Builder guarda la página como HTML en el campo que edita, normalmente Body. Las visitas ven la página cuando el contenido está publicado.

Si no ves el botón Add Elements

  • La página vacía muestra "Choose a template" y "Or add elements using the +". Enable page creation assistant está desactivado en /admin/dxpr_studio/dxpr_builder/ai_settings. Haz clic en + en la barra de herramientas del constructor para abrir el selector de elementos.
  • La página no muestra ningún constructor. El tipo de contenido no usa el formato DXPR Builder, o tu rol no tiene Edit with DXPR Builder. Sigue Comprueba la instalación.
  • La pestaña Saved templates no lista plantillas. Nadie en el sitio guardó una aún, o tu perfil de usuario las oculta. Usa Choose a template en la página vacía, o guarda la tuya.
  • Tus cambios desaparecen tras recargar. La página no se guardó. Haz clic en Save en la barra de herramientas del constructor antes de salir de la página.

¿Qué sigue?