Thrive Content Builder Parte 4: el tutorial más completo en español que hayas visto

Por TLPC

Tiempo de lectura minutos

 palabras

4 comentarios

Thrive Content Builder 4 seguimos con la cuarta parte de esta Súper Mega Guía para crear de forma rápida y fácil páginas, post, landing pages con estilos únicos y profesionales en WordPress de la mano de este increíble plugin de la empresa Thrive Themes.

Tienes una idea y te gustaría plasmarla en un proyecto web, pero no puedes contratar a un diseñador web, no te preocupes yo se que los comienzos son duros y más en estos tiempos que nos tocan vivir, es por eso que cree esta Súper Mega Guía para que puedas diseñar tu mismo la web de tus sueños en minutos, en WordPress y sin saber programación.

Aclarado el tema ahora estás en la cuarta parte de la Súper Mega Guía de Thrive Content Builder esta vez te voy a enseñar funciones específicas que tienen un potencial impresionante, para que puedas darle un toque más profesional a tus post, paginas y landing page.

Si no has visto la primera, segunda y tercera parte de esta Súper Mega Guía te recomiendo que empieces por el principio aquí debajo te dejo los enlaces y no te pierdas el Mega Tutorial en Español de Thrive Architect la evolución más esperada de Thrive Content Builder:

¡Allá vamos! Con Thrive Content Builder 4 mega tutorial...

NOTA: El precio del plugin Thrive Content Builder (que ahora se llama Thrive Architect) puede variar desde el momento que se creó este artículo. Puedes ver el precio actualizado en el siguiente enlace: Precio actual de Thrive Suite.

Event Manager - Administrador de eventos

Thrive Content Builder 4

Animation - Animación

thrive content builder 4
thrive content builder 4
thrive content builder 4

Thrive Content Builder 4

Una de las funciones más atractivas que trae de serie Thrive Content Builder es el Event Manager (Administrador de eventos) que es nada y nada menos el poder aplicar animaciones a ciertos contenidos como pueden ser imágenes, textos y cajas contenedoras.

Como verás en la imagen superior, están descritos todos los pasos. Es realmente simple, este mismo procedimiento es aplicable a textos y cajas contenedoras. Cuando aparezca el botón Event Manager en el editor flotante quiere decir que se puede aplicar una animación a dicho contenido y por el contrario, si no apareciera el botón, quiere decir que no se puede aplicar animaciones al contenido actual.

Puedes elegir cuando se mostrarán las animaciones aplicadas. En el ejemplo de la imagen superior está configurado para que muestre el objeto animado cuando te desplaces por el área (Come into viewport) donde se encuentra la imagen, texto o caja lo puedes ver claramente en el Paso 7.

Pero también puedes hacer que se muestre la animación cuando el usuario pase el puntero del ratón por encima, para lograr esto tendrás que elegir la opción Mouseover en el Paso 7.

La otra opción que tienes disponible es clic la puedes ver en el Paso 7, esto quiere decir que la animación se mostrará cuando el usuario cliquee sobre la imagen, texto u otro objeto donde hayas aplicado la animación.

Una vez que tengas claro cuando mostraras la animación tienes que elegir el efecto animado que le darás y para esto dispones de una abanico amplio de posibilidades como se muestra en el Paso 9, de izquierda o derecha, arriba o abajo, desvanecimiento, zoom etc, al hacer clic en los efectos puedes ver debajo un previo de como se vería ¡Impresionante no te parece!

Para finalizar tienes que hacer clic en el botón Close como se muestra en el Paso 11.

webempresa hosting wordpress

El hosting en el que confío para mis proyectos (y para esta web).

Llevo con Webempresa desde 2014. Su soporte en español, su velocidad y su seguridad son diferenciales.

  • Soporte técnico 24/7: Gente real, en español, que sabe de WordPress y te ayuda de verdad.
  • Velocidad: Discos NVMe, Magic Cache y Cloudflare integrado.
  • Seguridad: Copias de seguridad cada 4 horas, anti-malware y reglas específicas para WordPress.
  • Staging gratuito: Prueba cambios sin miedo a romper nada.
  • Dominio gratis el primer año.
  • Certificado SSL gratis por siempre.
  • IA incluida en todos los planes.
  • Garantía de 45 días: Si no estás contento, te devuelven el dinero.

Si usas mi enlace, a ti te cuesta lo mismo y a mí me ayudas a seguir creando contenido gratuito. ¡Gracias!"

