Complete Brizy Builder/Cloud + Swarmify pour l'hébergement vidéo WordPress

Publié: 2020-10-14

Utilisez-vous le constructeur de pages Brizy WordPress ou Brizy Cloud ? Si tel est le cas, continuez à lire pour savoir comment intégrer Swarmify à l'une ou l'autre plate-forme pour des performances vidéo bien meilleures.

Les créateurs de sites Web ont rendu la création de beaux sites Web incroyablement facile. Dans le passé, vous deviez apprendre le codage pour créer même les sites Web les plus élémentaires.

De nos jours, les choses sont totalement différentes. Vous n'avez pas besoin de connaissances préalables en codage pour créer des sites Web comme les pros.

Tout cela grâce à des outils tels que Brizy WordPress Page Builder et sa sœur hébergée dans le cloud Brizy Cloud. La même entreprise propose les deux solutions.

Brizy WordPress Page Builder se présente sous la forme d'un plugin que vous installez sur votre site WordPress. Vous savez, quelque chose comme Elementor et Divi, entre autres.

Brizy Cloud, d'autre part, se présente sous la forme d'un constructeur de sites Web en ligne tel que Webflow, Wix et Weebly, entre autres.

Brizy Cloud et Brizy WordPress Builder vous offrent tous les deux les outils dont vous avez besoin pour créer une gamme variée de sites Web sans transpirer.

Ce sont fondamentalement le même produit. La seule grande différence est que l'un est un plugin WordPress et l'autre est un service hébergé dans le cloud.

Trouver?

La bonne nouvelle est que vous pouvez facilement intégrer Swarmify avec Brizy Cloud ou un site Web WordPress construit à l'aide du constructeur de pages Brizy.

Et dans le post d'aujourd'hui, nous vous montrons exactement comment !

Sans plus tarder, commençons car il y a beaucoup à apprendre :)

Qu'est-ce que Brizy Builder/Cloud ?

Page d'accueil Brizy

Tout d'abord, qu'est-ce que Brizy ? Brizy est un constructeur de site Web remarquablement facile à utiliser qui se décline en deux versions : un plugin WordPress et une version hébergée dans le cloud.

Le plugin Brizy WordPress est idéal pour les personnes ayant un site Web WordPress. Brizy Cloud est parfait pour les débutants qui cherchent à créer des sites Web sans aucune compétence en codage.

Le plugin Brizy et Brizy Cloud vous offrent tous deux un éditeur par glisser-déposer qui vous aide à créer visuellement un site Web.

Brizy a été créé par le développeur de thèmes WordPress primé Themefuse , pour vous aider à créer des sites Web époustouflants avec un créateur de site Web intuitif et facile à utiliser.

J'ai pris à la fois la version WordPress et le cloud pour un tour et la couleur m'a impressionné. Themefuse a complètement changé le jeu avec un créateur de site Web simple mais puissant qui ne vous gêne pas.

Voici une liste des fonctionnalités que j'ai appréciées.

Fonctionnalités clés de Brizy Builder/Cloud

  • Éditeur intuitif par glisser-déposer
  • Plus de 40 mises en page de sites Web prédéfinies que vous pouvez importer en un clic
  • Plus de 150 blocs préfabriqués
  • Styles globaux pour personnaliser votre site rapidement
  • 4000+ icônes
  • Des dizaines d'éléments de contenu tels que des formulaires, des espaceurs, du texte, des boutons, etc.
  • Styles illimités
  • Injection de code personnalisé
  • Un sous-domaine gratuit (par exemple, https://cherry1993132.brizy.site/) avec Brizy Cloud (vous pouvez héberger une page de destination gratuite si vous le souhaitez)
  • Nom de domaine personnalisé
  • Intégration transparente avec vos applications préférées, y compris Zapier, Mailchimp, etc.
  • Sauvegarde automatique dans le cloud
  • Réactif et prêt pour le mobile
  • Et beaucoup plus!

Brizy regorge de toutes les fonctionnalités dont vous avez besoin pour créer des sites Web incroyables en un temps record.

Si vous êtes à la recherche d'un créateur de site Web, Brizy ne vous décevra pas. Si vous utilisez déjà Brizy, préparez-vous pour la section suivante, où nous en apprendrons plus sur Swarmify SmartVideo et comment l'intégrer à votre site Web Brizy.

Qu'est-ce que Swarmify SmartVideo ?

Page d'accueil de Swarmify

Si vous lisez ce blog depuis un certain temps, vous êtes déjà assez familier avec Swarmify et SmartVideo.

Si vous êtes nouveau ici ... bienvenue et sentez-vous comme chez vous :)

