Otter Blocks – Gutenberg Blocks, Page Builder for Gutenberg Editor & FSE

Descripción

Otter es un plugin maquetador de páginas con bloques de Gutenberg que añade funcionalidad adicional al editor de bloques de WordPress (también conocido como Gutenberg) para ofrecer una mejor experiencia de creación de páginas sin necesidad de maquetadores de páginas tradicionales como Elementor y Divi.

Enlaces rápidos 🔗

• ¿Quieres ver los bloques de Otter en acción antes de instalarlos? VER LA DEMO DE OTTER BLOCKS
• ¿Eres nuevo en el ecosistema de bloques de Gutenberg? Consulta nuestro artículo sobre GUTENBERG EXPLICADO
• ¿Necesitas ayuda con la configuración? Echa un vistazo a nuestra DOCUMENTACIÓN
• ¿Te interesa Otter Pro? Aquí tienes más detalles sobre OTTER PRO

Con Otter Blocks, obtienes acceso a

• Más de 20 bloques adicionales para Gutenberg
• Colección de patrones
• Plantillas de página completa
• Condiciones de visibilidad
• CSS personalizado
• Animaciones
• Contenido dinámico y más

Para todos los bloques, incluidos los bloques de terceros presentes en tu sitio web.

La función de CSS personalizado para bloques permite modificar directamente las propiedades CSS de cualquier bloque de Gutenberg en la página, mientras que la función de animación hace que sea rápido y sencillo añadir animaciones a cualquier bloque para mejorar el atractivo visual de las distintas secciones y bloques de tu página.

Con la función de condiciones de visibilidad de Otter, puedes establecer qué condiciones deben cumplirse para que los bloques elegidos se muestren en la página.

La biblioteca de patrones contiene una variedad de elementos diferentes en diversos estilos para ayudarte a crear páginas excelentes. Cubre todas las áreas más importantes de tu sitio web: cabeceras, testimonios, tablas de precios, secciones y mucho más.

Echa un vistazo a un resumen rápido de Otter Blocks

¿Cómo pueden ayudarte los bloques de Gutenberg de Otter? 🤔

Un plugin de bloques de Gutenberg para WordPress

¡Otter añade más de 26 bloques increíbles y útiles para que la creación de páginas en Gutenberg sea muy fácil!

Más que solo diseños, necesitas opciones avanzadas de personalización para tener control sobre el estilo y la apariencia. Con Otter, lo tienes todo.

Cada bloque cuenta con compatibilidad de personalización para ayudarte a dar estilo a tu sitio según tu visión:

• Controles de color principal, acentos y fondos.
• Animaciones de retroceso, rebote, desvanecimiento, giro, rotación, desplazamiento, deslizamiento, velocidad de la luz y muchas más con el clic de un botón.
• Controles de tipografía desde el espaciado hasta la elección de la fuente.

Tu asistente de IA para el editor de bloques

Otter integra la IA directamente en el editor de bloques para ayudarte a construir, no solo a editar. Describe lo que quieres y Otter lo creará como bloques reales y editables.

• Generador de contenido por IA: Genera una sección completa o una página entera a partir de una simple instrucción con el bloque de IA. Elige un tipo como Principal (Hero), Características, Precios, Testimonios o Llamada a la acción, o describe el tuyo propio. Otter se ajusta a los colores de tu tema y al estilo actual de tu página, por lo que el resultado encaja perfectamente con tu marca.

• Barra de herramientas de IA: Selecciona cualquier texto para reescribirlo, resumirlo, ampliarlo, acortarlo, traducirlo, cambiarle el tono, corregir su gramática o simplificarlo, todo ello sin salir de la página. También puedes crear tus propias acciones personalizadas con tus propias instrucciones y reordenar la barra de herramientas para adaptarla a tu flujo de trabajo.

