Skip to main content

BLOG

BUILDER

Creador de páginas

El creador de páginas YOOtheme Pro te permite diseñar y construir tu sitio web visualmente, sin escribir una sola línea de código.

Crea diseños con una interfaz intuitiva de arrastrar y soltar y visualiza la vista previa en tiempo real. Muestra el contenido utilizando una amplia colección de elementos, desde textos e imágenes hasta presentaciones y galerías. Puedes empezar desde cero o cargar uno de los diseños predefinidos de la biblioteca.

El constructor de páginas YOOtheme Pro está disponible para diferentes partes del sitio web.

NOMBREDESCRIPCION
Pages and Posts

Crea diseños individuales de páginas y entradas en el panel Pages.

Templates

Crea diseños de plantillas para todo el sitio en el panel Templates.

Footer

Crea un diseño de pie de página para todo el sitio web en el panel Layout → Footer.

Para crear un nuevo diseño desde cero, haz clic en el botón NEW LAYOUT y comienza a añadir secciones y elementos. También puedes importar un diseño guardado en la biblioteca de diseños haciendo clic en el botón LIBRARY.

Haz clic en la pestaña MY LAYOUTS para importar un diseño guardado

Cada vez que se modifica el diseño, aparecen los botones CANCEL y SAVE LAYOUT fijos en la esquina superior derecha. Al hacer clic en CANCEL o salir del editor de páginas (CLOSE), se descartarán todos los cambios realizados desde el último guardado. Tenga en cuenta que guardar el diseño de la página no guarda la configuración del tema.

Estructura de diseño

Los diseños se organizan en tres tipos diferentes de bloques de construcción.
NOMBREDESCRIPCION
Sections
Las secciones agrupan el contenido en bloques visuales más grandes. Contienen una o varias filas.
Rows and Columns
Las filas constan de una o varias columnas que a su vez contienen elementos.
Elements
Los elementos muestran el contenido real.
Un nuevo diseño suele comenzar con una sección que contiene una fila con una columna vacía. Haga clic en la columna para agregar un nuevo elemento.
Algunos diseños solo constan de filas y columnas. Esto se debe a que las secciones siempre ocupan todo el ancho de la ventana gráfica y no se pueden anidar entre sí.

Acciones (Secciones, filas y elementos)

Pase el cursor sobre una sección, fila o elemento para ver las acciones disponibles. Aquí tiene un resumen rápido de todas las acciones.
ICONO – NOMBREDESCRIPCION
Scroll into view
Desplaza un elemento para que aparezca en la vista previa en vivo.
Edit
Edite una sección o fila. Para editar un elemento, haga clic en su nombre.
Copy
Edite una sección o fila. Para editar un elemento, haga clic en su nombre.
Delete
Eliminar una sección, fila o elemento, incluyendo todo su contenido.
Save in library
Guarde una sección o un elemento en las bibliotecas de diseño o elementos correspondientes.
Add
Agregar una nueva sección, fila o elemento.

Acciones de sección

Al colocar el cursor sobre una sección, las acciones aparecerán junto al nombre de la sección. Para añadir una nueva sección, haga clic en el icono Añadir (Add) en la esquina inferior izquierda.

Acciones de fila

Al pasar el cursor sobre una fila, las acciones aparecerán en la esquina superior derecha. Para añadir una nueva fila, haga clic en el icono Añadir (Add), situado en la esquina inferior derecha.

Acciones de elementos

Para editar un elemento, simplemente haz clic en él. Al colocar el cursor sobre un elemento, las opciones aparecerán en la esquina superior derecha. Para añadir un nuevo elemento, haz clic en el icono Añadir (Add) en la parte inferior.


Buscador de elementos

Para encontrar fácilmente elementos en tu sitio web, simplemente coloca el cursor sobre un elemento en la barra lateral y todas sus representaciones en la vista previa se resaltarán con un borde azul. Si el elemento no está visible, usa el icono de desplazamiento para visualizarlo. De igual forma, al colocar el cursor sobre cualquier contenido en la vista previa, se resaltará el elemento correspondiente en la barra lateral. Además, todas las acciones disponibles para cada elemento aparecen en la parte superior e inferior de la vista previa. Este atajo te permite visualizar, editar, copiar, guardar o eliminar elementos rápidamente, o añadir uno nuevo.

Ordenar

Las secciones, filas y elementos se pueden ordenar arrastrando y soltando.

Ordenar Sección (SECTION)

Para cambiar el orden de las secciones, arrastre el nombre de la sección.

Ordenar Fila (ROW)

Para cambiar el orden de las filas, arrastre el espacio que se encuentra debajo de la fila.

Ordenar Elemento (ELEMENT)

Para cambiar el orden de los elementos, simplemente arrastre el elemento.

Videos