En una publicación anterior, te enseñamos cómo convertir vídeos y reducir su tamaño de archivo para que puedas usarlos más fácilmente en tu blog o página web Wix.
Mientras el artículo anterior estaba relacionado con tus propios archivos de vídeo y el diseño de tu página web, en esta publicación vamos a enseñarte a instalar una grabadora de vídeo para recibir vídeos de los visitantes de tu sitio.
Las siguientes capturas de pantalla son para Wix, aunque el método descrito aquí también funciona para colocar una grabadora webcam en otras plataformas de creación de páginas web siempre que puedas añadir código personalizado en la configuración de administrador de tu plataforma.
Crear y añadir una grabadora de vídeo en Wix
Con este método, los usuarios podrán grabar un vídeo con sus webcam directamente en tu sitio Wix, o puedes permitirles que te envíen archivos de vídeo que ya tengan en su ordenador.
En ambos casos, los vídeos pueden ser enviados a tu cuenta en YouTube, Dropbox, Google Drive, Amazon S3 o Microsoft Azure. Aunque para poder mostrar los clips fácilmente en tu página web después de que la gente te los envíe, subirlos a YouTube es lo más lógico, ya que puedes integrarlos desde ahí mediante tu editor Wix.
Para colocar esta grabadora de vídeo en Wix, vamos a utilizar nuestra API de webcam de JavaScript y vídeo HTML5. Es un widget que puedes integrar en una página web para recopilar vídeos de usuarios y visitantes del sitio. Aunque está disponible para páginas web de todo tipo, hay algunos pasos concretos necesarios para colocarlo y ejecutarlo en un sitio Wix.
*************As recommended by Wix, the best way to embed a recording and video uploading widget like the Clipchamp API is via backend code, see https://support.wix.com/en/article/accessing-3rd-party-services#backend-service-call.
A developer or software engineer in your team or at your web agency will be able to follow these instructions in combination with the steps described at https://help.clipchamp.com/collect/getting-started/initial-setup-of-the-clipchamp-api.
*************A 2nd method using Custom Code blocks in the frontend of your website is described below. Note that it might not work in some circumstances, if that is the case then the method recommended by Wix through the backend code of your site is the best alternative.**************
1) Accede a tu backend de administración de la página web Wix
Tendrás que crear una página de prueba nueva en un paso posterior y copiar un fragmento de código en la Configuración HTML de esta página.
2) En una 2ª pestaña del navegador, regístrate para un período de prueba gratis con la API de vídeo de Clipchamp
Registrar una cuenta de prueba en nuestra API es necesario para que obtengas tu clave de API única, que necesitarás en un paso posterior, y para habilitar un objetivo de subida para los vídeos de usuario. No necesitas ninguna tarjeta de crédito para suscribirte y puedes cancelar el periodo de prueba en cualquier momento.
registro-clipchamp-prueba
3) Establece YouTube como objetivo de subida al que enviar los vídeos de los usuarios
Tras abrir una cuenta de prueba, en la configuración de la API en https://util.clipchamp.com/es/api-setup/integrations, haz clic en YouTube y conecta la API de Clipchamp con tu cuenta de YouTube para que los vídeos enviados por los usuarios puedan subirse a tu canal o a una lista de reproducción específica.
4) Dirígete a https://util.clipchamp.com/es/api-setup/install
En esta página hay 2 fragmentos de código requeridos para integrar un botón de grabadora de vídeo en tu sitio. Puedes ignorar las instrucciones que se mencionan en esta página ya que no son para páginas web de Wix. En tu caso, tienes que copiar y pegar ambos fragmentos de código en el editor HTML de la nueva página que crees en Wix.
5) Crea una página nueva en Wix y abre la «Configuración HTML»
En el editor HTML, pega el fragmento de código de la primera sección de la página Clipchamp del paso 4 tal y como sigue:
6) Después, copia el código de la segunda sección que está directamente bajo el primer fragmento en el editor HTML
7) A continuación, guarda y comprueba la vista previa donde hayas integrado el código HTML
Si el código se añadió correctamente, la página de prueba debería mostrar un nuevo botón de grabadora de vídeo. ¡Viva!
8) Como último paso, autoriza los dominios del botón de vídeo
Para qué la grabadora funcione, tienes que añadir 2 dominios a la lista blanca en la configuración de tu API de Clipchamp tal y como sigue:
El 1er dominio: Copia la URL que Wix está usando para mostrar el botón Clipchamp integrado en tu página Wix y añádela a la lista de dominios autorizados en la configuración de tu API de Clipchamp en https://util.clipchamp.com/es/api-setup/domains.
Ten en cuenta que esta no es la URL (o «dominio») que se muestra en la barra de direcciones del navegador (asumimos que estás usando Chrome), sino la URL del iframe en el que está el botón de vídeo de tu página.
Puedes obtener este nombre de dominio desplazando el puntero del ratón unos pocos píxeles por debajo del botón Clipchamp en la página de la vista previa, haciendo clic con el botón derecho y seleccionando «ver la fuente del marco».
En Chrome, esto abre una pestaña nueva. Vete a la barra de direcciones de la pestaña y copia el nombre de dominio desde ahí. En nuestro ejemplo, el dominio tiene este aspecto
El 2º dominio: Este nombre de dominio sigue la convención de fijación de nombres yourwebsitename-wixsite-com.fileusr.com, como, p. ej., moestavern-wixsite-com.fileusr.com. Ajústalo al nombre de tu página web y añádelo a tu lista de dominios Clipchamp, y después puedes publicar tu página de prueba de Wix con el botón de grabación integrado en ella para comprobar si aparece correctamente.
También puedes encontrar este 2º nombre de dominio buscando en el código fuente de tu página Wix
Tras guardar estos 2 nombres de dominio en la configuración de la API de Clipchamp, el botón de la grabadora de vídeo y la herramienta de subida de tu página Wix estará listo para su uso, así que tus visitantes pueden empezar a enviarte grabaciones y otros vídeos a tu canal de YouTube.
9) Mostrar vídeos enviados en tu sitio
Si quieres usar los vídeos que la gente te envíe y que ahora están ubicados en tu canal de YouTube para mostrarlos en tu página web, por favor, consulta las siguientes instrucciones en la ayuda de Wix sobre cómo integrar vídeos de YouTube.
Para finalizar
Estos son todos los pasos necesarios para recopilar vídeos de los visitantes de tu sitio si utilizas Wix. Ten en cuenta que también hemos escrito un breve artículo de ayuda sobre este tema para cualquiera que ya se haya registrado en una cuenta para la API de vídeo de Clipchamp.
Si no estás usando un creador de páginas web, por favor, consulta este otro tutorial para ver las instrucciones de instalación para integrar la API de vídeo HTML5 en cualquier página web.
Lo diseñamos junto con nuestros clientes para que sea apto para una gran variedad de escenarios y cualquier tipo de proyecto web. Esto incluye, por ejemplo, la capacidad de recopilar testimonios de vídeo de tus clientes si diriges una tienda online o recibir comentarios en vídeo de los lectores en tu blog.
Una nota final – nuestro widget de grabadora de vídeo tiene una amplia variedad de opciones, por ejemplo, puedes cambiar su marca por tu propia marca, ajustar los colores y otros elementos de estilo, y varias configuraciones relacionadas con los vídeos de entrada y salida.
Como estas son opciones especializadas, no las hemos cubierto en este artículo, aunque te invitamos a profundizar en la documentación de la API y decidir cuáles de sus parámetros quieres añadir en tu grabadora de vídeo en Wix. Puedes añadir cualquier opción en el fragmento de código que insertaste en el editor HTML durante el paso 6.