• Respuesta automática de formularios por IA [PRO]: Responde a cada envío de formulario con un mensaje personalizado redactado por IA. Escribe una instrucción utilizando los campos de tu formulario, define un mensaje de reserva y deja que la IA se encargue del resto.

• Conectores de IA nativos de WordPress: La IA de Otter funciona con los adaptadores de IA nativos de WordPress 7.0, por lo que conectas tu proveedor de IA preferido una sola vez y todas las funciones de IA de Otter lo utilizan.

Adaptabilidad móvil de Otter Blocks

Crea diseños optimizados para dispositivos móviles con los ajustes de respuesta integrada de Otter. Cada bloque se puede modificar para brindar una experiencia uniforme para dispositivos móviles, tabletas y ordenadores.

Un plugin de condiciones para bloques de Gutenberg en WordPress

¿Quieres mostrar ciertos bloques únicamente cuando un usuario ha iniciado o cerrado sesión? ¿Y si son clientes de tu tienda frente a editores de tu blog o cualquier otro perfil de usuario? Con la función de condiciones de bloques de Gutenberg disponible en Otter, es posible. Actualiza a la versión PRO de Otter para desatar todo el potencial de más condiciones de bloques, tales como:

• Cadena de consulta de URL
• Rango de fechas
• Día de la semana
• Hora del día
• Productos en el carrito de WooCommerce
• Total gastado en WooCommerce
• Total del carrito de WooCommerce
• Categorías de WooCommerce
• Etiquetas de WooCommerce
• Atributos de WooCommerce
• Basado en cookies
• Y mucho más

Un plugin de animación para bloques de Gutenberg en WordPress

Sorprende a los visitantes de tu sitio web con animaciones increíbles que se pueden añadir a cualquier bloque de la página. Con más de 50 animaciones disponibles para elegir, Otter hace posible añadir un toque especial a cualquier entrada o página de tu sitio web.

Un plugin de ventanas emergentes de Gutenberg para WordPress

Las ventanas emergentes son una de las técnicas más clásicas de la web para captar clientes potenciales y transmitir avisos. ¡Con el bloque de ventanas emergentes para Gutenberg disponible en Otter, puedes crear popups formados por cualquier otro bloque disponible en Gutenberg!

Ajusta con precisión tus ventanas emergentes configurando cuándo deben aparecer y cómo se pueden cerrar. Con nuestro bloque de ventanas emergentes, obtienes acceso a múltiples activadores, como al cargar, al salir, al hacer clic en un anclaje y al desplazar la página.

Además, puedes diseñar tu ventana emergente con superposiciones personalizadas para alinearla con la identidad de tu marca y captar más la atención. Ver la demo en directo

Valores predeterminados globales para los bloques de Otter

¿Estás cansado de tener que configurar siempre las mismas opciones cada vez que añades un bloque a la página? Con Otter, puedes establecer la configuración por defecto para algunos de los bloques más utilizados, como el bloque de sección, el bloque de icono, el encabezado avanzado y muchos más.

Bloques disponibles en Otter:

Bloque de acordeón para Gutenberg [GRATIS]

Usa este bloque para crear listas de contenido apiladas verticalmente que se puedan mostrar u ocultar con el clic de un botón, más conocidas como acordeones. Ver la demo en directo

Bloque de encabezado avanzado para Gutenberg [GRATIS]

El bloque de encabezado que no sabías que necesitabas. Este bloque de Otter incluye todas las funciones del bloque de encabezado por defecto junto con otras capacidades adicionales, como la posibilidad de cambiar la fuente, resaltar partes del texto y mucho más. Ver la demo en directo

Bloque de IA [GRATIS]

Diseña con IA, directamente en el editor. Describe la sección o página que quieras y el bloque de IA la generará como bloques de Gutenberg reales y editables, adaptados a los colores de tu tema y al estilo de tu página. Ajusta cualquier cosa a mano después, igual que harías con los bloques creados por ti.

Bloque de grupo de botones para Gutenberg [GRATIS]