Pour les débutants, Swarmify est une société d'accélération vidéo qui vise à offrir des expériences vidéo rapides et de haute qualité aux petites entreprises du monde entier.

Pour accomplir cette mission, Swarmify a investi massivement dans une technologie propriétaire et la même infrastructure que les géants du streaming tels que Netflix et Hulu utilisent.

La société a également investi dans un SmartCDN qui garantit que vos vidéos se chargent rapidement pour tous les utilisateurs, où qu'ils se trouvent dans le monde.

En savoir plus : sur les fonctionnalités SmartVideo ici.

Vous pouvez désormais dire adieu à YouTube maladroit, et Vimeo s'intègre grâce à notre lecteur vidéo sans encombrement qui a l'air beau et professionnel sur votre site Web.

Mieux encore, notre service SmartVideo convertit automatiquement toutes vos vidéos YouTube et Vimeo une fois que vous l'avez configuré sur votre site Web Brizy.

Si vous hébergez vos vidéos ailleurs, vous serez ravi de constater que nous prenons en charge les principaux sites de téléchargement de vidéos et les services de stockage dans le cloud.

SmartVideo vous offre une lecture sans tampon et anti-décrochage sur tous les appareils. Notre solution facile à mettre en œuvre vous permet de « réaliser plus de ventes, de réduire les taux de rebond et de garder les visiteurs concentrés sur votre marque ».

De plus, vous bénéficiez d'une bande passante et d'un stockage illimités, ce qui vous permet de continuer à partager vos meilleures vidéos sans payer de lourdes factures.

Cela dit, vous avez besoin d'un compte Swarmify actif pour la section suivante, où vous apprendrez à intégrer SmartVideo à votre site Web Brizy, que vous utilisiez le plugin WordPress ou la version hébergée dans le cloud.

Faisons cela!

Chez Swarmify, notre mission est d'apporter une expérience vidéo accélérée et sans distraction aux sites Web de toutes tailles. Que vous soyez propriétaire d'un site Web , une agence ou que vous souhaitiez simplement participer à notre programme d'affiliation , nous avons un plan pour vous !

Comment intégrer SmartVideo avec Brizy Builder pour WordPress

Commençons par Brizy Builder pour WordPress. L'installation de SmartVideo sur votre site Web WordPress est remarquablement facile.

Commençons par installer le plugin SmartVideo WordPress.

Connectez-vous à votre tableau de bord d'administration WordPress et accédez à Plugins > Ajouter un nouveau , comme indiqué ci-dessous.

Ajouter de nouveaux plugins dans WordPress

Ensuite, entrez SmartVideo dans le champ de recherche, puis cliquez sur Installer maintenant , comme nous le soulignons ci-dessous.

Installez maintenant le plugin SmartVideo

Après cela, appuyez sur le bouton Activer :

Activer le plug-in SmartVideo

Ensuite, cliquez sur SmartVideo dans votre menu d'administration WordPress :

Emplacement de l'administrateur SmartVideo dans le menu

Votre plugin SmartVideo n'est pas encore prêt. Il serait préférable de le lier à notre Swarm CDN via une clé spéciale qui se trouve dans votre compte Swarmify.

Ensuite, cliquez sur le bouton Configurer si vous avez déjà un compte Swarmify :

Configurer le plug-in SmartVideo

Si vous n'avez pas de compte Swarmify, vous avez la possibilité d'en créer un. J'avais déjà un Swarmify, j'ai donc cliqué sur le bouton Configurer , ce qui m'a conduit à la page suivante.

Statut du plug-in désactivé

Comme vous pouvez le voir dans l'image ci-dessus, SmartVideo est toujours désactivé. Faites défiler la page, et vous verrez un champ qui vous permet de saisir votre clé CDN Swarm :

Entrée de clé CDN Swarm

Vous allez coller la clé que vous êtes sur le point de copier ci-dessous dans le champ ci-dessus.

Connectez-vous à votre tableau de bord Swarmify et copiez la clé CDN Swarm en haut :

Emplacement clé du tableau de bord Swarmify

Retournez sur votre site WordPress, collez la clé CDN Swarm dans le champ et cliquez sur Activer SmartVideo , comme indiqué ci-dessous.

Configurer la clé cdn de l'essaim

Maintenant, lorsque vous faites défiler vers le haut, vous remarquerez que SmartVideo est activé :

