Intégration Shopify avancée : Section avec fallback | JOIN Stories

❗️Cette intégration est avancée, envoyez cette documentation à votre intégrateur Shopify ou la personne en charge chez vous.

Configuration requise :

Avoir un abonnement Shopify
Avoir les droits pour ajouter un bloc

Voici l'explication vidéo, vous pourrez retrouver les étapes et le code à insérer sous la vidéo dans cet article.

1/ Rendez-vous sur votre thème Shopify

2/ Puis dans la partie modifier le code (en haut a gauche dans les “...”)

3/ Pour cliquer ensuite dans sections :

4/ Cliquez sur “Ajouter une ressource” celle-ci devra s'appeler : widget-join-dynamic

4/ Copiez-collez le code ci-dessous à la place du code existant dans Shopify et remplacez NOM_DE_DOMAINE en suivant l'étape 5 ci-dessous.

<div class="join-dynamic-widget-section"> 
<div id="widget-{{ product.handle }}" style="display: block!important;"></div> 
<script> 
document.addEventListener("DOMContentLoaded",
function(event) { 
var defaultAlias = "ALIAS_WIDGET_DEFAULT"; 
var alias = "{{ product.handle }}"; 
var url = "https://NOM_DE_DOMAINE/widgets/"; 
var DIV_ID = "widget-{{ product.handle }}"; 
var loadScriptWithAlias = function (alias) {
var fullurl = url + alias + "/index.js";
var script_tag = document.createElement("script"); script_tag.setAttribute("type", "text/javascript"); script_tag.setAttribute("src", fullurl); script_tag.setAttribute("data-join-widget-id", DIV_ID); script_tag.setAttribute("data-join-widget-alias", alias); script_tag.onerror = function () { 
loadScriptWithAlias(defaultAlias); 
}; 
document.querySelector("head").appendChild(script_tag);
}; 
loadScriptWithAlias(alias); }) 
</script> 
</div>