La guía completa para usar SmartVideo con Divi Builder para el alojamiento de videos de WordPress

Para los usuarios de Divi Builder, SmartVideo les ofrece la herramienta que necesitan para brindar una experiencia de reproducción de video moderna, profesional y nativa en su sitio web.

Vivimos en la era de los poderosos temas de WordPress y creadores de páginas que lo ayudan a crear cualquier sitio web bajo el sol. Uno de esos creadores de páginas visuales y de temas es Divi Builder de la gente genial de Elegant Themes.

Si eres un usuario jurado de Divi Builder, te encantará la publicación de hoy. En unos minutos, le mostraremos exactamente cómo usar SmartVideo de Swarmify junto con Divi Builder.

Ahora no tiene que usar Vimeo o los reproductores de video cargados de enlaces de YouTube en su sitio. Le ofrecemos un reproductor de video sin desorden que se ve absolutamente increíble en su sitio web con tecnología Divi.

¿Cuáles son los beneficios directos?

• El reproductor de video SmartVideo no contiene marcas de terceros (hola, YouTube) ni enlaces que desvíen el tráfico que con tanto esfuerzo lleva a su sitio. Ahora, puede marcar sus reproductores de video para lograr esa apariencia nítida y profesional :)
• Nuestro Video CDN y la tecnología patentada EdgeAI le permiten ofrecer videos súper rápidos, sin búfer y sin errores a los visitantes de su sitio web sin importar en qué parte del mundo se encuentren. Tus usuarios te lo agradecerán.
• Usamos la misma infraestructura de transmisión de gigantes como Netflix y Hulu porque estamos totalmente comprometidos con nuestra misión. Como resultado, disfruta de videos de inicio instantáneo y sin interrupciones que lo ayudan a retener a más visitantes y aumentar sus ingresos.
• Nuestra solución de codificación de video es increíble, lo que significa que los visitantes de su sitio web disfrutan de una reproducción de video de alta calidad independientemente del dispositivo que utilicen. Di adiós a los videos incompletos que se ven terribles en diferentes pantallas y resoluciones.
• Y mucho más, como aprenderás más adelante en el artículo :)

Por ahora, aprendamos más sobre Divi Builder y cómo integrarlo con SmartVideo.

Alerta de spoiler: puede agregar el código SmartVideo a su sitio web Divi Builder manualmente, pero ahora puede omitir todas las cuestiones técnicas con nuestro nuevo complemento SmartVideo WordPress. Eso significa que puede integrar fácilmente SmartVideo con Divi Builder incluso si no puede codificar para salvar su vida.

¿Qué es Divi Builder?

Si eres nuevo, Divi es un hermoso y poderoso tema de WordPress y un generador visual de páginas. Gracias a la avanzada tecnología de creación visual, Divi te ayuda a crear sitios web de WordPress increíbles rápidamente.

Divi viene con una tonelada de diseños prefabricados que puede importar a su instalación de WordPress con un solo clic. Además de eso, tiene Divi Visual Builder que le permite personalizar su sitio web arrastrando y soltando elementos.

Así es, no necesitas conocimientos previos de codificación para crear un sitio web notable con Divi. Si eso no es suficiente, incluso puede usar dos diseños diferentes al mismo tiempo, lo que le brinda mucha libertad de diseño.

Divi viene con un montón de características increíbles que incluyen:

• Más de 40 elementos del sitio web, como botones de llamada a la acción, galerías, formularios, blogs, controles deslizantes, testimonios, etc.
• Más de 800 diseños prefabricados en diferentes nichos como negocios, comercio electrónico, tecnología, salud, etc.
• Control completo del diseño
• Diseño 100% receptivo con configuraciones adicionales para todo tipo de dispositivos
• Control CSS personalizado
• Una gran biblioteca de efectos, transiciones y estilos.
• Un millón y una opciones de diseño
• ¡Y mucho más!

La mejor parte es que cuando compras Divi, obtienes acceso a otros temas y complementos de WordPress. Elegant Themes tiene más de 700 000 clientes, por lo que está en buenas manos.

"Divi es el REY en lo que respecta a la facilidad del diseño web. Lo que antes tomaba una semana toma algunas horas y ahora todos tenemos nuestro objetivo personal de convertir todos los sitios web de nuestros clientes a Divi". -Scott Lawrence

Divi es perfecto para autónomos, agencias y propietarios de sitios web que buscan un creador de páginas visual potente, intuitivo y fácil de usar. Ya sea que sepa codificar o no, Divi es una increíble herramienta de creación de sitios web.

Dicho esto, ¿qué es SmartVideo?

¿Qué es Swarmify SmartVideo?

Para los recién llegados, Swarmify es un servicio de aceleración de video de primer nivel que lanzamos en 2013 después de días de riguroso desarrollo y pruebas.

