---
title: "Hestia: otro tema de una sola página por ThemeIsle + tutorial"
url: https://caribdis.net/2017/02/05/hestia-otro-tema-de-una-sola-pagina-por-themeisle-tutorial/
date: 2017-02-05
modified: 2020-05-21
lang: es
author: "Caribdis.Net"
description: "Actualizado para la versión 3.0.1 - 19/05/2020 A mediados de diciembre último, ThemeIsle presentó el tema número 22 de su colección. Anunciado como uno de sus temas más elegantes hasta..."
categories:
- "Destacados"
- "Hestia"
tags:
- "gratuito"
- "tema"
- "ThemeIsle"
- "traducción"
- "WooCommerce"
- "WordPress"
image: https://caribdis.net/wp-content/uploads/2017/02/hestia.jpg
word_count: 4802
---
# Hestia: otro tema de una sola página por ThemeIsle + tutorial
** **Actualizado para la versión 3.0.1 - 19/05/2020**
A mediados de diciembre último, **[ThemeIsle](https://caribdis.link/ThemeIsle)** presentó el tema número 22 de su colección. Anunciado como uno de sus temas más elegantes hasta el momento, **Hestia** tiene todo lo que un buen tema de **WordPress** debe tener: la interfaz es moderna, flexible, bien ordenada y con tipografías claras.
Aquellos que ya estén familiarizados con el uso de **Zerif Lite**, encontrarán muchas similitudes en la manera de configurar y trabajar con **Hestia**.
Ideal para empresas que recién se inician o profesionales independientes, es totalmente adaptable a los distintos dispositivos, y hasta incluye soporte para **WooCommerce**, con la posibilidad de mostrar los últimos productos en portada. **Hestia** también es compatible con los constructores de páginas de [**SiteOrigin**](https://wordpress.org/plugins/siteorigin-panels/), **[Beaver Builder](https://es.wordpress.org/plugins/beaver-builder-lite-version/)**, [**Elementor**](https://caribdis.link/Elementor) y [**Divi Builder**](https://caribdis.link/DiviPlug), que nos dan la posibilidad de crear contenido fácilmente y con muchas opciones de diseño.
### Ver demo de Hestia
### Instalar y configurar el tema
Este tema se descarga de la página de [**ThemeIsle**](https://caribdis.link/HestiaWP) (botón *Download now for free*), o desde el repositorio de [**WordPress.org**](https://wordpress.org/themes/hestia/).
La manera más sencilla de instalar **Hestia** es desde *Apariencia > Temas > Añadir nuevo*, dentro del escritorio de **WordPress**. Escribimos *Hestia* en el campo de búsqueda y veremos la miniatura con los enlaces *Instalar* y* Vista previa*. Le damos clic a *Instalar* y aguardaremos el proceso de descarga e instalación.
Por último le damos clic al botón *Activar* y ya estaremos listos para trabajar con **Hestia**.
Se agregará un nuevo elemento en el menú *Apariencia,* denominado *Hestia Options*, que es una página de bienvenida con siete pestañas que revelarán información importante sobre el tema y su desarrollo:
**Primeros pasos** – En esta pestaña encontrará un enlace a las acciones recomendadas (por ejemplo, si aún no se han instalado y/o activado los plugins necesarios), el enlace a la documentación oficial de [**ThemeIsle**](https://caribdis.link/ThemeIsle), y un botón para abrir el Personalizador de **WordPress** para comenzar a configurar la apariencia del tema.
**Acciones recomendadas** – En esta pestaña se marcarán los pasos necesarios para el correcto funcionamiento del tema. Se recomienda la instalación y activación del plugin **Orbit Fox** (ex **ThemeIsle Companion**) para tener acceso a los widgets de las secciones. Esta pestaña no se mostrará si el plugin ya se encuentra instalado y activado.
**Plugins útiles** – En esta pestaña se muestra una lista de plugins útiles que son totalmente compatibles con **Hestia** y enriquecerán su funcionalidad. La instalación es opcional.
**Soporte** – En esta pestaña encontraremos enlaces al soporte de [**ThemeIsle**](https://caribdis.link/ThemeIsle), a la documentación del tema, y a varios tutoriales para potenciar el rendimiento y ampliar funcionalidades de **Hestia**.
**Registro de cambios** – En esta pestaña se muestra el contenido completo del archivo `CHANGELOG.md`, que detalla las correcciones y nuevas características de cada actualización de versión del tema.
**Gratis vs. PRO** – En esta pestaña hay un cuadro comparativo de las características de la versión gratuita frente a la [versión PRO](https://caribdis.link/HestiaPRO).
**Biblioteca de sitios** – En esta pestaña se muestran varios diseños listos para importar en un clic.
Una vez instalado **Orbit Fox**, estaremos listos para comenzar a personalizar** Hestia**.
### Configurar la página de inicio y el blog
Para configurar la página de inicio y el blog, bastará con crear dos páginas por separado (sin necesidad de que tengan contenido alguno). La primera podrá llamarse ***Home*** y la segunda ***Blog.*** Luego iremos a *Ajustes > Lectura* y seleccionaremos las páginas de la siguiente manera:
Luego de guardar estos cambios podremos comenzar a añadir contenido a la portada, desde el *Personalizador*.
### Identidad del sitio
Aquí podemos añadir un logo para que aparezca en la cabecera de la página, del lado izquierdo. Le damos clic al botón *Seleccionar el logotipo*, buscamos la imagen en la *Biblioteca multimedia* (o subimos una nueva) y por último hacemos clic en *Elegir*. Como opción, podemos elegir un logo distinto que se mostrará en la cabecera transparente, con un clic en el botón *Selecciona una imagen* en la sección *Logotipo transparente de la cabecera*.
Además, podremos configurar el título del sitio, la descripción y el icono del sitio *(favicon)* tal como lo haríamos con cualquier otro tema de **WordPress**. Si no seleccionamos una imagen para usar como logo, la cabecera mostrará el título del sitio en formato texto.
### Ajustes de apariencia > Ajustes generales
- **Diseño de la barra lateral de páginas** – Se puede elegir entre tres tipos de diseño de página: ancho completo, barra lateral izquierda y barra lateral derecha.
- **Diseño de barra lateral Blog** – También se puede elegir entre tres tipos de diseño de las páginas del blog (archivos y entradas): ancho completo, barra lateral izquierda y barra lateral derecha.
- **Diseño de la barra lateral de la tienda** – Y por último, se puede elegir entre tres tipos de diseño de las páginas de la tienda (categorías y productos): ancho completo, barra lateral izquierda y barra lateral derecha.
- **Activar iconos de para compartir** – Si se selecciona esta casilla, se mostrarán los iconos para compartir en *Facebook, Twitter* y *Google+* en las entradas del blog.
- **Activar hacer scroll al inicio** – Si se selecciona esta casilla, se mostrará un botón en la esquina inferior derecha de la página, que será un enlace para desplazar la página directamente hacia la cabecera.
- **Diseño en caja** – Esta opción está activada de manera predeterminada. Si se desactiva, el tema se mostrará en todo el ancho de la pantalla (sin recuadro).
- **Desactivar Secciones de página de inicio** – Esta opción sirve para usar únicamente constructores de página para armar la portada.
### Ajustes de apariencia > Tipografía
**Hestia** nos permite elegir la fuente del tema, tanto para los títulos como para los textos. Están disponibles las fuentes seguras (estándar) y más de 800 fuentes de Google, así como también es posible seleccionar el subconjunto de fuentes (necesario si se usan idiomas con una configuración de caracteres distinta). La pestaña *Tamaño de fuentes* incluye controles para asignar el tamaño de textos y encabezados en entradas y páginas, así como también en las secciones de la página de inicio.
### Ajustes de apariencia > Colores
**Hestia** nos permite cambiar los colores del tema, que son el color de fondo y el color principal. El color de fondo se mostrará si está activado el diseño con recuadro. Y el color principal el de los enlaces, y otros elementos tales como los botones.
### Ajustes de apariencia > Imagen de fondo
Aquí podemos seleccionar el fondo para todo el sitio. Solo aparecerá en la página de inicio si está activado el diseño en recuadro. Una vez que seleccione la imagen de fondo, aparecerán ajustes adicionales, como la posición y el tamaño. El botón *Fondo de la cabecera* es un enlace directo al panel *Ajustes de cabecera*.
### Ajustes de apariencia > Botón
Aquí podemos probar con distintos valores de relleno para los botones (en píxeles; el icono de enlace sirve para aplicar el mismo valor a los cuatro lados), y cambiar el radio del borde.
### Secciones de página de inicio > Sección de título grande
Esta es la sección correspondiente a la cabecera de la página de inicio.
- **Deshabilitar sección** – Si se marca esta casilla, se desactivará por completo la sección de título grande.
- **Fondo de título grande** – Aquí podemos elegir entre mostrar una imagen de fondo en el encabezado, o un efecto Parallax de dos imágenes (la primera capa será la imagen de fondo, y la segunda capa preferentemente un PNG transparente que contará con un efecto de movimiento sobre el fondo).
- **Título** – Escribir aquí un título para el encabezado.
- **Texto** – Escribir aquí el texto que se mostrará debajo del título.
- **Texto del botón** – Escribir aquí el texto para el botón que aparecerá debajo del texto.
- **Enlace del botón** – Escribir aquí el enlace donde apunta el botón.
- **Extra **- Aquí podremos seleccionar la alineación de los textos: derecha con widget opcional a la izquierda, centrada (predeterminada) e izquierda con widget opcional a la derecha.
Podemos elegir no mostrar el título, el texto o el botón, dejando los campos en blanco.
Si elegimos alguno de los dos diseños con el texto alineado a la derecha o izquierda, veremos el botón *Añadir un widget* para seleccionarlo de los widgets disponibles. Esto es útil si queremos mostrar un formulario en esta sección, o cualquier otro contenido dinámico generado por un plugin o los widgets de WordPress.
### Secciones de la página de inicio > Características
En esta sección podremos mostrar todos los servicios destacados que necesitemos (tres por fila), a modo de anuncio breve, con un icono, un título y una descripción. El icono (de **[Font Awesome](http://fontawesome.io/icons/)**) y el color son personalizables.
- **Desactivar sección** – Marcando esta casilla, podremos ocultarla.
- **Título de sección** – Aquí podemos darle un título personalizado. Si se deja el campo en blanco, no se mostrará un título.
- **Subtítulo de sección** – Aquí podemos escribir una descripción que se mostrará bajo el título. Si se deja el campo en blanco, no se mostrará ninguna descripción.
- **Contenido de características** – Aquí podemos editar cada bloque, o agregar uno nuevo con un clic en el botón *Añadir característica*.
### Secciones de la página de inicio > Acerca de
Esta sección incluye un editor para añadir contenido y nos da la posibilidad de usar una imagen de fondo, para darle una apariencia única a esta sección.
- **Deshabilitar sección** – Marcando esta casilla, podremos ocultarla.
- **Contenido acerca de** – Aquí tendremos un botón *(Editar)*, que es un enlace directo para editar la página marcada como página de inicio.
- **Imagen de fondo de acerca de** – Aquí podemos seleccionar una imagen de fondo que quedará fija al desplazar la página.
### Secciones de la página de inicio > Tienda
La sección *Tienda* fue diseñada para mostrar los últimos productos. Para que funcione, deberá estar instalado y activado el plugin **[WooCommerce](https://es.wordpress.org/plugins/woocommerce/)**.
- **Deshabilitar sección** – Marcando esta casilla, podremos ocultarla.
- **Título de la sección** – Aquí podemos darle un título personalizado. Si se deja el campo en blanco, no se mostrará un título.
- **Subtítulo de la sección** – Aquí podemos escribir una descripción que se mostrará bajo el título. Si se deja el campo en blanco, no se mostrará ninguna descripción.
- **Número de elementos** – Aquí podemos seleccionar cuántos productos se muestran (cuatro por fila).
### Secciones de la página de inicio > Equipo
Con **Hestia** podemos mostrar los miembros de nuestro equipo en la página de inicio, con cada detalle que los describa, desde la imagen hasta los perfiles en redes sociales.
- **Desactivar sección** – Marcando esta casilla, podremos ocultarla.
- **Título de sección** – Aquí podemos darle un título personalizado. Si se deja el campo en blanco, no se mostrará un título.
- **Subtítulo de sección** – Aquí podemos escribir una descripción que se mostrará bajo el título. Si se deja el campo en blanco, no se mostrará ninguna descripción.
- **Contenido de Equipo** – Aquí podemos editar cada bloque, o agregar uno nuevo con un clic en el botón *Añadir miembro del equipo*. Los campos disponibles son:
**Imagen** – Para la foto del miembro del equipo (tamaño mínimo recomendado: 200x200px)
- **Título** – Para el nombre del miembro del equipo
- **Subtítulo** – Para el puesto del miembro del equipo
- **Texto** – Para la descripción del miembro del equipo
- **Enlace** – Para añadir un vínculo a la foto del miembro del equipo
- **Iconos de redes sociales** – Para añadir los enlaces a los perfiles en redes sociales (se pueden agregar los que sean necesarios, con un clic en el botón *Añadir icono*, o eliminarlos con un clic en el enlace *Eliminar icono*)
Ningún campo es obligatorio, por lo cual se mostrará únicamente si tiene contenido.
### Secciones de la página de inicio > Cinta
Esta es una sección de llamado a la acción con el texto a la izquierda y un botón a la derecha.
- **Desactivar sección** – Marcando esta casilla, podremos ocultarla.
- **Imagen de fondo** – Aquí podemos seleccionar una imagen de fondo que quedará fija al desplazar la página.
- **Texto** – Aquí podemos escribir el texto de llamado a la acción.
- **Texto del botón** – Aquí escribiremos el texto del botón.
- **Enlace** – Aquí insertaremos el enlace del botón, que puede ser una página del sitio, un anclaje en la portada o un sitio externo.
### Secciones de la página de inicio > Testimonios
- **Desactivar sección** – Marcando esta casilla, podremos ocultarla.
- **Título de sección** – Aquí podemos darle un título personalizado. Si se deja el campo en blanco, no se mostrará un título.
- **Subtítulo de sección** – Aquí podemos escribir una descripción que se mostrará bajo el título. Si se deja el campo en blanco, no se mostrará ninguna descripción.
- **Contenido de testimonios** – Aquí podemos editar cada bloque, o agregar uno nuevo con un clic en el botón *Añadir testimonio*. Los campos disponibles son:
**Imagen** – Para la foto de la persona que deja el testimonio (tamaño mínimo recomendado: 100x100px)
- **Título** – Para el nombre de la persona que deja el testimonio
- **Subtítulo** – Para el puesto de la persona que deja el testimonio
- **Texto** – Para el contenido del testimonio
- **Enlace** – Para añadir un vínculo a la foto de la persona que deja el testimonio
Ningún campo es obligatorio, por lo cual se mostrará únicamente si tiene contenido.
### Secciones de la página de inicio > Barra de clientes
- **Desactivar sección** – Marcando esta casilla, podremos ocultarla.
- **Contenido de la barra de clientes** – Aquí podemos editar cada bloque, o agregar uno nuevo con un clic en el botón *Añadir cliente nuevo*. Los campos disponibles son:
**Imagen** – Para la foto de la persona que deja el testimonio (tamaño mínimo recomendado: 100x100px)
- **Enlace** – Para añadir un vínculo al sitio del cliente
### Secciones de la página de inicio > Suscríbete
**Hestia** incluye una sección de suscripción a lista de correos. Para que funcione deberá estar instalado el plugin **[SendinBlue](https://wordpress.org/plugins/mailin/)**, además de tener registrada una cuenta en el servicio.
Luego de instalar y activar el plugin, iremos a *SendinBlue > Home* para configurarlo. Luego, en *Forms* agregaremos el siguiente formulario de suscripción:
Por último, haremos clic en el botón *Añadir un widget* y agregaremos el widget *SendinBlue*. En el caso de que no esté instalado el plugin **SendinBlue**, se podrá añadir un widget de otros plugins de suscripción, como por ejemplo, **MailPoet**.
[](https://caribdis.net/wp-content/uploads/2017/02/hestia-suscripcion.jpg)
### Secciones de la página de inicio > Blog
La sección del blog en la página de inicio es sumamente fácil de configurar. Siempre mostrará las entradas más recientes, y podremos elegir cuántas entradas mostrar (se distribuyen en tres por fila).
- **Deshabilitar sección** – Marcando esta casilla, podremos ocultarla.
- **Título de la sección** – Aquí podemos darle un título personalizado. Si se deja el campo en blanco, no se mostrará un título.
- **Subtítulo de la Sección** – Aquí podemos escribir una descripción que se mostrará bajo el título. Si se deja el campo en blanco, no se mostrará ninguna descripción.
- **Número de elementos** – Aquí podemos seleccionar cuántas entradas se muestran (tres por fila).
### Secciones de la página de inicio > Contacto
La sección de contacto funciona con el plugin [**WPForms**](https://es.wordpress.org/plugins/wpforms-lite/), por lo tanto tendremos que instalarlo y activarlo primero. Una vez activado, aparecerá automáticamente el formulario, sin necesidad de más configuraciones.
- **Deshabilitar sección** – Marcando esta casilla, podremos ocultarla.
- **Imagen de fondo** – Aquí podemos elegir una imagen para mostrar como fondo de esta sección.
- **Título de la sección** – Aquí podemos darle un título personalizado. Si se deja el campo en blanco, no se mostrará un título.
- **Subtítulo de la sección** – Aquí podemos escribir una descripción que se mostrará bajo el título. Si se deja el campo en blanco, no se mostrará ninguna descripción.
- **Título del formulario** – Aquí podemos darle un título al recuadro que contiene el formulario.
- **Contenido de Contacto** – Aquí podemos usar el código corto de otro plugin de formulario que no sea Pirate Forms, y añadir un texto para que se muestre debajo del título y subtítulo (con un clic en el botón *Editar*). El campo admite código HTML.
### Opciones de la cabecera > Barra muy arriba
Aquí se podrán añadir widgets del lado izquierdo, y un menú del lado derecho. Para no mostrar la barra, seleccionar la casilla *Deshabilitar sección*.
### Opciones de la cabecera > Navegación
Aquí se podrá elegir entre tres diseños de cabecera: con el logo alineado a la izquierda, con el logo centrado, y con un área de widgets a la derecha. También se podrá activar o desactivar la barra de navegación transparente, y un icono de búsqueda a la derecha del menú, que desplegará el campo al hacer clic.
### Opciones de la cabecera > Ajustes de la cabecera
Aquí podemos seleccionar el diseño de la cabecera para los archivos de entradas y páginas: con el título e información meta sobre la imagen de fondo, o con la imagen por encima del contenido. También podremos elegir el diseño para la página del producto: con o sin imagen de cabecera. Las entradas mostrarán la imagen que se defina en *Cabecera actual* si es que no tienen asignada una imagen destacada (de lo contrario, siempre mostrarán la imagen destacada). Si no se selecciona una imagen se mostrará el color de acento del tema y un color de degradado que se puede establecer con el selector de la parte inferior. Si se marca la casilla *Activar imagen de la cabecera del ancho del sitio* (traducción deficiente para "Activar la imagen de cabecera en todo el sitio"), se mostrará la imagen en todas las páginas y entradas (omitiendo las imágenes destacadas asignadas en cada una).
### Opciones del pie de página
A partir de la versión 2.4.9 existe la opción de editar los créditos del pie de página en este panel. El campo *Agradecimientos en el pie de página* admite código HTML.
### Ajustes del blog
En este panel podremos seleccionar una categoría de entradas para mostrar como destacada en la página del Blog. Si no deseamos mostrarla, simplemente elegiremos *-- Deshabilitar sección --* del menú desplegable.
También podemos escoger uno de los dos diseños: *Lista de entradas* y *Lista de entradas con imágenes alternadas*. El diseño de blog en cuadrícula está disponible solo en la [**versión PRO**](https://caribdis.link/HestiaPro).
Y además, tendremos la posibilidad de elegir cuántas categorías mostrar para cada entrada (ninguna, la primera, o todas las categorías), si usamos un extracto o el contenido de la entrada, y el tipo de paginación (números, o desplazamiento infinito).
### Menús > Ubicaciones de menús
Este tema soporta tres menús: *Menú principal*, *Menú del pie de página* y *Menú de la barra superior* (solo se verá si está activada). Tendremos que seleccionarlos de los menús desplegables, y podremos editarlos desde el administrador de **WordPress** *Apariencia > Menús *o desde dentro del *Personalizador*.
### Configurar el menú principal
Como el tema está diseñado para presentarse en una sola página con efecto Parallax, la página de inicio se ha dividido en varias secciones. Enlazar a esas secciones en el menú es muy simple, y todo lo que necesitamos es añadir los anclajes correspondientes en un elemento de menú *Enlace personalizado*.
Los siguientes son los anclajes a la URL de cada elemento del menú:
- `#carousel-hestia-generic` para la sección del Carrusel
- `#about` para la sección “Quiénes somos”
- `#features` para la sección “Características”
- `#team` para la sección “Equipo”
- `#products` para la sección “Tienda”
- `#subscribe` para la sección “Suscripción”
- `#testimonials` para la sección “Testimonios”
- `#blog` para la sección “Blog”
- `#contact` para la sección “Contáctenos”
### Añadir iconos al menú
Para usar iconos en los elementos del menú bastará con ir a *Apariencia > Menús* y seleccionarlos del menú desplegable que aparecerá al hacer clic en el botón `+` de la izquierda de la etiqueta. **Nota:** deberá estar activado el módulo **Iconos de menú** en la página de *Ajustes generales* del plugin **Orbit Fox**.
### Añadir estilos de botón al menú
Al igual que con los iconos, existen clases que podemos usar en cada elemento del menú para darle estilo. Ahora sí en el campo *Clases CSS* tendremos que agregar la clase `btn`, seguida de una de las clases de la siguiente lista:
Si añadimos además la clase `btn-round`, el botón tendrá un borde redondeado. Existe también la clase `btn-primary`, que tomará el color que se haya configurado como color de acento en el panel *Colores* del *Personalizador*.
### Configurar el menú del pie de página
**Hestia** incluye un menú en el pie de página, que tendremos que configurar desde *Apariencia > Menús* y asignar a la ubicación *Menú del pie de página*. Allí podemos añadir enlaces a páginas internas del sitio, o también podemos usarlo para agregar los iconos de las redes sociales. A partir de la versión 1.1.37 se incluye soporte para iconos de redes sociales, con lo cual bastará con escribir la URL completa del perfil, y el nombre de la red social en el campo *Etiqueta de navegación*, y el tema lo convertirá automáticamente en el icono correspondiente. Están incluidas las principales redes, además del icono del teléfono (URL con el prefijo `tel:`) y del correo electrónico (URL con el prefijo `mailto:`).
Recordemos que para ver los campos *Atributos del título*, *Clases CSS* y *Abrir enlace en una pestaña nueva*, tendremos que activarlos desde las *Opciones de pantalla*, como se muestra a continuación:
[](https://caribdis.net/wp-content/uploads/2017/02/hestia-menu-opciones.png)
### Widgets
**Hestia** incluye tres áreas de widgets que se colocarán debajo de la sección *Contacto* y antes del pie de página. Estas áreas son opcionales, y si no se añade ningún widget no se mostrará. También existen siete áreas de widgets más que no se muestran en la página de inicio: *Barra lateral* (que se muestra en entradas y páginas), *Suscribirse*, *Sección de suscripción al blog* (disponible para **Hestia Pro**), *Barra lateral de WooCommerce*, *Barra superior*, *Navegación* y *Sección de título grande*.
Con esto tendremos el tema configurado y listo para mostrar al mundo.
# Hestia Pro
(en proceso de actualización)
### Ver demo de Hestia Pro
Si todavía no es suficiente, existe una [**versión Pro**](https://caribdis.link/HestiaPRO), que incluye todo lo que hemos visto hasta ahora, además de un carrusel o fondo de vídeo para usar en la cabecera, la sección *Portfolio* y *Precios,* más ajustes del blog y posibilidad de cambiar el orden de las secciones desde el *Personalizador* con la herramienta *arrastrar y soltar*.
**Hestia Pro** está disponible en [cualquiera de las tres membresías de ThemeIsle](https://caribdis.link/TIPlans), y también como tema individual que se puede comprar [**aquí**](https://caribdis.link/HestiaPro).
### Secciones de la página de inicio > Carrusel
En esta sección podremos configurar un carrusel de imágenes, o bien usar una imagen fija como encabezado grande. Las opciones disponibles son *Imagen*, *Botón Color*, *Segundo Botón Color*, *Título*, *Subtítulo*, *Texto del botón*, *Enlace,* *Segundo Texto del botón* y *Segundo Enlace*. No hay límite para la cantidad de pases de imágenes, y tanto el primero como el segundo botón son opcionales.
Si eligió alguno de los dos diseños con el texto alineado a la derecha o izquierda, verá el botón *Añadir un widget* para seleccionarlo de los widgets disponibles. Esto es útil si desea mostrar un formulario en esta sección, o cualquier otro contenido dinámico generado por un plugin o los widgets de WordPress.
En la pestaña *Extra* podrá optar por seleccionar un vídeo de fondo (de un archivo de vídeo de su biblioteca de medios o de YouTube), o dos imágenes con efecto *Parallax.*
### Ajustes de apariencia > Ajustes generales
- **Diseño de barra lateral de página** – Se puede elegir entre tres tipos de diseño de página: ancho completo, barra lateral izquierda y barra lateral derecha.
- **Diseño de barra lateral del blog** – También se puede elegir entre tres tipos de diseño de las páginas del blog (archivos y entradas): ancho completo, barra lateral izquierda y barra lateral derecha.
- **Ancho de barra lateral** – Aquí se puede establecer el ancho de la barra lateral, en píxeles.
- **Ancho del contenedor (px)** – Aquí se puede establecer el ancho del contenedor, en píxeles, con opciones específicas para dispositivos móviles.
- **Activar iconos para compartir** – Si se selecciona esta casilla, se mostrarán los iconos para compartir en *Facebook, Twitter* y *Google+* en las entradas del blog.
- **Activar el botón "Volver arriba"** – Si se selecciona esta casilla, se mostrará un botón en la esquina inferior derecha de la página, que será un enlace para desplazar la página directamente hacia la cabecera.
### Ajustes de apariencia > Tipografía
Aquí, además de las opciones ofrecidas por la versión *Lite* de **Hestia,** podremos ajustar el tamaño de fuente del menú, y asignar tamaños distintos para dispositivos móviles y de escritorio, con sus respectivas vistas previas.
### Secciones de la página de inicio > Portfolio
**Hestia Pro** incluye una sección de *Portfolio* en la página de inicio. Para que funcione, deberá estar instalado y activado el plugin **Jetpack**, y a su vez activada la característica *Tipos de contenidos personalizados > Porfolios* de la pestaña* Jetpack > Ajustes > Escritura*.
Luego de activar el plugin, encontraremos la sección *Porfolio* en el menú de **WordPress**. Allí podremos añadir nuevos proyectos, que deberán tener un título y una imagen destacada asignada. Existen dos opciones para la sección *Portfolio,* que se pueden configurar desde *Secciones de la página de inicio > Portfolio > ¿Activar recuadros grandes?*. Será necesario tener al menos cuatro o cinco proyectos creados para que se pueda usar este diseño. El siguiente es un ejemplo:
La opción *Abrir en Lightbox* le permitirá abrir información del proyecto de Porfolio en una ventana modal, en lugar de abrir la página individual correspondiente al tipo de entrada personalizada.
### Secciones de la página de inicio > Precios
**Hestia Pro** incluye un elegante par de tablas de precios, que le permitirá añadir múltiples elementos a la lista de características, separándolos con un `\n`, como se ve en el siguiente ejemplo:
### Opciones de cabecera > Barra superior
Aquí podemos elegir la ubicación del menú (a la derecha o a la izquierda) y asignar los colores para los textos y enlaces.
### Opciones de cabecera > Navegación
Aquí tenemos, además de las opciones de la versión gratuita, la posibilidad de elegir el tipo de menú en pantalla completa, y de activar la transparencia de la barra de navegación.
[](https://caribdis.net/wp-content/uploads/2017/02/Hestia-Pro-menu.jpg)
### Opciones de cabecera > Ajustes de cabecera
Además de las dos opciones de la versión *Lite* (título e información meta sobre imagen de fondo, o imagen por encima del contenido) existe aquí una más para la presentación de las entradas: título e información meta arriba, imagen debajo y luego el contenido.
### Opciones del pie de página
- **Número de áreas de widgets** – Aquí podemos elegir cuántas columnas tendrá el área de widget, entre 1 y 4.
- **Créditos del pie de página** – Aquí podemos escribir el texto que corresponderá a los créditos.
- **Diseño** – Aquí podemos elegir el diseño de los créditos respecto del menú del pie de página: izquierda, centrado o derecha.
- **Color** – Aquí se puede usar una combinación de colores inversa para el pie de página.
### Colores
Además del color de fondo y color de acento, tendremos control sobre ocho opciones más.
### Ajustes del blog > Sección Autores
Esta sección nos permite mostrar los autores que hemos añadido a la sección *Equipo* en un espacio dentro de las páginas de archivo del blog, a continuación de las entradas. Podemos seleccionar los autores de la lista y cambiar la imagen de fondo.
### Ajustes del blog > Diseño
En esta sección podrá, además de seleccionar una categoría de entradas para mostrar como destacada en la página del Blog, elegir el diseño de la presentación de las entradas: con la imagen destacada a la izquierda, o alternadas a la izquierda y a la derecha.
### Ajustes del blog > Sección Suscripción
Al igual que la sección de autores, podemos colocar un widget de suscripción a las páginas del blog, con los widgets de **SendinBlue**. También nos permite cambiar el título y el subtítulo de esta sección.
El contenido se configura de igual manera que la sección de la página de inicio, y se añade a las páginas de archivo del blog desde *Apariencia > Widgets > Sección Suscripción al blog*. Para no mostrar esta sección, bastará con dejar vacíos los campos *Título de sección* y *Subtítulo de sección*.
### Códigos cortos
** Hestia Pro** incluye esta útil herramienta para insertar secciones de la página de inicio en cualquier parte del sitio: una entrada del blog, una página estática o un bloque creado con un constructor como [**Elementor**](https://caribdis.link/Elementor) o [**Divi**](https://caribdis.link/Divi). Al posar el puntero sobre el título de la sección en el personalizador, aparecerá el código corto correspondiente.
- **Características:** `[hestia_features]`
- **Quiénes somos**: `[hestia_about]`
- **Tienda:** `[hestia_shop]`
- **Portfolio:** `[hestia_portfolio]`
- **Equipo:** `[hestia_team]`
- **Precios:** `[hestia_pricing]`
- **Cinta:** `[hestia_ribbon]`
- **Testimonios:** `[hestia_testimonials]`
- **Suscribirse:** `[hestia_subscribe]`
- **Blog:** `[hestia_blog]`
- **Contacto:** `[hestia_contact]`
### Hooks
**Hestia Pro** incluye una sección en el menú *Apariencia > Hooks de Hestia Pro*, para añadir código personalizado en casi todas las ubicaciones de la página de inicio.
Las [traducciones](https://caribdis.link/HestiaES) para **Hestia Pro** y **Hestia** se encuentran en carpetas separadas.