Crea múltiples botones de forma rápida y sencilla y muéstralos en vertical o horizontal según el dispositivo desde el que se visualice la página. Ver la demo en directo

Bloque de cuenta atrás para Gutenberg [GRATIS]

¿Estás haciendo la cuenta atrás para un gran evento? Muéstralo haciendo uso de estos bloques de Gutenberg. Cuenta atrás desde días, horas, minutos o segundos. Ver la demo en directo

Bloque de formulario de contacto para Gutenberg [GRATIS]

Inserta rápida y fácilmente un formulario de contacto en cualquier lugar de la página. Opcionalmente, convierte el formulario en una máquina de captación de clientes potenciales integrándolo con Brevo (Sendinblue) o Mailchimp. Además, optimiza la gestión de datos con la integración de webhooks y garantiza una mayor seguridad con la integración de hCaptcha. Ver la demo en directo

Bloque de línea de tiempo de contenido [GRATIS]

Muestra eventos de forma elegante en una línea de tiempo cronológica. Ideal para destacar eventos históricos, pasos de un proceso o hitos clave.

Bloque de carrusel de contenidos [GRATIS]

Un carrusel donde cada diapositiva puede contener cualquier bloque de Gutenberg, no solo imágenes. Añade encabezados, texto, botones, imágenes o diseños completos como tarjetas de testimonios, precios o características dentro de cada diapositiva, y permite que los visitantes se desplacen por ellas con flechas o puntos. A diferencia de un carrusel de imágenes estándar, el carrusel de contenidos convierte cualquier cosa que construyas en Gutenberg en un carrusel deslizable, sin necesidad de ningún plugin adicional.

Bloque de cuenta atrás [GRATIS]

¿Estás haciendo la cuenta atrás para un gran evento? Muéstralo haciendo uso de estos bloques de Gutenberg. Ver la demo en directo

Bloque de progreso circular [GRATIS]

Muestra tu progreso con un magnífico bloque de contador circular. Ver la demo en directo

Bloque de caja con volteo [GRATIS]

Crea una tarjeta con efecto de volteo, en la que puedes insertar cualquier contenido o bloque disponible en Gutenberg. Ver la demo en directo

Bloque de lista de iconos para Gutenberg [GRATIS]

Dale vida a las aburridas listas de puntos utilizando iconos personalizados como viñetas. Ver la demo en directo

Bloque de icono para Gutenberg [GRATIS]

Muestra cualquier icono de Font Awesome o de nuestra propia lista de iconos personalizados en cualquier lugar de la página. Cambia los colores, añade bordes y combínalo con otros bloques para mejorar el aspecto de tu página. Ver la demo en directo

Bloque de animación Lottie para Gutenberg [GRATIS]

¿Has oído hablar de Lottie? ¡Genial! Con el bloque de animación Lottie de Otter para Gutenberg, puedes mostrar animaciones Lottie en cualquier lugar de Gutenberg. Ver la demo en directo

Bloque de mapas para Gutenberg [GRATIS]

Elige entre un bloque de OpenStreetMap o de Google Maps y crea marcadores para los puntos de interés destinados a los visitantes de tu sitio web. Nuestro bloque de mapas te ayuda a personalizar la experiencia cartográfica hasta el último detalle, como el color y la descripción de los marcadores, buscar lugares por nombre o coordenadas, añadir y eliminar controles del mapa, o cambiar el tamaño y el estilo de los mapas con unos pocos clics. Ver la demo en directo

Bloque de barra de progreso [GRATIS]

Muestra tu progreso con un magnífico bloque de barra de progreso. Ver la demo en directo

Bloque de entradas para Gutenberg [GRATIS]

Utiliza este bloque para insertar elementos de entradas, páginas y tipos de contenido personalizado en la página actual que estés editando. El bloque de entradas permite mostrar un número determinado de publicaciones en diferentes páginas. Las opciones de personalización disponibles para este bloque cubren áreas como estilos, tipos de contenido, ajustes, diseños y maquetación.

