Le guide complet Shopify + Swarmify pour l'hébergement vidéo de commerce électronique

Swarmify vous aide à accélérer les vidéos sur votre boutique en ligne Shopify pour stimuler l'engagement des utilisateurs et augmenter vos revenus.

Saviez-vous que les pages produits avec du contenu vidéo connaissent une augmentation de 80 % des conversions ? C'est vrai, vos clients aiment voir ce qu'ils obtiennent.

Vous pouvez télécharger les meilleures images de produits, rédiger des descriptions irrésistibles et recueillir des avis brillants sur vos produits, mais le contenu vidéo fait ressortir le point en quelques secondes.

Vous pouvez facilement démontrer le fonctionnement de votre produit et utiliser des témoignages vidéo pour montrer pourquoi les gens adorent votre produit. Le fait est que le marketing vidéo est une tactique puissante pour augmenter les ventes sur votre boutique eCommerce Shopify.

Et dans l'article de blog d'aujourd'hui, nous vous montrons exactement comment utiliser Swarmify et Shopify pour diffuser des vidéos à démarrage instantané, sans tampon et incroyablement rapides à vos utilisateurs. La configuration de l'ensemble est aussi simple que A, B, C, alors ne vous inquiétez pas si vous n'êtes pas féru de technologie :)

Avec Swarmify, vous profitez d'une meilleure expérience utilisateur, de taux de conversion plus élevés et, finalement, de plus de ventes. D'un autre côté, les vidéos lentes chargées de liens tiers (par exemple, YouTube) ne feront que ternir votre marque, voler votre trafic et renvoyer les utilisateurs.

Maintenant, vous ne voulez pas cela, et nous non plus. Sans plus tarder, commençons par quelques informations générales, nous sommes donc sur la même page.

Qu'est-ce que Shopify ?

Shopify est une plateforme de commerce électronique leader du secteur. Ils vous offrent une tonne d'outils pour créer une boutique en ligne et démarrer.

Que vous soyez débutant ou professionnel, Shopify facilite remarquablement le démarrage de la vente, que ce soit en ligne ou dans votre magasin de pierre et de mortier.

La création d'une boutique en ligne Shopify est l'affaire des élèves de quatrième année. La plate-forme est livrée avec un constructeur de magasin facile et des tonnes de modèles prêts à l'emploi que vous pouvez personnaliser jusqu'à ce que vous tombiez.

En plus de cela, ils vous offrent un éditeur de produits convivial, vous permettant de créer, publier et gérer votre inventaire comme un pro. Vous pouvez même optimiser vos produits pour les moteurs de recherche grâce aux fonctionnalités de référencement intégrées.

De plus, vous disposez de tous les outils dont vous avez besoin pour traiter et expédier les commandes sans transpirer. En dehors de cela, ils vous proposent une suite d'outils marketing pour "... créer, exécuter et analyser des campagnes de marketing numérique..." sans conjecture.

Pour couronner le tout, vous disposez de plusieurs passerelles de paiement, ce qui facilite la collecte et le traitement des paiements.

Ils vous démarrent avec un essai de 14 jours sans carte de crédit pour tester les eaux. Pour déverrouiller toutes les fonctionnalités de Shopify, vous devez vous inscrire à un forfait payant.

Fonctionnalités clés de Shopify

Shopify est la plateforme de commerce électronique de choix pour des millions d'utilisateurs, grâce à des fonctionnalités telles que :

• Éditeur de site Web facile à utiliser pour créer des boutiques en ligne comme un développeur Web expérimenté
• Plus de 70 thèmes que vous pouvez personnaliser pour s'adapter à votre boutique
• Point de vente (POS), pour que vous puissiez vendre dans votre magasin ou sur votre smartphone/appareil mobile
• Intégration Oberlo sans effort pour les entreprises de livraison directe
• Créateur de boutique en ligne
• Plusieurs processeurs de paiement
• Conception réactive et adaptée aux mobiles
• Photos gratuites
• Modifiez facilement le HTML, le CSS et le JS de votre boutique
• Nom de domaine personnalisé, par exemple, swarmify.com
• Plate-forme de blogs complète, idéale pour le marketing de contenu
• Certificat SSL gratuit
• Récupération de caisse abandonnée
• Tarifs d'expédition flexibles et taxes automatiques
• Plusieurs langues
• 100 $ de crédits publicitaires Google si vous dépensez 25 $ sur un nouveau compte Google Advertising
• Intégration transparente des médias sociaux
• Bande passante illimitée
• Assistance 24h/24 et 7j/7
• Et bien plus!