La nuestra es una plataforma de alojamiento de video de servicio completo completa con conjuntos de herramientas de codificación, reproducción, CDN de video, entrega y distribución. Estamos orgullosos de trabajar con un número creciente de empresarios de todos los ámbitos de la vida.

Nos apasiona lo que hacemos y trabajamos incansablemente para ofrecerle videos que se cargan instantáneamente sin almacenamiento en búfer, como es la norma en muchos sitios de alojamiento de videos como YouTube, Wistia y Vimeo.

Swarmify le garantiza una reproducción de video 12 veces más rápida y un almacenamiento en búfer 8 veces menor que los reproductores de video promedio en el mercado. Nos enfocamos solo en acelerar videos, y somos bastante buenos en eso :)

Dejando a un lado el descaro, Swarmify es increíblemente fácil de integrar con varias plataformas de creación de sitios web, incluidas WordPress, Shopify y Squarespace, entre otras.

Si bien puede incrustar manualmente el reproductor de video SmartVideo en su sitio de WordPress, puede ahorrar tiempo usando nuestro revolucionario complemento SmartVideo WordPress.

El complemento es ridículamente fácil de instalar y configurar en su sitio web de WordPress + Divi Builder. ¡Ofrecerá experiencias de video rápidas y de alta calidad a sus visitantes en menos de 10 minutos!

Con esa información de fondo, ahora estamos listos para la parte divertida. En la siguiente sección, aprenderá a usar Swarmify con Divi Builder. En otras palabras, le mostramos cómo agregar un video a un diseño típico de Divi Builder.

Cómo usar Swarmify SmartVideo con Divi Builder

Para la siguiente sección, debe instalar y activar tanto el complemento SmartVideo WordPress como Divi. La instalación y activación de SmartVideo o Divi es cosa de estudiantes de cuarto grado, no esperamos que tenga ningún problema.

Si tiene Divi y SmartVideo listos, pongámonos manos a la obra. Para fines ilustrativos, estoy trabajando con el diseño de la Agencia web de Divi que se parece a esto:

Bastante ordenado, ¿verdad? Lo que haré es agregar un video SmartVideo justo debajo del título principal, que dice " Agencia de diseño web de servicio completo ". Ver imagen arriba.

¡Empecemos!

En su panel de administración de WordPress, navegue a la página que desea editar. En nuestro caso, estoy editando la página de inicio que se muestra en la captura de pantalla anterior.

Abra la página en el editor como de costumbre. Para comenzar a editar la página anterior en Divi Builder, simplemente haga clic en el botón Editar con Divi Builder , como se destaca a continuación.

Al hacerlo, se carga la página en el front-end. A continuación, haga clic en el botón Habilitar Visual Builder , como se muestra a continuación.

A continuación, desplácese hasta la sección que desea editar. En nuestro caso, estamos agregando un SmartVideo justo debajo del título principal en la parte superior de la página.

Cuando pasa el mouse sobre la sección, aparecen las opciones de edición. Simplemente haga clic en el ícono más (+) para agregar un nuevo módulo:

Al hacerlo, se abre una ventana emergente que te permite agregar un nuevo módulo Divi:

A continuación, escriba "SmartVideo" en el cuadro de búsqueda y haga clic en SmartVideo , como se muestra a continuación.

Después de eso, es hora de configurar su video usando la pestaña Configuración de SmartVideo . Como puede ver en la imagen a continuación, hay muchas opciones disponibles para usted:

En la configuración de SmartVideo , puede:

• Elija la fuente del video: puede ser la biblioteca de medios de WordPress, YouTube, Vimeo o cualquier otra fuente ( NB : si su video de YouTube está configurado como privado , cámbielo a no listado )
• Cambia el ancho y alto de tu video
• Configure un póster personalizado para su video (SmartVideo se establece de forma predeterminada en el primer cuadro de su video si no elige una imagen de póster personalizada)
• Activa o desactiva opciones como reproducción automática, bucle y silenciado
• Activar/desactivar opciones como controles de video, diseño receptivo y reproducción de video en línea para el navegador iOS Safari
• Controle el diseño de su video usando las opciones de Divi, que incluyen bordes, tamaño, espaciado, filtros, sombreado de cuadros, animaciones y mucho más :)

Una vez que haya terminado, simplemente haga clic en el botón Guardar , como detallamos a continuación:

No olvide guardar los cambios en Divi Visual Builder después de eso:

Ahora, si vemos nuestro sitio de muestra en el front-end, vemos el nuevo reproductor de video SmartVideo listo para animar la fiesta:

Para agregar un SmartVideo en cualquier sección, simplemente repita el proceso. Inicie la página que desea editar en Divi Visual Builder, haga clic en el ícono más (+) para agregar un nuevo módulo, elija el módulo SmartVideo, agregue sus opciones y guarde sus cambios.

