FROM CACHE - fr_header
RÉSOLU

Vidéo Youtube différente sur chaque produits

theonosc
Touriste
4 0 0

Bonjour à tous,

 

J'utilise le thème "Showcase" sur Shopify et je me permets de solliciter votre aide, je vais essayer d'être le plus clair possible !

 

J'ai ajouté à ma template de page produit une vidéo youtube grâce à une section "vidéo". 

 

Capture d’écran 2022-07-08 à 11.58.43.png

 

Voici comment ça s'affiche :

 

Screen-video-product-image.jpg

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Mais c'est la même vidéo qui s'affiche sur chaque produit, j'aimerais pouvoir renseigner grâce à des sources dynamiques une vidéo différente pour chaque produit.

Cependant, ce n'est pas possible dans mon éditeur de thème d'indiquer que j'aimerais une source dynamique, je peux le faire pour les Subtitles, la miniature de la vidéo, mais pas le lien de la vidéo :

 

Capture d’écran 2022-07-08 à 12.11.01.png

 

Ce que j'ai essayé :

- Créer un metafield produit de type URL "lien-video-produit" -> product.metafields.custom.lien_video_produit 

- Dans le fichier json de ma template de page produit, au niveau de mon bloc video, changer le lien de la vidéo en metafield mais je reçois un messae d'erreur

 

Capture d’écran 2022-07-08 à 12.16.32.png

 

Capture d’écran 2022-07-08 à 12.17.10.png

 

Mes maigres compétences de codage sur Shopify s'arrêtent ici, j'espère avoir été assez clair et que vous pourrez m'aider à trouver une solution !

 

Merci d'avance pour votre aide et belle journée,

Théo

1 SOLUTION APPROUVÉE

Agence_Deployer
Shopify Partner
62 11 14

Succès.

Hello Théo!

Déjà, tu peux pas mettre de variable dans du JSON donc ça marchera pas c'est sur.

L'option la plus simple (sans toucher au code) c'est de créer un modèle de page produit par produit. Mais si tu as plusieurs dizaines de produit ça peut devenir complexe.

