Cómo crear una Home Page con Thrive Content Builder

En un artículo anterior platiqué sobre cómo crear una landing page efectiva con Thrive Content Builder ahora toca el turno de hablar acerca de cómo crear una Home Page Profesional con el mismo plugin, esto podría ser una solución cuando un cliente solicita la creación de un sitio web pero desea tener toda la información de su empresa y productos o servicios en una sola página, es decir, convertir una página de aterrizaje en una home.

Para ser un poco más real el tema voy a utilizar el giro de un spa para crear una home page con Thrive Content Builder y vayas viendo cada uno de los elementos que nos proporciona esta herramienta.

El SPA se va a llamar SPA Express; ya hasta se me antojo un masaje je, bueno como te decía, el objetivo es colocar los siguientes elementos en el sitio web:

Características de Home Page para el SPA Express

Voy ir describiendo el objetivo de cada sección y los elementos del editor visual Thrive Content builder que he utilizado pero al final te dejo un vídeo para que lo veas en vivo y a todo color cómo hacer una home profesional con thrive.

1. Header o Encabezado

Este sitio web de SPA va a tener en el encabezado un logotoipo y un menú principal.

El menú solo va a constar de las siguientes opciones:

• Inicio
• Quienes somos
• Paquetes
• Contacto

Los elementos del editor visual de thrive que debes utilizar para poder hacer esto son:

• Content Container
• Imagen o Icon
• Text Element

La sección va a quedar así:

2. Imagen principal con un tipo de llamada de acción

En esta sección voy a incrustar una imagen debajo del menú, dicha imagen va a tener un texto y además un call to action o llamada de acción.

Los elementos del editor visual de thrive que debes utilizar para poder hacer esto son:

• Page Section
• Call To Action
• Imagen de fondo

Va a quedar de la siguiente forma:

3. Nuestros Servicios

Después viene la sección para describir los servicios del SPA Express, en este caso lo servicios serian los siguientes:

• Masajes
• Faciales
• Depilación

Los elementos del editor que que he utilizado para poder hacer esto son:

• Context Box
• Feature Grid – with images (2 Columns)
• Text Element

Te muestro el resultado final de esta sección:

4. Call To Action – Descripción de oferta

De nuevo he utilizado el elemento “Call To Action” del editor para describir una oferta con un botón para que realicen la acción que buscamos.

Además le he agregado un elemento muy importante, un contador del tiempo para avisar al posible cliente que le oferta se termina en cierto tiempo, esto lo que provoca en el usuario es un sentido de urgencia y un gran aliciente para que realicen la acción de compra.

Los elementos del editor visual que he utilizado son los siguientes:

• Content Container
• Call To Action
• Countdown Timer

El diseño de esta sección se va a ver como lo muestro a continuación:

5. Tabla de Precios

A continuación voy a insertar un elemento muy importante, si estas vendiendo un producto o servicio en paquetes (características especiales) tienes que utilizar una tabla de precios.

El elemento en el editor de thrive se llama “Pricing Table”

Checa el resultado del componente para el sitio web del SPA. A claro que solo agregue el componente y modifique los títulos, pero cada componente lo puedes modificar a tu antojo.

Además puedes agregar tablas de precios con diferentes números de columnas.

6. Formulario de contacto

Siempre debemos de indicarle al visitante una opción para ponerse en contacto con nosotros y por ello debemos de crear un formulario.

Para lo anterior yo he utilizado diferentes elementos del editor visual:

• Content Container
• Text Element
• Custom HTML (Para que podamos insertar el código y mandar a llamar el formalario de contacto)

El resultado es el siguiente:

7. Pie de Página

Hemos llegado a la última sección de nuestro sitio web para un spa, en este ejercicio he agregado la dirección de la empresa y los iconos de Twitter y Facebook.

Para poder hacer esto si tienes que utilizar elementos como:

• Content Box
• Column Layout (2 Columns)
• Feature Grid – with Icon (2 Columns)

Debe de quedar de la siguiente manera el pie de página:

Plus: Vídeo “Cómo convertir una Pagina de Aterrizaje en Home Page”

El vídeo lo hice en el menor tiempo posible (28 minutos)  sé que tu tiempo es valioso y tienes otras actividades, por eso ya no inserte elementos como el de suscripción o testimonios y otros elementos que nos proporciona thrive ya que no quería un vídeo tan largo.

En nuestro ejemplo no vamos a seleccionar ninguna plantilla predefinida por thrive content builder, vamos a iniciar a seleccionar la opción de “Blank Page”, bueno en el vídeo se entiende más este punto.

Me he adelanto por ejemplo en descargar imágenes para utilizarlas en este ejercicio y sea más rápido todo el proceso de creación de la home en formato de vídeo.

Aquí te dejo este plus, para ver el vídeo solo tienes que suscribirte para desbloquear este contenido premium.

[thrive_lead_lock id=’5767′]

[/thrive_lead_lock]

Conclusión

Este ejercicio fue totalmente para un negocio de SPA pero puede aplicar fácilmente para cualquier tipo de giro, ya que como te habrás dado cuenta Thrive content builder te permite modificar y agregar un sinfín de elementos de tal manera que puedas convertir una landing page a una espectacular home page.

Te vuelvo a repetir que debido a que no quería hacer un vídeo muy largo no utilice más elementos que proporciona el plugin de TCB pero que esto solo fue una probadita, je.

Cualquier duda o comentario puedes hacerlo en la sección de abajo y desde luego si te ha gustado y te ha parecido interesante anímate a compartirlo en tus redes sociales, te lo voy agradecer infinitamente.