Si vous utilisez déjà Shopify, vous n'avez pas besoin que je vous explique pourquoi il s'agit d'une superbe plateforme de commerce électronique. Si vous êtes un débutant total sans aucune compétence technique, vous ne pouvez jamais vous tromper avec Shopify en tant que fournisseur de commerce électronique.

Pour adoucir l'affaire, Shopify propose des plans abordables à partir de seulement 9 $ par mois. Si vous démarrez une nouvelle entreprise, leur forfait Basic Shopify (29 $/mois) offre un excellent rapport qualité-prix.

Cela dit, qu'est-ce que Swarmify ?

Qu'est-ce que Swarmify ?

À moins que vous ne soyez totalement nouveau ici, Swarmify est un service d'accélération vidéo unique en son genre qui vous aide à fournir des vidéos 12 fois plus rapides à vos utilisateurs.

Nous utilisons la même technologie que les géants du streaming Netflix et Hulu utilisent pour offrir des expériences vidéo sans décalage et sans tampon.

Si vous utilisez (ou envisagez d'utiliser) des vidéos sur votre boutique Shopify, nous vous offrons exactement ce dont vous avez besoin pour augmenter la vitesse de chargement de vos vidéos.

En plus de cela, nous vous aidons à offrir des expériences vidéo entièrement personnalisées à vos acheteurs.

Au lieu d'utiliser le lecteur vidéo YouTube fourni avec la marque YouTube, les liens et les vidéos recommandées par vos concurrents, nous vous proposons notre lecteur SmartVideo.

Notre lecteur vidéo révolutionnaire ne contient aucune marque ou lien. C'est 100% sans encombrement, et vous pouvez le personnaliser pour qu'il corresponde à votre boutique Shopify en quelques minutes.

Voici pourquoi de nombreux entrepreneurs comme vous choisissent Swarmify SmartVideo pour leurs boutiques en ligne Shopify.

Fonctionnalités clés de Swarmify

Nous sommes des leaders dans le domaine et vous proposons des fonctionnalités à la hauteur de notre réputation.

• Bande passante illimitée , vous savez, tout comme Shopify :)
• Stockage illimité
• Réseau de diffusion de contenu vidéo SmartCDN - Vos acheteurs bénéficient de vidéos 12 fois plus rapides que la moyenne du secteur, où qu'ils se trouvent
• Conversions YouTube automatiques - Si vous utilisez déjà YouTube et que vous avez des vidéos YouTube sur votre boutique Shopify, SmartVideo convertit automatiquement toutes les vidéos et les diffuse à partir de nos piles ultra-rapides et de notre CDN.
• Possibilité d'héberger des vidéos sur plusieurs plateformes telles que YouTube, Wistia, Vimeo, Google Drive, Amazon S3, pCloud, etc. Vos clients ne feront pas la différence car nous diffusons toutes vos vidéos dans notre lecteur vidéo sans encombrement
• Superbe encodage vidéo pour des expériences de visionnage optimisées sur chaque appareil
• Optimisation continue du streaming - Tout au long de la lecture, SmartVideo surveille en permanence l'expérience vidéo de chaque utilisateur individuel et prévient les pannes avant qu'elles ne surviennent.
• Lecture sans blocage - SmartVideo vous offre 8 fois moins de mise en mémoire tampon pendant la lecture que les autres lecteurs en moyenne. Désormais, vos clients n'ont plus à attendre que les vidéos de produits soient mises en mémoire tampon. Vous avez notre EdgeAI à remercier pour cela :)
• Installation facile
• Un support de premier ordre soutenu par des développeurs passionnés
• Et bien plus encore (En savoir plus sur les fonctionnalités ici)

En tant qu'entrepreneur, vous souhaitez utiliser des vidéos sur votre boutique en ligne Shopify pour une meilleure rétention des utilisateurs, des taux de conversion plus élevés et plus de ventes.

Et puisque le marketing vidéo est un défi, vous avez besoin d'un hôte vidéo qui facilite votre travail, pas plus difficile.

Entre Swarmify, et vous sauvez la journée. Nous vous proposons exactement ce dont vous avez besoin pour proposer des expériences vidéo rapides, personnalisées et professionnelles à vos acheteurs.

Avec une lecture vidéo rapide et de haute qualité de votre côté, vendre sur votre boutique Shopify devient beaucoup plus facile que si vous diffusiez des vidéos directement à partir de YouTube, Wistia, Vimeo ou d'autres sites d'hébergement de vidéos.