Alors dans ce cas, le mieux (et c'est pas trop compliqué 😄), c'est de remplacer le type URL ici :

Screen Shot 2022-07-08 at 4.03.56 PM.png

 

Par un type: "text". Au moins tu auras accès aux champs meta sur cette partie 🙂

Notre réponse vous a été utile ? Cliquez sur "J'aime" ou sur "Accepter comme solution".
Si vous souhaitez prendre contact avec des experts pour modifier ou optimiser votre boutique en ligne, rendez-vous par message privé ou sur contact@the-deployer.fr.

Voir la solution dans l'envoi d'origine

8 RÉPONSES 8

Agence_Deployer
Shopify Partner
62 11 14

Succès.

Hello Théo!

Déjà, tu peux pas mettre de variable dans du JSON donc ça marchera pas c'est sur.

L'option la plus simple (sans toucher au code) c'est de créer un modèle de page produit par produit. Mais si tu as plusieurs dizaines de produit ça peut devenir complexe.

Alors dans ce cas, le mieux (et c'est pas trop compliqué 😄), c'est de remplacer le type URL ici :

Screen Shot 2022-07-08 at 4.03.56 PM.png

 

Par un type: "text". Au moins tu auras accès aux champs meta sur cette partie 🙂

Notre réponse vous a été utile ? Cliquez sur "J'aime" ou sur "Accepter comme solution".
Si vous souhaitez prendre contact avec des experts pour modifier ou optimiser votre boutique en ligne, rendez-vous par message privé ou sur contact@the-deployer.fr.
theonosc
Touriste
4 0 0

Hello Agence_Deployer, merci pour ta réponse très intéressante !

 

Effectivement, ça m'a l'air d'être une bonne solution et plutôt simple à mettre en place !

Je ne peux pas modifier le type dans mon modèle de template .json (normal je crois ?)

mais plutôt dans le fichier .liquid de mon bloc vidéo.

 

J'ai essayé de modifier le type en "text" à cet endroit là :

Capture d’écran 2022-07-11 à 10.05.37.png

Et j'ai supprimé la ligne "accept"

Ça fonctionne presque mais la vidéo ne se lance pas, voici deux screen : l'ancien bloc vidéo vs le nouveau bloc video avec le "type" : text 

L'ancien ->

Capture d’écran 2022-07-11 à 10.20.05.png

 

Le nouveau ->

Capture d’écran 2022-07-11 à 10.18.10.png

 

On remarque qu'il ne reconnaît pas le data-video-id et le data-video-type.

J'ai modifié le data-video-type pour que ça ne soit plus une variable mais un type "youtube".

Capture d’écran 2022-07-11 à 10.33.35.png

(anciennement data-video-type="{{ section.settings.video.type }}")

Pour le data-video-id, je ne comprends pas du tout comment ça marche, quelqu'un saurait-il m'aiguiller svp ?

Capture d’écran 2022-07-11 à 10.33.26.png

Cordialement

Théo

Agence_Deployer
Shopify Partner
62 11 14

À mon avis le data-video-id prend juste ce qu'il y a apres la vairable ?v= sur l'url youtube. Donc tu vas devoir découper ta variable.

Tu as une doc ici : https://shopify.github.io/

Sinon ça devrait donner un truc comme ça : 

{%- assign video_id = section.settings.video | split: 'v=' -%}
{%- assign video_id = video_id[1] | split: '&' | first -%}

 

Notre réponse vous a été utile ? Cliquez sur "J'aime" ou sur "Accepter comme solution".
Si vous souhaitez prendre contact avec des experts pour modifier ou optimiser votre boutique en ligne, rendez-vous par message privé ou sur contact@the-deployer.fr.
theonosc
Touriste
4 0 0

Merci pour ta réponse !

Je pense comme toi mais impossible de trouver dans le code l'endroit ou il fait la séparation, j'ai trouvé dans theme.js des lignes susceptibles de réaliser cette fonction :

Capture d’écran 2022-07-11 à 11.24.57.png

 

Mais impossible d'être sûr à 100% car je n'ai aucune notion de js, liquid ou json ..

 

J'ai essayé de tester tes deux lignes de code en les ajoutant juste en dessous de la ligne {% if section.settings.video != blank %}

J'ai testé avec "video_id" comme sur ton exemple, mais aussi video-id, video.id, data-video-id

 

Mais rien n'y fait, ma variable data-video-id ne se met pas à jour avec ce qu'il y a après le ?v= de mon champ de texte en source dynamique.

 

Merci encore pour ta précieuse aide !

Théo

Agence_Deployer
Shopify Partner
62 11 14

j'avais juste placé le résultat dans une variable {{ video_id }} que tu peux utiliser ou tu veux.

Bon j'avoue que sans tester et voir le code c'est complexe mais je suis sur qu'après s'être bien cassé la tête ça marchera !

Bon courage 😉

Notre réponse vous a été utile ? Cliquez sur "J'aime" ou sur "Accepter comme solution".
Si vous souhaitez prendre contact avec des experts pour modifier ou optimiser votre boutique en ligne, rendez-vous par message privé ou sur contact@the-deployer.fr.
theonosc
Touriste
4 0 0

Ok je n'avais pas compris ça ! En remplaçant le data-video-id="{{ section.settings.video.id }}" en  data-video-id="{{ video_id }}"

Ça fonctionne !!

Merci infiniment pour ton aide, ta gentillesse et ta rapidité, belle journée 🙂

 

Théo

Agence_Deployer
Shopify Partner
62 11 14

Parfait 🔥🔥

Notre réponse vous a été utile ? Cliquez sur "J'aime" ou sur "Accepter comme solution".
Si vous souhaitez prendre contact avec des experts pour modifier ou optimiser votre boutique en ligne, rendez-vous par message privé ou sur contact@the-deployer.fr.
Wooderzz
Touriste
7 0 4

I want to do the same thing, but I'm using the Dawn theme. I'm trying to copy the above but it doesn't match my template. can someone help me?