Statut activé SmartVideo

C'était super facile.

Maintenant, votre site Brizy WordPress est connecté avec SmartVideo :)

N'êtes-vous pas un naturel à cela?

Pour plus d'options, cliquez sur l'onglet Paramètres en haut, comme indiqué ci-dessous.

Page des paramètres SmartVideo

Sur la page des paramètres, vous disposez de nombreuses options supplémentaires pour personnaliser votre expérience SmartVideo. Vous pouvez modifier les couleurs du lecteur vidéo SmartVideo et la forme du bouton de lecture, entre autres :

Paramètres SmartVideo pour les conversions automatiques

Activez Optimiser les vidéos d'arrière-plan et les vidéos existantes , comme indiqué ci-dessus, puis cliquez sur Enregistrer les paramètres en bas de la page.

Avant de continuer, ajoutons une SmartVideo à votre site Brizy WordPress. Je travaille avec la page suivante.

Exemple de site Web Brizy

Je remplacerai l'image en surbrillance en haut par la vidéo SpaceX's Starship: Journey to Mars que j'ai empruntée à la chaîne YouTube Newsthink.

Nous utiliserons la balise SmartVideo suivante pour intégrer la vidéo :

 <smartvideo src="path/to/my/video.mp4" width="1280" height="720" class="swarm-fluid" controls></smartvideo>

N'oubliez pas de remplacer path/to/my/video.mp4 par l'URL réelle de votre vidéo.

N/B : Si vous utilisez YouTube, vous devez utiliser le lien embed : https://www.youtube.com/ embed /-kU6fMGh4l4 au lieu du lien direct watch : https://www.youtube.com/ watch ?v= -kU6fMGh4l4. Si vous utilisez le lien direct, SmartVideo ne trouvera pas et ne traitera pas votre vidéo.

Cela dit, ma balise SmartVideo prête ressemble à ceci :

 <smartvideo src="https://www.youtube.com/embed/-kU6fMGh4l4" width="1280" height="720" class="swarm-fluid" controls></smartvideo>

Si vous utilisez une autre source vidéo, par exemple Amazon S3, remplacez le lien YouTube par l'URL de votre vidéo réelle. Découvrez les 9 meilleurs services de téléchargement de vidéos et de stockage dans le cloud.

Et ensuite ?

Ouvrez la page WordPress que vous souhaitez modifier dans Brizy en cliquant sur Continuer à modifier avec Brizy :

Générateur de pages Brizy

Cela devrait charger votre page dans l'éditeur intuitif par glisser-déposer. Puisque je remplace l'image, je vais sélectionner l'image et cliquer sur l'icône Supprimer :

Suppression du constructeur de pages Bizy

Si vous ne remplacez rien, faites glisser et déposez l'élément de contenu intégré partout où vous ajoutez la vidéo.

Ma page ressemble à ceci maintenant :

Bloc vide du constructeur de pages Brizy

Ensuite, cliquez sur l'icône Ajouter (+) pour afficher le panneau latéral, puis faites glisser et déposez Embed où vous le souhaitez. (Dans notre cas, c'est dans la section héros puisque nous remplaçons l'image):

Brizy glisser-déposer élément d'intégration

Ensuite, cliquez à l'intérieur de l'élément Embed et cliquez sur le bouton Embed , comme indiqué ci-dessous :

Insérer la balise SmartVideo dans l'élément d'intégration

Ensuite, copiez-collez votre tag SmartVideo dans la boîte qui apparaît :

Le lecteur SmartVideo est désormais intégré au design Brizy

Allez-vous regarder ça !

Le lecteur vidéo SmartVideo est déjà en action. Ensuite, mettez à jour votre page :

Mettre à jour la page pour la publier

Maintenant, lorsque je consulte mon exemple de site Web sur le frontend, je vois ceci :

Voir le site Web sur le frontend

L'image a disparu, et à sa place, nous avons un magnifique lecteur SmartVideo. Personne ne peut dire que nous avons emprunté la vidéo à YouTube.

Maintenant que nous avons intégré Swarmify SmartVideo à votre site Brizy WordPress, ajoutons SmartVideo à Brizy Cloud.

Comment intégrer Swarmify SmartVideo avec Brizy Cloud

Nous n'avons pas de plugin pour Brizy mais ajouter Swarmify à la plateforme cloud est plus facile que vous ne le pensez. Nous utiliserons l'extrait de code JavaScript SmartVideo.