Avec ce préambule, allons de l'avant et intégrons SmartVideo à votre boutique Shopify.

Comment utiliser Shopify + SmartVideo pour l'hébergement vidéo de commerce électronique

Pour la section suivante, vous devez avoir un magasin Shopify fonctionnel. Si vous êtes encore mouillé derrière les oreilles, voici un guide astucieux sur la façon de créer une boutique Shopify.

En plus de cela, vous avez besoin d'un compte Swarmify prêt. Découvrez nos plans tarifaires abordables et choisissez le plan qui convient le mieux à votre entreprise. Vous cherchez à en savoir plus ? Consultez notre liste croissante d'études de cas.

Comment ajouter une SmartVideo à une page de produit Shopify

Dans la section « Média » de la page d'administration de votre produit, cliquez sur « Ajouter un média » et téléchargez une vidéo. Une fois SmartVideo installé sur votre site, la vidéo sera diffusée à partir de notre réseau de diffusion mondial, cependant, la vidéo sera toujours affichée dans le lecteur vidéo Shopify standard.

Pour afficher une vidéo dans le lecteur SmartVideo, vous devez laisser SmartVideo convertir automatiquement une vidéo YouTube ou Vimeo.

Pour notre exemple de produit, j'ai emprunté une vidéo de révision de Unbox Therapy sur YouTube.

Ensuite, je suis allé de l'avant et j'ai créé un exemple de produit complet avec la vidéo YouTube. Voici à quoi cela ressemble sur notre exemple de boutique Shopify :

Plutôt chouette, non ? Je dois admettre que ça a l'air bien au début, mais il y a quelques problèmes.

Premièrement, il y a la marque YouTube évidente, qui pourrait ne pas convenir à votre boutique Shopify.

Deuxièmement, le titre en haut du lecteur vidéo est un lien savamment tissé qui redirige vos acheteurs vers YouTube. Lorsque vous travaillez si dur pour générer du trafic vers votre site Web, vous ne voulez certainement pas que cela se produise.

Troisièmement, voici à quoi ressemble le lecteur YouTube lorsque l'utilisateur lit et met en pause la vidéo :

Regarde ça; le lecteur YouTube regorge d'encombrement et de distractions destinées à siphonner vos visiteurs.

Voir la section "Plus de vidéos" ?

Cette section pourrait afficher des vidéos de vos concurrents , ce qui est tout simplement inacceptable. Et lorsque votre acheteur partage la vidéo avec des amis, le lien redirige les utilisateurs vers YouTube, et non vers votre boutique Shopify !

Si vous aimez utiliser des vidéos de produits sur votre boutique Shopify, vous pouvez clairement voir à quel point l' hébergement de vidéos directement à partir de YouTube est un problème , même s'il s'agit d'un service gratuit.

Ou, comme on dit, rien de tel qu'un déjeuner gratuit :)

Tout simplement...

Vous ne pouvez pas projeter cette sensation et ce look professionnels avec le lecteur vidéo YouTube. De plus, les distractions ne feront qu'éloigner vos acheteurs, ce qui entraînera une baisse des taux de conversion et des ventes.

Comment ajouter une SmartVideo à une page Shopify standard

Une fois SmartVideo installé, les vidéos YouTube et Vimeo seront automatiquement converties sur votre site, mais le moyen le plus propre d'ajouter une SmartVideo à une page Shopify normale consiste à tirer parti d'une balise SmartVideo.

Dans la section de contenu de l'administrateur de votre page, cliquez sur le bouton "Insérer une vidéo" et collez votre balise SmartVideo dans la zone de texte.

Après avoir installé SmartVideo (comme nous le verrons dans la section suivante), la vidéo sera visible sur votre page :

Maintenant que vous savez avec quoi nous travaillons, laissez-nous intégrer Swarmify à votre boutique Shopify et voyez la différence.

Copiez votre extrait de configuration Swarmify

Au moment d'écrire ces lignes, nous n'avons pas d'application Shopify. Cela signifie que vous devez intégrer Swarmify à Shopify manuellement. Tout de même, le processus est aussi simple que A, B, C.

Que faire?

Connectez-vous à votre tableau de bord Swarmify :

Le tableau de bord Swarmify est simple et facile à utiliser. Nous ne vous ennuyons pas avec des fonctionnalités inutiles. Nous le gardons maigre comme vous le souhaitez :)

Ensuite, cliquez sur l'onglet Configuration , comme indiqué ci-dessous.