Zoom Image - Ampliar imagen

Thrive Content Builder 4

thrive content builder 4

Thrive Content Builder 4

Como te habrás dado cuenta del Paso 1 al Paso 6 el procedimiento es el mismo la diferencia está en el Paso 7 donde tendrás que elegir clic (amplia la imagen cuando el usuario hace clic sobre la misma) y luego en el Paso 8 debes elegir la opción Zoom Image (Ampliación de imagen).

Para finalizar haces clic en Close (Cerrar) como se muestra en el Paso 9. 

El Paso 10 y Paso 11 puedes editar el evento o eliminarlo completamente ¡A que ha sido fácil!

Tooltip - Globo de texto

Thrive Content Builder 4

thrive content builder 4

Thrive Content Builder 4

Ahora vamos a configurar los Tooltip que son globos de texto que se muestran al pasar el ratón por un objeto determinado, del Paso 1 al Paso 6 el procedimiento es el mismo la diferencia está en el Paso 7 donde tendrás que elegir Mouseover (se muestra al pasar el ratón por encima del objeto) y luego en el Paso 8 debes elegir la opción Tooltip (Globo te texto).

Verás una ventana de configuración diferente a las anteriores pero no te agobies por que es súper fácil, en el Paso 9 tienes un campo para rellenar con el texto que quieras mostrar, en el Paso 10 puedes elegir el color de fondo que tendrá el Tooltip Light (claro) o Dark (oscuro) y en el Paso 11 la dirección del Tooltip que puede ser Top (arriba) Bottom (abajo) Left (izquierda) Right (derecha) etc.  

En el Paso 12 puedes ver en tiempo real como se vería tu globo te texto solo tienes que pasar el puntero del ratón por encima del texto Hover for preview.

Finalizamos en el Paso 13 haciendo clic en el botón Save Event (Guardar evento).

Por último te queda cerrar la ventana haciendo clic en el botón Close (cerrar) como indica el Paso 14, pero también puedes editar el evento o eliminarlo completamente como se muestra en el Paso 15 y Paso 16.

Abajo puedes ver los Tooltip (globos de texto) funcionando en diferentes direcciones y colores, solo tienes que pasar el puntero del ratón por encima de las imágenes.

Thrive Suite
Thrive Suite: todo lo que necesitas para hacer crecer tu web
  • Accede a 9 plugins (Thrive Architect, Theme Builder, Leads, Apprentice, Automator y más) más los que salgan en el futuro. Todo integrado, sin conflictos.
Precio normal
$599
$299
¡Ahorra $300!
  • Ahora $299 / año - $99 / 3 meses
  • Ahorra $300 con tu membresía anual.
  • 30 días de garantía: si no te convence, te devuelven el dinero.
  • Soporte premium y actualizaciones ilimitadas.

Si usas mi enlace, a ti te cuesta lo mismo y a mí me ayudas a seguir creando contenido gratuito. ¡Gracias!

Nota: Los precios pueden variar según divisa e IVA. Consulta la web oficial para el precio exacto en tu país.

Tooltip en acción

thrive content builder 4

Tooltip - Mouseover (pasa el ratón por encima de la imagen y se mostrara un globo te texto entrando desde la derecha)

thrive content builder 4

Tooltip - Mouseover (pasa el ratón por encima de la imagen y se mostrara un globo te texto entrando desde arriba con fondo claro)

thrive content builder 4

Tooltip - Mouseover (pasa el ratón por encima de la imagen y se mostrara un globo te texto entrando desde abajo con fondo oscuro)

Dale un toque animado a tu web con Thrive Content Builder 4, el cielo es el límite. ¡Mega tutorial en español!

¡Compártelo!

Open Thrive Lightbox - Abrir Pop-Up

Thrive Content Builder 4

thrive content builder 4

Thrive Content Builder 4

