Complete Brizy Builder/Cloud + Swarmify pour l'hébergement vidéo WordPress
Publié: 2020-10-14Utilisez-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 ?
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 ?
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!
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.
Ensuite, entrez SmartVideo dans le champ de recherche, puis cliquez sur Installer maintenant , comme nous le soulignons ci-dessous.
Après cela, appuyez sur le bouton Activer :
Ensuite, cliquez sur SmartVideo dans votre menu d'administration WordPress :
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 :
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.
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 :
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 :
Retournez sur votre site WordPress, collez la clé CDN Swarm dans le champ et cliquez sur Activer SmartVideo , comme indiqué ci-dessous.
Maintenant, lorsque vous faites défiler vers le haut, vous remarquerez que SmartVideo est activé :
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.
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 :
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.
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 :
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 :
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 :
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):
Ensuite, cliquez à l'intérieur de l'élément Embed et cliquez sur le bouton Embed , comme indiqué ci-dessous :
Ensuite, copiez-collez votre tag SmartVideo dans la boîte qui apparaît :
Allez-vous regarder ça !
Le lecteur vidéo SmartVideo est déjà en action. Ensuite, mettez à jour votre page :
Maintenant, lorsque je consulte mon exemple de site Web sur le frontend, je vois ceci :
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 :
Ensuite, choisissez si vous avez des vidéos YouTube sur votre site Brizy Cloud et cliquez sur Suivant :
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 :
Tu vas très bien :)
Ensuite, changez les couleurs du lecteur vidéo si vous le souhaitez et cliquez sur Suivant :
Après cela, vous avez la possibilité de modifier la forme du bouton de lecture. Cliquez sur Suivant après :
Ajoutez un filigrane personnalisé si nécessaire et cliquez sur Suivant :
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 :
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 :
Cela vous amène directement au créateur de site Web Brizy Cloud par glisser-déposer :
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 :
Après cela, appuyez sur l'onglet Paramètres :
Cliquez ensuite sur 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.
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 :
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 :)