Ce n'est pas comme une balise SmartVideo car elle va dans la section <head> de vos pages, pas dans le <body> comme la balise SmartVideo. Si vous ne comprenez pas ce que cela signifie, ne vous inquiétez pas, nous sommes là pour vous.

Mais où puis-je obtenir cet extrait de code JavaScript ?

Ne vous inquiétez pas, il se trouve dans votre compte Swarmify.

Comment obtenir votre extrait JavaScript SmartVideo

Connectez-vous à votre compte Swarmify et cliquez sur Configuration :

Swarmifier l'extrait de code javascript

Ensuite, choisissez si vous avez des vidéos YouTube sur votre site Brizy Cloud et cliquez sur Suivant :

Assistant de configuration Swarmify

Conseil de pro : choisissez toujours Oui pour faciliter la conversion automatique si vous utilisez des vidéos YouTube à l'avenir.

Avez-vous des vidéos d'arrière-plan ? Spécifiez cela et cliquez sur Suivant :

Activer ou désactiver le traitement vidéo en arrière-plan

Tu vas très bien :)

Ensuite, changez les couleurs du lecteur vidéo si vous le souhaitez et cliquez sur Suivant :

Modifier les couleurs du lecteur SmartVideo

Après cela, vous avez la possibilité de modifier la forme du bouton de lecture. Cliquez sur Suivant après :

Forme du bouton de lecture SmartVideo

Ajoutez un filigrane personnalisé si nécessaire et cliquez sur Suivant :

Définir un filigrane personnalisé

Ensuite, choisissez si vous souhaitez inclure des publicités sur vos vidéos et cliquez sur Terminer :

Enfin, cliquez sur Copier dans le presse-papier :

Copiez l'extrait de code javascript dans le presse-papiers

Ce n'était pas difficile, n'est-ce pas ?

Votre JavaScript SmartVideo est prêt. Ajoutons-le maintenant à votre site Web Brizy Cloud .

Comment ajouter votre extrait de code JavaScript au site Web Brizy Cloud

Connectez-vous à votre tableau de bord Brizy Cloud (je suppose que vous avez déjà un site Web Brizy Cloud) et choisissez le site Web que vous souhaitez modifier :

Écran d'accueil du nuage Brizy

Cela vous amène directement au créateur de site Web Brizy Cloud par glisser-déposer :

Générateur de glisser-déposer Brizy

Comme vous pouvez le voir, j'utilise le même modèle qu'avant :)

Mais ne soyez pas confus ; nous sommes maintenant à l'intérieur du Brizy Cloud et non de Brizy Builder pour WordPress . Les éditeurs visuels se ressemblent, à quelques exceptions près.

Ensuite, appuyez sur l'icône Paramètres :

Emplacement de l'icône des paramètres en bas à gauche

Après cela, appuyez sur l'onglet Paramètres :

L'onglet Paramètres apparaît

Cliquez ensuite sur Injection de code :

Choisissez la sélection du menu d'injection de code

Collez votre extrait de code JavaScript SmartVideo dans la section En- tête et appuyez sur Enregistrer les modifications , comme indiqué ci-dessous.

Collez l'extrait Swarmify dans l'en-tête et enregistrez les modifications

Et c'est tout! Votre Brizy Cloud est maintenant connecté à Swarmify SmartVideo.

Conseil de pro : rappelez-vous comment nous avons ajouté une balise SmartVideo à l'aide de l'élément Embed lorsque vous travaillez avec Brizy Builder pour WordPress ? Répétez le processus pour ajouter une vidéo SmartVideo à votre site Web Brizy Cloud .

Je parle de ça :

Maintenant, configurez l'intégration dans Brizy Cloud comme avant

Je ne veux pas revenir sur tout le processus parce que ce serait redondant alors que c'est pratiquement la même chose. Même processus.

Derniers conseils

L'intégration avec Brizy Builder implique l'utilisation du plugin SmartVideo WordPress. L'intégration avec Brizy Cloud exploite l'extrait de code JavaScript SmartVideo.

L'intégration d'une vidéo dans Brizy Builder ou Brizy Cloud reste la même. Utilisez l'élément Embed pour ajouter une balise SmartVideo où vous le souhaitez.

N'oubliez pas de remplacer path/to/my/video.mp4 dans votre balise SmartVideo par l'URL réelle de votre vidéo, peu importe où elle est stockée.

Des questions? Faites le nous savoir :)

Essayez SmartVideo dès aujourd'hui !