Sur l'écran suivant, choisissez si vous avez déjà des vidéos YouTube sur votre boutique Shopify, puis cliquez sur Suivant :

Conseil de pro : le mieux est de choisir " Oui " pour activer la conversion automatique YouTube. J'ai aussi choisi " Oui. "

Après cela, choisissez si vous avez des vidéos d'arrière-plan sur votre boutique Shopify et cliquez sur Suivant . Je n'ai pas de vidéos d'arrière-plan, j'ai donc choisi " Non :"

Sur la page suivante, choisissez si vous souhaitez modifier le jeu de couleurs du lecteur vidéo.

Si vous souhaitez modifier le jeu de couleurs, choisissez Oui (1), sélectionnez votre couleur personnalisée (2) et cliquez sur Suivant (3), comme nous le soulignons dans la capture d'écran ci-dessous.

Tu fais du fantastique :)

Ensuite, choisissez la forme du bouton du lecteur vidéo et cliquez sur Suivant . Pour le moment, nous avons trois options : Par défaut (Hexagonal), Rectangle et Cercle :

Ensuite, choisissez si vous souhaitez ajouter un filigrane personnalisé à vos vidéos, puis cliquez sur le bouton Suivant :

Enfin, choisissez si vous souhaitez activer les publicités sur vos vidéos, puis cliquez sur Terminer :

Puisque vous ajoutez probablement des vidéos explicatives aux produits Shopify, il vaut mieux se passer de publicités.

Après cela, cliquez sur Copier dans le presse-papiers , comme nous le détaillons ci-dessous.

Une fois votre extrait Swarmify copié, vous êtes prêt pour la partie suivante : l'ajouter à votre boutique Shopify.

Ajout d'un extrait Swarmify à la boutique Shopify

Dans la section suivante, nous ajoutons l'extrait Swarmify que vous venez de copier dans votre boutique Shopify.

Ne vous inquiétez pas, c'est simple :)

Connectez-vous au tableau de bord de votre boutique Shopify et cliquez sur Boutique en ligne dans le menu de navigation de gauche :

Ensuite, cliquez sur Thèmes , comme nous le montrons ci-dessous.

Après cela, cliquez sur le menu déroulant Actions et sélectionnez Modifier le code :

Cliquez ensuite sur {/} theme.liquid :

Faites défiler vers le bas jusqu'à ce que vous voyiez la section avec un autre code JavaScript. Habituellement, il commence par la balise <script> . Voici une capture d'écran pour vous aider :

Ensuite, collez l' extrait Swarmify que vous avez copié précédemment au-dessus de la balise <script> et cliquez sur Enregistrer , comme indiqué ci-dessous.

Et c'est tout!

Votre boutique Shopify est désormais connectée à Swarmify !

Génial, non ?

Merci d'avoir été si patient. Je ne voulais sauter aucune étape car il est important de bien faire les choses dès le départ :)

Maintenant, vous pouvez continuer à télécharger des vidéos sur YouTube et les ajouter à votre boutique Shopify. Swarmify encodera, convertira et servira toutes les vidéos dans un lecteur vidéo magnifique et sans encombrement.

Vous savez, quelque chose comme ça :

Pas de marque YouTube, pas de liens et pas de distractions - juste un lecteur vidéo sans encombrement qui a fière allure même lorsque l'utilisateur lit et met en pause la vidéo :)

N/B : Les vidéos prennent du temps à optimiser en fonction de la longueur. Mon exemple de vidéo durait 3,58 minutes, j'ai donc attendu environ quatre minutes :)

Et comment ai-je su que la vidéo était entièrement optimisée ? Sur votre lecteur vidéo, l' option Accélération vidéo : ACTIVÉE s'affiche, comme illustré ci-dessous.

Même vidéo, même page - résultats différents. Tout ce qui siphonnerait votre trafic a disparu.

Pouf ! Tous partis.

Vous pouvez maintenant garder vos acheteurs là où vous en avez le plus besoin - sur vos pages de produits :)

La vidéo se charge 12 fois plus vite que le lecteur moyen, et le nouveau lecteur sans encombrement a l'air incroyable et professionnel.

Vous ne sauriez pas que j'ai reçu la vidéo de YouTube si Unbox Therapy n'avait pas dit : "S'il vous plaît, abonnez-vous et suivez-moi via les liens dans la description... bla bla..."

Au fait, c'est un gars formidable, mais j'espère que vous comprenez :)

Personnaliser davantage le lecteur vidéo

Nous avons quelques balises pour personnaliser davantage votre lecteur vidéo.