Otra de las opciones disponibles en el Event Manager (administrador de eventos) es la posibilidad de mostrar formularios de suscripción con Open Thrive Lightbox (abrir Pop-Up).

  • Del Paso 1 al Paso 6 el procedimiento es el mismo que los anteriores, cambia en el Paso 7 y el Paso 8 donde debes elegir clic, además en el menú desplegable la opción Open Thrive Lightbox (Abrir Pop-Up).
  • Paso 9: debes elegir un Thrive Lightbox que hayas creado previamente, si no tienes ninguno creado el menú desplegable no mostrará nada y tendrás que seguir en el Paso 10 para poder crear uno. En el próximo apartado te voy a enseñar a crear Thrive Lightboxes para que los tengas disponibles cuando quieras.
  • Paso 10: si no tienes ningún Thrive Lightbox lo puedes crear desde Create New Lightbox. 
  • Paso 11: puedes añadir una animación al Thrive Lightbox y en el Paso 12 puedes ver en tiempo real el efecto aplicado.
  • Paso 13: hacer clic en el botón Save Event (guardar evento) y en el Paso 14 debes hacer clic en el botón Close (Cerrar). ¿Qué te ha parecido? De tan fácil era difícil.

Thrive Lightboxes - Creación de formularios Pop-Up

Thrive Content Builder 4

Thrive Lightbox - Formularios Pop-Up

thrive content builder 4

Thrive Content Builder 4

Una de las funciones interesantes que tiene Thrive Content Builder es la posibilidad de generar formularios de suscripción y poder desplegarlos en ventanas emergentes (Pop-Up), tanto en páginas y post cuando lo necesites.

Para lograr esto tenemos a Thrive Lightboxes que te permitirá crear cajas de formularios para utilizarlos donde quieras y cuando quieras.

En la imagen superior puedes ver los pasos a seguir para crear tu Lightbox. Como verás, es muy sencillo y tiene un potencial tremendo para la captación de suscriptores de tu sitio web.

Tienes que tener en cuenta que debes tener previamente configurado el elemento Lead Generation para que funcione el formulario. Si todavía no lo has hecho, no te preocupes, te enseño a configurarlo en este enlace: Lead Generation (Formularios para la captación de suscriptores)

Si además tienes la plantilla o Theme Performag, dispones de una herramienta llamada Thrive Opt-In. En el siguiente enlace te muestro como funciona: Como crear un formulario para captar suscriptores con Thrive Opt-In

Final de Event Manager

Thrive Content Builder 4

¡Llegamos al final de Events Manager! Espero que esta Súper Mega Guía te sirva de referencia y como material de consulta cuando te surjan dudas. Ese era mi objetivo y creo que lo he cumplido.

Esta es la cuarta parte de esta Súper Mega Guía. En ella he tratado de simplificar al máximo todos los procedimientos, aunque a veces parecieran demasiado obvios, pero el fin de esta guía es llegar a todos los usuarios para que puedan sacarle el máximo potencial a esta herramienta que se llama Thrive Content Builder. Si lo compras no te arrepentirás, tendrás un mundo nuevo a tus pies que dará rienda suelta a la creatividad que llevas dentro y te dará la satisfacción de crear algo por ti mismo y eso no tiene precio.

Ahora mismo, puedes descargarte el curso completo de Thrive Architect "Gratis" totalmente en español, con infografías y vídeos tutoriales muy didácticos para que exprimas a fondo esta magnífica herramienta que es Thrive Content Builder que ahora se llama Thrive Architect y que te cambiará la vida como blogger ¡Te lo aseguro!

Thrive Architect Mega Tutorial en Español

Preguntas frecuentes sobre Thrive Content Builder 4

¿Este Thrive Content Builder 4 sigue vigente hoy en día?

El tutorial sigue siendo útil como material de consulta porque los conceptos fundamentales de los Advanced Elements se mantienen en Thrive Architect, que es la evolución de Thrive Content Builder. Sin embargo, Thrive Content Builder ya no existe como producto independiente: fue renombrado a Thrive Architect y ahora forma parte de Thrive Suite. Si quieres aprender la versión actual, te recomiendo el Thrive Architect tutorial en español.

¿Thrive Content Builder sigue existiendo o ahora se llama Thrive Architect?

Thrive Content Builder fue el nombre que tuvo el plugin durante la primera etapa de desarrollo. Hoy, ese mismo plugin ha evolucionado y se llama Thrive Architect. La esencia es la misma (editor visual, arrastrar y soltar, elementos de conversión), pero Thrive Architect es más rápido, más flexible y cuenta con mejoras en la maquetación responsive. Si estabas buscando tutoriales de Thrive Content Builder, buena parte de lo que aprendas te servirá directamente en Thrive Architect.

¿Qué es el Event Manager de Thrive Content Builder 4 y para qué sirve?

