Contenidos de la página
Opciones del tema
El primer paso tras acceder a nuestro usuario de WordPress es ir a la barra lateral y hacer clic en la casilla ‘Impreza‘ 
, lo que nos lleva a un menú encabezado por la sección ‘Opciones del tema‘, la cual vemos a continuación:
Generales
Este apartado recoge varias opciones centradas en el apartado visual de la página. Aquí podemos escoger el icono de nuestra web, si queremos subrayar enlaces al pasar el cursor por encima o personalizar la apariencia del botón de «Volver arriba», entre otras preferencias.
Diseño del sitio
Esta pestaña se centra en la estructura que vamos a darle a nuestra web, tanto en pantallas grandes como en portátiles, tabletas y dispositivos móviles. Aquí podemos ajustar parámetros como la anchura de la página y las columnas, los márgenes que aplicar por defecto, sangrías, etc.
Diseño de páginas
Aquí podemos decidir el formato que usaremos por defecto para nuestras páginas, entradas, porfolios, etc. Por lo general, se suelen dejar las plantillas y opciones preestablecidas, siendo dentro de cada página donde escogeremos qué modelos emplear.
Diseño de archivos
Similar a la pestaña ‘Diseño de páginas‘, aquí podemos decidir el formato que usuramos por defecto para ciertos elementos (archivos, categorías, etiquetas, autores…).
Colores
En esta sección elegimos los colores que se usarán por defecto en nuestras páginas. Se aplican tanto a la cabecera como al cuerpo y al pie de página; y los elementos que podemos alterar serán, principalmente, fondos, textos y bordes*.
*Para cambiar los colores predeterminados de ciertos elementos (como en el caso de los botones), deberemos acceder a su correspondiente sección.
Tipografía
En esta pestaña seleccionamos la fuente que usaremos por defecto en nuestros proyectos, así como su tamaño y otros atributos (cursiva, negrita, subrayada, etc.). También se nos da la opción de ajustar parámetros en función del dispositivo (responsive), cambiar el estilo de los h1, h2… h6 y cargar e importar fuentes tanto de Google como personalizadas.
Estilos de Botón
Este apartado nos permite crear y personalizar los botones de nuestra web. Los parámetros a modificar son numerosos (tamaño, bordes, colores, fuente, sombreado, etc.).
Estilos del Campo
Aquí podemos cambiar al aspecto de los campos a rellenar (que veremos, principalmente, en formularios de contacto).
Porfolio
Iconos
En esta sección elegimos el tipo de icono que emplearemos en nuestros proyectos. Vienen marcados por defecto los iconos de Font Awesome.
Tamaño de las imágenes
Este apartado recoge un par de opciones adicionales respecto al tamaño de las imágenes. En concreto, el límite de anchura y altura de las mismas, así como la resolución máxima de imágenes de gran tamaño. Para ajustar parámetros más básicos, debemos ir a la sección ‘Ajustes‘ -> ‘Medios‘ de WordPress.
Avanzado
En esta pestaña seleccionamos qué módulos activar para nuestros proyectos (Live Builder, Gutenberg, Porfolio, Testimonios, etc.), así como las opciones de rendimiento del sitio web (componentes JQuery y optimización de JavaScript y CSS, principalmente).
Código personalizado
En esta sección podemos escribir código CSS adicional que sobrescribe el código aplicado en los estilos del tema. En las dos ventanas de menor tamaño (</head> y </body>) podemos añadir código de Google Analytics u otro código de seguimiento, así como scripts.
Administrar opciones
En esta pestaña podemos reestablecer los valores predeterminados de las ‘Opciones del tema‘, así como realizar copias de seguridad, restaurar la versión dada por dicha copia de seguridad e importar las opciones que hayamos seleccionado previamente.
Diseños de cuadrícula
En esta sección definimos la estructura (por bloques) de nuestras entradas, testimonios y publicaciones en general. Podemos guardar varios diseños y usar el que más se ajuste a nuestras necesidades.
Para empezar, pulsamos la opción ‘Añadir diseño de cuadrícula‘.
Luego hacemos clic dentro del cuadro con el signo ‘+‘ para añadir un elemento.
Y elegimos un elemento de la siguiente lista:
Así quedaría la plantilla tras añadir nuestro primer elemento:
Por otra parte, cuando queramos modificar los atributos de un elemento, solo tenemos que pasar el ratón por encima del mismo y hacer clic en la primera opción que nos aparecerá (la del lápiz 
) para editarlo a nuestra conveniencia.
Además, cuando tengamos varios elementos, podemos alternarlos de sitio entre ellos manteniendo pulsado el ratón sobre el elemento a cambiar y arrastrándolo hasta la posición que queramos.
Finalmente, también podemos agrupar varios elementos en bloques horizontales o verticales con las llamadas ‘estructuras’, que nos permiten crear una serie de filas y columnas internas para dar un formato más definido a nuestra plantilla.
Cabeceras
En esta sección definimos la estructura (por bloques) de nuestras cabeceras. Podemos guardar varios diseños y usar el que más se ajuste a nuestras necesidades.
Para empezar, pulsamos la opción ‘Añadir cabecera‘.
En esta ventana crearemos nuestra cabecera, que se diferenciará en tres zonas:
- Zona superior: Compuesta por la primera fila de bloques. Se suele dejar para incluir información de contacto (teléfono, correo electrónico, enlaces a redes sociales, etc.). Es preferible que ocupe poco espacio, y es normal optar por que desaparezca al hacer scroll. Es una práctica habitual posicionar sus elementos en el tercer bloque, el de la derecha.
- Zona principal: Compuesta por la segunda fila de bloques. Como su nombre indica, aquí suelen hallarse los elementos más importantes de la cabecera: el logo (es habitual posicionarlo en el bloque de la izquierda) y el menú de inicio (se acostumbra a poner en el bloque derecho). Es la zona que más espacio ocupa, y sigue presente al hacer scroll en la página.
- Zona inferior: Compuesta por la tercera fila de bloques. No se suele usar, salvo para incluir algún submenú o similares (aunque para ello es más común introducir un desplegable dentro del menú de inicio situado en la zona principal).
Ajustes del encabezado
Además de gestionar la estructura de bloques, la sección de ‘Cabeceras‘ cuenta con un menú adicional ( situado en el lateral derecho de la pantalla) que nos faculta para modificar la apariencia de cada zona por separado, así como retocar ciertos ajustes comunes a todas ellas.
El primero de sus apartados es el de ‘Ajustes generales del encabezado‘, que nos permite, principalmente, elegir la orientación de la cabecera (horizontal/vertical), si queremos que sea fija (desmarcar esta opción hará que la cabecera desparezca cuando hagamos scroll) y escoger si queremos una cabecera de fondo transparente (por defecto se aplica a la cabecera en su posición inicial, y el fondo ‘vuelve’ al hacer scroll).
Los tres apartados restantes sirven para personalizar cada zona por separado (superior, principal e inferior). Aquí podemos escoger si queremos que la zona sea visible (obligatorio en el caso de la zona principal), la altura de cada zona (y su altura flotante, que se aplica cuando la cabecera se encuentra en su posición inicial) y los colores (del texto y de los fondos, diferenciando si la cabecera es transparente o no).
Plantillas de Contenido
En esta sección definimos la estructura (por bloques) de nuestras páginas. Podemos guardar varios diseños y usar el que más se ajuste a nuestras necesidades. Para ello usaremos el maquetador visual WPBakery.
Para empezar, pulsamos la opción ‘Añade Plantilla de Contenido‘.
Luego haremos clic dentro de la casilla ‘Añadir Elemento‘ para agregar un nuevo componente.
Y elegimos un elemento de la lista que nos aparecerá (por lo general, escogeremos el elemento ‘Fila’).
Para una explicación más profunda del funcionamiento de WPBakery, iremos a esta sección.
Bloques de página
En esta sección definimos la estructura (por bloques) de nuestros pies de página. Podemos guardar varios diseños y usar el que más se ajuste a nuestras necesidades. Para ello usaremos el maquetador visual WPBakery.
Para empezar, pulsamos la opción ‘Agregar bloque de página‘.
Luego hacemos clic dentro de la casilla ‘Añadir Elemento‘ para agregar un nuevo componente.
Y elegimos un elemento de la lista que nos aparecerá (por lo general, escogeremos el elemento ‘Fila’, tal y como haríamos en una plantilla de contenido).
Por lo general, un pie de página tendrá dos secciones bien diferenciadas que marcamos a continuación:
- Bloque del cuadro rojo: El bloque principal donde situaremos la mayor parte del contenido, como los datos de contacto, el logo de la empresa, enlaces sociales, premios recibidos y algún texto con información relevante.
- Bloque del cuadro verde: Se suele dejar para el Copyright y una copia del menú de inicio (para evitar tener que volver al principio de la página). Se diferencia con otro color y no es habitual que lleve una imagen de fondo.
Para una explicación más profunda del funcionamiento de WPBakery, iremos a esta sección.
Complementos
Una lista de plugins (de pago y gratuitos) compatibles con Impreza. Se diferencian en tres categorías:
- Instalar ahora: Plugins recomendados para Impreza que no han sido instalados.
- Activar plugin: Plugins instalados pero no activos (no forman parte del proyecto en medida alguna).
- Activo: Plugins que han sido instalados y activados. Forman parte del proyecto y suelen aparecer en la barra lateral izquierda. Se pueden desactivar en cualquier momento, dejando de formar parte del proyecto (y viceversa).
Importar contenido de demostración
Más de cincuenta plantillas de prueba dadas por Impreza, cada una con una temática propia. Para usarlas, basta con hacer clic en la plantilla en cuestión…
…y aparecerá el siguiente menú, donde elegimos qué queremos importar.
Acerca de
Información y documentación pertinente sobre Impreza (versión del tema, changelog, tickects, FAQs, tuturiales…).
Apariencia
Menús
A diferencia de otros elementos de similar importancia, los menús no son accesibles desde el propio menú de Impreza. Para crearlos (y modificarlos) es necesario hacer clic en la casilla ‘Apariencia‘ 
, justo bajo el botón ‘Impreza‘ .
Tras hacerlo, nos dirigimos a la tercera opción, ‘Menús‘.
Esto nos lleva a una página con numerosas opciones de personalización, las cuales mostramos a continuación:
- Recuadro rojo: Desde aquí elegimos el menú que queremos editar, o creamos uno desde cero.
- Recuadro verde: Esta opción nos permite agregar nuestras páginas, entradas, etc. al menú que vamos a crear/editar.
- Recuadro azul: Este campo nos permite modificar nuestros enlaces (nombre, redireccionamiento…), así como su posición en el menú.
Para finalizar la edición, hacemos clic en el botón ‘Guardar menú‘ situado en la esquina inferior derecha de la pantalla.
WPBakery Page Builder
Guía de inicio
WPBakery es un maquetador visual que nos ayuda a diseñar nuestra web de una forma fácil, directa y gráfica. Con esta herramienta desarrollaremos el grueso de nuestros proyectos, por lo que es importante entender su funcionamiento y manejo.
Como ejemplo, crearemos una página de cero. Para ello, seleccionaremos la casilla ‘Páginas‘ 
de la barra lateral de tareas.
Luego seleccionamos la opción ‘Añadir nueva‘ que vemos a continuación:
Normalmente se nos redireccionará por defecto al editor de Backend, desde el que podemos maquetar nuestra web a base de puro código.
Aunque este modo se suele usar más como una herramienta complementaria y puntual al principal reclamo de WPbakery, el Modo Clásico. Para acceder al mismo hacemos clic en la casilla ‘Editor de Backend‘*.
*Puede parecer contraintuitivo que el botón de Backend nos lleve al Modo Clásico (y viceversa), pero así es cómo funciona esta opción actualmente.
Una vez en el Modo Clásico, para añadir un nuevo elemento pulsamos en el campo enmarcado en verde (para volver al Backend pulsaremos en ‘Classic Mode‘).
Y elegimos un elemento de la siguiente lista (por lo general, escogeremos el elemento ‘Fila’):
Tras añadir el elemento ‘Fila’ (y un elemento ‘Texto’ dentro de la misma) el resultado sería el siguiente:
Las flechas apuntas a tres casillas de símbolo ‘+‘, y representan lo siguiente:
- Flecha roja: Sitúa un nuevo elemento en la fila, que será posicionado por encima del elemento ‘Texto’ (verticalmente*).
- Flecha azul: Sitúa un nuevo elemento en la fila, que será posicionado bajo el elemento ‘Texto’ (verticalmente). Al igual que en el caso anterior, el nuevo elemento podrá ser otra fila, que pasará a ser una fila dependiente de la fila original.
- Flecha verde: Sitúa un nuevo elemento independiente a la fila, que será posicionado bajo la misma fila (verticalmente). Si el elemento en cuestión no es una fila, éste será incluido automáticamente en una nueva fila que, igualmente, será creada de forma automática.
*A diferencia de los elementos de una cabecera, para anexar elementos independientes de forma horizontal necesitaremos agruparlos bajo el elemento ‘Envoltura Horizontal’.
Filas
Las filas son los elementos más importantes a la hora de crear una página/plantilla. Pulsando la casilla del lápiz accedemos a su menú, desde el que interactuamos con numerosos parámetros que vemos a continuación.
El menú se divide en los siguientes apartados:
General:
- Espacios verticales: Márgenes que se añaden tanto por encima como por debajo de la fila. Por defecto es un margen medio (M), pero se puede modificar a S, L, XL o quitarlos por completo.
- Fila de altura completa: Ajusta el contenido de la fila a la altura de la pantalla.
- Contenido a ancho completo: Niega los márgenes horizontales predeterminados en el menú de Impreza.
-
Estilo de Color de la Fila: Varias opciones de color para los elementos de la fila.
- Imagen de fondo: Añade una imagen de fondo que cubre la fila. Se puede ajustar el tamaño de la imagen, así como su posición, saturación, etc. También se le pueden aplicar un efecto Parallax para aportar dinamismo.
- Mostrar en el fondo: Añade un vídeo o un deslizador de imágenes de fondo que cubre la fila. Se puede ajustar el tamaño, posición, etc. (pero no se les puede aplicar un efecto Parallax, ya que son elementos dinámicos de por sí).
-
Superposición de fondo: Un fondo de un color (o dos, de forma gradiente) que se superpone a la imagen o vídeo de fondo (se le cambia la opacidad para jugar con distintos tonos y resultados).
- Fila pegajosa: Esta opción hace que la fila permanezca en la parte superior de la pantalla al hacer scroll (se comportaría como una cabecera).
- Deshabilitar fila: Oculta la fila, que no podrá verse en la parte pública de la web.
Columnas:
- Espacio entre columnas: Los márgenes existentes entre las columnas de una fila.
-
Posición del contenido de las columnas: El contenido de las columnas viene dado ‘Arriba’ por defecto, pero se puede cambiar a ‘Intermedio’ o ‘Abajo’ para dotar al proyecto de otra identidad visual.
- Añadir relleno adicional alrededor del contenido de las columnas: Mejora la apariencia de aquellas columnas que posean un fondo.
- Orden inverso para apilar columnas: La última columna se mostrará ‘Arriba’ cuando la resolución de la pantalla sea menor que 992 píxeles.
Divisor de forma:
- Un ‘separador’ visual personalizable que acota el inicio de una fila con el final de otra.
Ventana de Diseño
La última pestaña de ajustes se trata de la ventana de ‘Diseño‘, y es común a todos los elementos de la plantilla. Dada la versatilidad que ofrece, se suele trabajar directamente desde dicho menú. Su distribución es la siguiente:
- Texto: Color del texto, fuente, tamaño, estilo, etc.
- Fondo: Permite incluir un color de fondo (o dos con estilo gradiente) o una imagen (a la que no se le podrá añadir un efecto Parallax, a diferencia de lo visto en la opción ‘General’).
- Tamaños: La anchura y altura del elemento, así como sus valores máximos y mínimos.
- Espaciado: Márgenes y padding.
- Borde: Se puede escoger su estilo (sólido, rayado, punteado y doble), radio, color y grosor.
- Posición: Estática, relativa, absoluta, fija y pegajosa.
- Sombra del cuadro: Aporta profundidad a la envoltura del elemento. Se le puede dar valores negativos (tanto horizontal como verticalmente) para dirigir la sombra en la dirección deseada.
- Animación: Se aplicará al elemento cuando entre en pantalla (desvanecerse, aparecer desde un margen, efecto rebote, etc.).
- Clase extra / ID de elemento: Aporta una clase (.nuevaClase) o una nueva ID (#nuevaID) al elemento para diferenciarlo y poder aplicarle un estilo CSS propio.
- Ocultar en: Cuatro opciones (