Bloque de reseña de producto para Gutenberg [GRATIS]

¿Escribes en un blog sobre un producto que te encanta? ¿O tal vez gestionas una web de reseñas? Utiliza este bloque para crear una tabla de reseñas del artículo y enumerar sus características, pros y contras, así como enlaces de compra opcionales. Ver la demo en directo

Bloque de ventana emergente para Gutenberg [GRATIS]

Crea ventanas emergentes impresionantes y ajusta con precisión cuándo deben aparecer y cómo se pueden cerrar. Ver la demo en directo

Bloque de carrusel para Gutenberg [GRATIS]

Utiliza este bloque de Gutenberg para crear carruseles de imágenes en cualquier página de Gutenberg. La configuración incluye la altura del carrusel, la pausa, las diapositivas por página, la reproducción automática y mucho más. Ver la demo en directo

Bloque de sección para Gutenberg [GRATIS]

¡Un bloque de columnas mejorado! Este bloque te permite crear una sección con hasta 6 columnas, cada una de las cuales puede tener un color de fondo, imagen o degradado personalizados. Utiliza las funciones adaptables de este bloque para definir el relleno (padding) y el margen en pantallas de escritorio, tabletas y móviles. Ver la demo en directo

Pago con Stripe [GRATIS]

Este bloque te resultará muy útil si quieres vender un par de productos sin necesidad de configurar una tienda completa, como libros electrónicos, algunas licencias, etc.

Bloque de iconos para compartir [GRATIS]

Botones para que los visitantes de tu sitio web compartan contenido en cualquier servicio de redes sociales. Ver la demo en directo

Bloque de pestañas para Gutenberg [GRATIS]

Usa este bloque para crear listas de contenido apiladas horizontalmente que se puedan mostrar u ocultar con el clic de un botón, más conocidas como pestañas. Ver la demo en directo

Bloque de añadir al carrito para Gutenberg [PRO]

Añade un bloque de botón de añadir al carrito para cualquier producto de WooCommerce en cualquier lugar de la entrada o página que estés editando.

Bloque de horario comercial para Gutenberg [PRO]

Crea una tabla de horarios comerciales con un diseño elegante y ajusta su configuración hasta que quede perfecta.

Búsqueda en directo [PRO]

La función de búsqueda en directo mejora el bloque principal de búsqueda añadiendo dos atributos adicionales (isLive y postTypes) que se pueden configurar dentro del inspector en el panel de búsqueda en directo.

Modal [PRO]

Implementa ventanas modales para ofrecer una experiencia interactiva, mostrando formularios, contenido o anuncios directamente dentro de la maquetación de la página.

Tabla de comparación de reseñas [PRO]

Prepárate para impresionar a tus lectores con el bloque de «tabla de comparación de reseñas» de Otter. Crea sin esfuerzo tablas de comparación de productos de aspecto profesional para tu blog o sitio web.

Añadimos constantemente nuevos bloques de Gutenberg a Otter para ayudarte en la creación de páginas de tu sitio web. No dudes en decirnos qué echas en falta en nuestro foro de soporte. Otros bloques incluyen:

Patrones y plantillas de página completa listos para importar en Otter:

Lanza tu sitio web fácilmente con nuestros patrones personalizables y plantillas de WordPress de página completa. Importa diseños predefinidos con un solo clic y empieza en un abrir y cerrar de ojos.

Explora una amplia variedad de patrones de Otter y plantillas de páginas completas para servicios, testimonios, precios, características, secciones de llamadas a la acción y mucho más. Echa un vistazo a los diseños disponibles aquí.

Obtén más opciones en Otter Pro 🤩

Bloques del maquetador WooCommerce

Crea páginas de producto individuales personalizadas utilizando los bloques de WooCommerce Builder de Otter. Todas las nuevas funciones están diseñadas para maximizar tu tasa de conversión y aportar más mejoras.