El Event Manager es la herramienta integrada en Thrive Content Builder que te permite aplicar animaciones y acciones interactivas a cualquier elemento de tu página: imágenes, textos, botones o cajas contenedoras. Con ella puedes hacer que un elemento aparezca al hacer scroll, se amplíe al hacer clic o muestre un globo de texto al pasar el ratón. Es la forma más sencilla de dar vida a tus páginas sin escribir una sola línea de código.

¿Cómo puedo aplicar animaciones a mis elementos con Thrive Content Builder 4?

Para aplicar una animación, selecciona el elemento que quieras animar y busca el botón Event Manager en el editor flotante. Si el botón aparece, el elemento admite animaciones. Desde ahí puedes elegir cuándo se dispara la animación: cuando el elemento entra en pantalla (Come into viewport), al pasar el ratón por encima (Mouseover) o al hacer clic. Después, selecciona el efecto que prefieras entre las opciones disponibles (deslizamiento, desvanecimiento, zoom, etc.). Guarda el evento y listo.

¿Cómo creo un Tooltip o globo de texto con Thrive Content Builder 4?

Los Tooltips son globos de texto que aparecen al pasar el ratón sobre un elemento. Para crearlos con Thrive Content Builder 4, selecciona el elemento, abre el Event Manager y elige la opción Mouseover. En el menú desplegable de acciones, selecciona Tooltip. Se abrirá una ventana donde podrás escribir el texto del globo, elegir el color de fondo (claro u oscuro) y definir la dirección en la que aparece (arriba, abajo, izquierda o derecha). Puedes previsualizarlo en tiempo real antes de guardar.

¿Qué diferencia hay entre el Zoom Image y el Tooltip en Thrive Content Builder 4?

Ambos son acciones del Event Manager, pero funcionan de forma distinta. Zoom Image amplía una imagen cuando el usuario hace clic sobre ella. Tooltip muestra un pequeño globo de texto al pasar el ratón por encima, sin necesidad de hacer clic. Puedes combinar ambas acciones en un mismo elemento si lo necesitas: por ejemplo, un tooltip que explique qué hace la imagen y un zoom que la amplíe al hacer clic.

¿Cómo configuro un Thrive Lightbox para mostrar un formulario de suscripción con Thrive Content Builder 4?

Para mostrar un formulario emergente con Thrive Content Builder, primero debes tener creado un Thrive Lightbox. Si no lo tienes, puedes crearlo desde el propio Event Manager seleccionando la acción Open Thrive Lightbox. Una vez creado, edítalo con Thrive Architect para insertar el elemento Lead Generation con tu formulario de suscripción. Después, desde el Event Manager de cualquier botón o enlace, configura la acción Open Thrive Lightbox y selecciona el lightbox que acabas de crear. Así, al hacer clic, se abrirá la ventana emergente con el formulario.

¿Por qué no se muestra la animación o el Lightbox que he configurado con Thrive Content Builder 4?

Si la animación o el Lightbox no se muestra, revisa estos tres puntos: primero, asegúrate de que el elemento tiene el botón Event Manager disponible (si no aparece, ese elemento no admite animaciones). Segundo, comprueba que has guardado el evento correctamente. Tercero, verifica que no haya un conflicto con la caché del navegador o del plugin de caché de tu web; prueba a vaciar la caché y recargar la página. Si el problema persiste, revisa que el Thrive Lightbox esté publicado y visible.

¿Cuál es la diferencia entre Countdown y Countdown Evergreen en Thrive Content Builder 4?

El elemento Countdown es una cuenta regresiva con fecha fija: todos los visitantes ven el mismo tiempo restante y cuando llega a cero, termina para todos. El Countdown Evergreen, en cambio, es un temporizador que se reinicia para cada visitante: el tiempo empieza a contar cuando el usuario llega a la página y dura la cantidad de días que hayas configurado. El primero es ideal para lanzamientos con fecha concreta; el segundo, para promociones permanentes que quieres que cada usuario sienta como propias.

¿Dónde encuentro las siguientes partes de este tutorial de Thrive Content Builder?

Las siguientes partes del tutorial están publicadas en el mismo blog:

  • Parte 1: Simple Content Elements (Paragraph/Text, WordPress Content, Image, Button, Icon, Credit Card Icons, Custom HTML, Custom CSS, Content Container, Content Reveal, Star Rating).
  • Parte 2: Multi-Style Elements (Content Templates, Column Layout, Content Box, Symbol Box, Social Share Buttons, Quote Share, Styled List, Divider, Testimonial, Call to Action, Guaranteed Box).
  • Parte 3: Advanced Elements (Widget, Pricing Table, Tabbed Content, Featured Grid, Content Toggle, Table, Data Elements, Google Map Embed, Countdown Timer, Responsive Video, Table of Content, Lead Generation, Post Grid, Comments).