N/B : Contrairement au code JavaScript que nous avons ajouté à la section <HEAD> du fichier {/}theme.liquid , vous ajoutez les balises SmartVideo suivantes directement à l'endroit où vous souhaitez afficher votre lecteur vidéo. Nous avons un excellent exemple Shopify vers la fin :)

Si vous souhaitez ajouter une image d'affiche ou une vignette à votre vidéo, copiez-collez le code suivant sur votre site :

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

Remarques:

• Remplacez " path/to/my/video.mp4" et " path/to/my/image.png" par les chemins réels vers votre vidéo et votre image d'affiche respectivement
• Vous pouvez ajuster la largeur et la hauteur de votre lecteur comme bon vous semble

Pour lire automatiquement votre vidéo, utilisez la balise SmartVideo suivante :

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

Conseil de pro : à moins qu'ils ne soient combinés avec muet , de nombreux navigateurs restreignent la lecture automatique . Nous vous recommandons de n'utiliser la lecture automatique qu'en combinaison avec muet . De plus, l'ajout de playsinline est essentiel pour une lecture correcte dans IOS/Safari lors de la lecture automatique.

Pour indiquer au lecteur vidéo de commencer la lecture avec le son coupé, utilisez :

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

Pour boucler votre vidéo pour la rejouer une fois qu'elle est terminée, utilisez :

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

Pour empêcher la lecture de la vidéo en plein écran sur Safari iOS, utilisez :

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

Pour rendre le lecteur insensible (largeur et hauteur fixes), supprimez class="swarm-fluid" de votre tag.

N/B : Si vous utilisez YouTube comme source vidéo :

• Remplacez toutes les vidéos de "privées" par "non répertoriées". De cette façon, Swarmify peut récupérer et traiter vos vidéos.
• Utilisez le lien d'intégration correct, pas le lien direct vers la page. Par exemple, utilisez https://www.youtube.com/embed/wBp0Rb-ZJak (bon) au lieu de https://www.youtube.com/watch?v=wBp0Rb-ZJak (mauvais) .

De plus, ne supprimez pas les contrôles inclus dans chaque balise SmartVideo. Si vous le faites, votre utilisateur n'aura pas les boutons pour lire votre vidéo.

Un exemple de travail Shopify

Pour illustrer comment utiliser les balises SmartVideo dans Shopify, je vais ajouter une vidéo à une nouvelle page Shopify.

Vous pouvez également ajouter des balises SmartVideo aux articles de blog Shopify - la procédure reste la même.

J'utilise la même vidéo de Unbox Therapy. N'oubliez pas d'utiliser le code d'intégration, et non le lien direct.

En tant que tel, mon tag SmartVideo prêt ressemble à ceci :

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

Ensuite, connectez-vous à l'administrateur de votre boutique Shopify, accédez à Boutique en ligne > Pages et ajoutez une nouvelle page :

Remarque, le mien est un tout nouveau magasin sans pages :) Si vous aviez des pages existantes, vous verriez quelque chose comme ceci :

Peu importe, vous pouvez soit modifier une page existante, soit cliquer sur Ajouter une page pour en ajouter une nouvelle. Cela vous amène à l'éditeur de page.

Ensuite, ajoutez un titre à votre page et basculez vers HTML, comme indiqué ci-dessous.

Ensuite, copiez-collez votre balise SmartVideo et cliquez sur Enregistrer , comme nous le soulignons ci-dessous :

Maintenant, si vous affichez votre page dans le front-end, vous verrez :

Notre vidéo de test est là - avec une accélération vidéo en arrière-plan. La lecture de la vidéo a démarré automatiquement car ma balise SmartVideo inclut la lecture automatique et a été désactivée . Vous pouvez également y voir tous les contrôles .

Et c'est tout ce qu'il y a à faire avec les balises SmartVideo pour personnaliser davantage votre lecteur vidéo. Combinez différentes balises pour obtenir les résultats souhaités.

Derniers mots

Swarmify est la nouvelle norme pour l'hébergement vidéo. Associez notre technologie à Shopify et vous disposez des outils nécessaires pour proposer des expériences vidéo fantastiques à vos acheteurs avides.

Nous offrons des expériences vidéo rapides, personnalisables et de haute qualité à un large éventail d'entreprises, tout comme la vôtre. C'est notre mission primordiale, et nous nous améliorons chaque jour.

Ne nous croyez pas sur parole, consultez nos études de cas et découvrez comment d'autres entreprises le tuent avec l'hébergement vidéo Swarmify pour le commerce électronique.