¡Tan simple como A, B, C!

Agregar videos SmartVideo a su sitio web Divi nunca ha sido tan fácil. Puedes olvidarte de la marca de YouTube, los videos recomendados y los enlaces que roban tu tráfico.

Además, puede personalizar completamente el reproductor de video SmartVideo para que coincida con el estilo de su sitio web.

¿Y lo que es más?

Si ya tiene videos en su sitio web Divi, SmartVideo los convierte automáticamente tan pronto como configure nuestro complemento.

Asegúrese de activar Optimizar el fondo y los videos existentes en la configuración de SmartVideo.

¿Cómo?

En su panel de administración de WordPress, vaya a SmartVideo > Configuración . A continuación, cambie Optimizar el fondo y los videos existentes :

Después de eso, haga clic en el botón Guardar configuración en la parte inferior de la página:

Y eso es todo: SmartVideo convertirá todos sus videos existentes automáticamente.

Así es; no tienes que hacer nada mas :)

Cómo personalizar el reproductor de video SmartVideo

Antes de llegar al final, cubramos algunas opciones para personalizar el reproductor de video SmartVideo.

Cambiar la forma y el color del reproductor de video

De manera predeterminada, el reproductor de video SmartVideo usa un botón de reproducción hexagonal amarillo. Sin embargo, puede cambiar la forma y el color para adaptarlo a su sitio web. Así es cómo.

En su panel de administración de WordPress, haga clic en SmartVideo:

Una vez que esté en el tablero de SmartVideo, haga clic en la pestaña Configuración , como se muestra a continuación.

En la pantalla Configuración , desplácese hacia abajo y encontrará secciones que permiten cambiar la forma y el color del botón de reproducción:

Aquí hay más notas sobre la captura de pantalla anterior.

1. Para cambiar la forma del botón del reproductor, elija Predeterminado , Rectángulo o Círculo en el menú desplegable.
2. Elija un color personalizado para el botón de su reproductor.
3. Haga clic en el botón Guardar configuración para guardar sus cambios.

Ahora puedes disfrutar de tu botón de jugador recién personalizado :)

Opciones más avanzadas

SmartVideo viene con más opciones para agregar subtítulos de las fuentes de YouTube, activar o desactivar la aceleración de carga, cambiar a diseños alternativos, agregar una marca de agua personalizada y monetizar sus videos con anuncios.

Aquí se explica cómo encontrar las opciones anteriores en la página de configuración de SmartVideo. Para agregar subtítulos de las fuentes de YouTube, marque la casilla que se muestra a continuación y recuerde guardar su configuración:

Para abrir más opciones, desplácese hacia abajo y haga clic en Opciones avanzadas , como destacamos a continuación.

En la sección Opciones avanzadas , tiene las siguientes opciones:

1. Activa o desactiva el método de diseño alternativo , lo que ayuda si experimentas problemas de tamaño de video extraño o de pantalla completa.
2. Activa o desactiva la aceleración de carga si tienes problemas con las cargas.
3. Establezca una marca de agua/logotipo personalizado en su reproductor de video.
4. Agregue la URL del anuncio VAST para poder vender anuncios de Adsense, Spotx, DFP, etc.

Consejo profesional: recuerde siempre hacer clic en el botón Guardar configuración en la parte inferior para guardar los cambios.

Ultimas palabras

Divi es un maravilloso tema de WordPress y un creador visual de páginas. Te ayuda a crear hermosos sitios web antes de que el próximo chico termine un sándwich. El proceso es tan simple como importar un diseño y personalizarlo hasta el cansancio.

La funcionalidad de arrastrar y soltar hace que personalizar cualquier diseño sea tan fácil como un pastel. No necesita habilidades de codificación en absoluto, además de editar su sitio web en el front-end, viendo cómo los cambios surten efecto en tiempo real.

Si usa videos en su sitio web, SmartVideo lo ayuda a brindar experiencias de video rápidas, sin búfer y profesionales en su sitio. Incluso si aloja sus videos en YouTube o en otro lugar, nuestro reproductor de video ordenado elimina las marcas y los enlaces de terceros.

Divi + SmartVideo es una combinación ganadora. En sus manos, ahora tiene la combinación perfecta para crear sitios web rápidamente y ofrecer experiencias de video incomparables a los visitantes de su sitio web o a los clientes de diseño web.

Además, no tenemos límites de ancho de banda o almacenamiento como otros servicios, lo que significa que puede alojar videos ilimitados a precios asequibles :) Pruebe Divi + SmartVideo hoy y disfrute de videos rápidos y de alta calidad sin sudar.

Háganos saber cómo va. ¡Feliz edificio!