thrive suite

¿Ya dominas las animaciones y los pop-ups? Es hora de conocer la evolución definitiva.

Has completado el viaje por Thrive Content Builder: desde los elementos básicos hasta las animaciones, tooltips y lightboxes. Ese poder era impresionante… pero TCB evolucionó para convertirse en Thrive Architect, una herramienta más rápida, más visual y con un ecosistema completo detrás.
Y lo mejor: Thrive Architect es solo una pieza de Thrive Suite, el ecosistema que integra:
  • Thrive Architect (la versión moderna y más rápida de TCB).
  • Thrive Theme Builder para diseñar tu tema visualmente.
  • Thrive Leads para captar suscriptores.
  • Thrive Apprentice para vender cursos.
  • Y mucho más: 9 plugins integrados, sin conflictos.
No te quedes con la versión clásica. Da el salto a la nueva generación.
  • Editor visual más rápido e intuitivo que TCB.
  • Ahorra $300 en tu membresía anual por tiempo limitado.
  • 30 días de garantía: si no te convence, te devuelven el dinero.

"Si usas mi enlace, a ti te cuesta lo mismo y a mí me ayudas a seguir creando contenido gratuito. ¡Gracias!"

Tu lugar para Crear

Donde tus ideas toman forma

Aprende a dominar WordPress - Thrive Suite y GeneratePress con tutoriales prácticos y cursos gratuitos. Diseña páginas que convierten, construye embudos y haz crecer tu proyecto paso a paso.

¿Te ha gustado? Sigamos creando juntos.

Aquí tienes más contenido para seguir aprendiendo.

Cómo Crear un Embudo de Ventas Completo con Thrive Suite (Sin Programar)
Thrive Apprentice: Goteo de Capítulos Completos y Fechas de Desbloqueo Automáticas
¡Me encantaría saber qué piensas!
  1. Hola, excelente el tutorial, he leido por ahi que Thrive content builder tiene algun inconveniente con la configuracion del SEO…considerando que no utilizaria el editor de WordPress, como se haria dicha configuracion? Gracias!

    1. Hola, Paco y bienvenido a nuestra comunidad que por cierto va creciendo día a día.

      Gracias por tus palabras me alegro mucho que te halla sido de utilidad ese era mi objetivo.

      Con respecto a la duda que me planteas Thrive Content Builder tenía ciertas incompatibilidades en versiones anteriores pero los chicos de thrivethemes que ni lerdos ni perezosos se pusieron a trabajar para solucionar algunos inconvenientes que había en la configuración.

      Si hay algo de destacar es que los desarrolladores de thrivethemes trabajan constantemente corrigiendo fallos y añadiendo mejoras en todos sus productos de forma permanente y eso es un valor añadido.

      Yo estoy utilizando en este momento el plugin YOAST para el SEO y no he tenido inconvenientes, al principio te puede parecer raro por que verás el editor clásico de WordPress vacío pero con el tiempo te acostumbras, el panel de configuración de YOAST sigue estando en su lugar solo tienes que rellenar los campos de titulo descripción y palabra clave.

      Para editar el contenido solo debes cliquear sobre el botón Edit whith Thrive Content Builder (Editar con Thrive Content Builder) y de esa forma podrás hacer las correcciones que te sugiere el analizador de contenidos de YOAST..

      En resumen el plugin YOAST con TCB ahora funciona bien.

      Muchas gracias por tu comentario y nuevamente bienvenido a nuestra comunidad.
      Saludos.

    1. Por nada Paco cualquier duda que te vaya surgiendo puedes plantearla en los comentarios para que la web se retro-alimente y pueda de esta manera seguir mejorando los contenidos de las guías o crear nuevas si fuera necesario y de esta forma poder compartirlo con el resto de la comunidad de suscriptores. 🙂

      Saludos.

Comments are closed.

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
thrive architect curso gratis

¿Quieres crear la web de tus sueños sin escribir ni una línea de código?

Con Thrive Architect puedes diseñar páginas profesionales arrastrando y soltando, desde el primer día y sin complicaciones. Te regalo mi Curso Completo de Thrive Architect en PDF (más de 400 páginas) para que lo domines paso a paso.