Con Otter Pro, obtienes muchas más funciones, entre ellas:

• Bloque «Añadir al carrito»
• Bloque de horario comercial
• Bloque modal
• Bloque comparativo de valoración de productos
• Bloque de búsqueda en directo
• Extensiones Pro para bloques gratuitos
• Más opciones de contenido dinámico
• Más opciones de condiciones de visibilidad
• Más patrones y plantillas de página completa
• ¡y más!

Puedes probar una demo en directo de Otter Blocks, sin necesidad de configuración. Haz clic aquí para probarla.

¿Para quién es Otter? 👀

• Cualquier persona que busque exprimir al máximo las mejores funciones del nuevo editor de Gutenberg con bloques útiles y fáciles de usar.
• Cualquier persona que esté pensando en dejar atrás los maquetadores de páginas tradicionales como Elementor y Divi Builder en favor del nuevo editor de bloques de Gutenberg.
• Cualquier persona que intente crear páginas rápidas en Gutenberg en tiempo récord.
• Cualquier persona que intente ocultar o mostrar bloques de Gutenberg en función de condiciones como el estado de inicio o cierre de sesión del usuario.
• Cualquier persona que intente añadir animaciones a los bloques de Gutenberg.

Veamos algunos casos de uso 🚀

¡Otter abre un mundo de oportunidades! Descubre cómo los diferentes perfiles de usuarios pueden sacarle el máximo partido:

• Blogueros de viajes: Mejora tu blog de viajes con mapas cautivadores utilizando los bloques de mapas y de Google Maps de Otter para mostrar tus trayectos al mundo.

• Organizaciones sin ánimo de lucro: Involucra a tu audiencia y promueve tu causa con los bloques de contador circular y de testimonios de Otter para compartir historias de éxito inspiradoras.

• Propietarios de restaurantes: Muestra los menús de tu restaurante y recopila reservas fácilmente con los bloques de tarjeta con volteo y de formulario de Otter para lograr una presencia online irresistible.

• Analistas de productos tecnológicos: Presenta análisis detallados de productos con la reseña de producto de Otter, haciendo que tu contenido sea informativo y cautivador.

• Blogueros: Mejora las entradas de tu blog con iconos para compartir, ofreciendo opciones sencillas para que tus lectores compartan contenido. Utiliza el carrusel para mostrar galerías de imágenes y captar la atención de tu audiencia.

• Creadores de contenido y vendedores de productos digitales: El bloque de pago de Stripe para Gutenberg ofrece una forma cómoda de vender productos digitales, como libros electrónicos, cursos online, licencias de software o arte digital, sin necesidad de configurar una tienda online completa. Al integrar este bloque, puedes ofrecer una experiencia de pago optimizada y segura a tus clientes.

• Analistas de productos: Crea comparativas de análisis de productos informativas y atractivas con una tabla de comparación de reseñas, ayudando a los usuarios a tomar decisiones informadas.

• Propietarios de restaurantes: Muestra el horario de tu negocio con un formato elegante utilizando el bloque de horario comercial, facilitando que tus clientes te encuentren.

• Directorios en línea: Sitios web que ofrecen directorios, listados o contenido extenso donde la búsqueda en directo simplifica el acceso al contenido.

Soporte 🤝

Estamos aquí para ayudar. No dudes en abrir un nuevo hilo en el foro de soporte.

Documentación 📚

Descubre cómo aprovechar al máximo Otter Blocks con nuestra documentación detallada y fácil de usar.

Conviértete en colaborador 💁‍♂️

Otter Blocks es un proyecto de código abierto y ¡damos la bienvenida a los colaboradores para que formen parte de nuestra vibrante comunidad! Ayúdanos a mejorar el plugin y hacerlo aún mejor – Enlace a GitHub

Recursos útiles 📌

• …