SHOPIFY - ES (Legacy)
Completar estos pasos solamente si el apartado anterior (On-Site Messaging App) no ha funcionado correctamente.
Añadir widgets en la página de producto
- Desactivar los componentes promocionales en la aplicación On-Site Messaging App
- Acceder a la pestaña Tienda Online → Temas en la barra de menú lateral.
En el apartado Tema activo escoger la opción Editar código:
Añadir al final del fichero Templates → product.liquid el siguiente código sustituyendo USUARIO y CLAVE-ASSETS por los parámetros facilitados.
Nota: Si tu ficha de producto no trabaja con product.liquid, revisa en product-template.liquid o en product-description-bottom-template.liquid, dentro del apartado Sections del tema; si tampoco trabaja en esas plantillas, buscaremos en el fichero Sections.Widgets<script> sequraConfigParams = { merchant:'USUARIO', //Sustituir el valor USUARIO assetKey:'CLAVE-ASSETS',//Sustituir el valor CLAVE-ASSETS locale: Shopify.locale, price_src: '*[itemprop=price],#productPrice', //Si no funciona con este valor, sustituir por el selector css del precio widgets:[ //Si no se quiere alguno de los widgets podría eliminar //Widget Recibe primero... { product: 'i1', //Código de producto para Recibe primero... dest_sel: '#AddToCartForm'//Selector css del lugar donde se quiera colocar el widget }, //FIN Widget Recibe primero... //Widget Fracciona tu pago { product: 'pp3', //Código de producto para Fracciona tu pago dest_sel: '.product-single__prices'//Selector css del lugar donde se quiera colocar el widget }, //FIN Widget Fracciona tu pago ] }; (function(){ var script = document.createElement("script"); script.src = "https://s3-eu-west-1.amazonaws.com/shop-assets.sequrapi.com/base/js/sequrapayment_v2.js"; script.async = true; document.getElementsByTagName("head")[0].appendChild(script); })() </script>
- En caso de que el comercio vaya a vender en otros idiomas/paises como FR, PT o IT el código quedaría:Widgets
<script> if(['es','pt','fr','it'].includes(Shopify.locale)){ sequraConfigParams = { locale: Shopify.locale, price_src: '.price-item.price-item--regular,*[itemprop=price],#productPrice', //Si no funciona con este valor, sustituir por el selector css del precio widgets:[ //Si no se quiere alguno de los widgets podría eliminar //Widget Recibe primero... { product: 'i1', //Código de producto para Recibe primero... dest_sel: '#AddToCartForm'//Selector css del lugar donde se quiera colocar el widget }, //FIN Widget Recibe primero... //Widget Fracciona tu pago { product: 'pp3', //Código de producto para Fracciona tu pago dest_sel: '.product__tax'//Selector css del lugar donde se quiera colocar el widget }, //FIN Widget Fracciona tu pago ] }; //Asignar merchant y assetsKey del pais switch (Shopify.locale){ case 'fr': sequraConfigParams.merchant = 'USUARIO_fr'; //Sustituir el valor USUARIO sequraConfigParams.assetKey = 'CLAVE-ASSETS_fr';//Sustituir el valor CLAVE-ASSETS break; case 'it': sequraConfigParams.merchant = 'USUARIO_it'; //Sustituir el valor USUARIO sequraConfigParams.assetKey = 'CLAVE-ASSETS_it';//Sustituir el valor CLAVE-ASSETS break; case 'pt': sequraConfigParams.merchant = 'USUARIO_pt'; //Sustituir el valor USUARIO sequraConfigParams.assetKey = 'CLAVE-ASSETS_pt'; //Sustituir el valor CLAVE-ASSETS default: sequraConfigParams.merchant = 'USUARIO'; //Sustituir el valor USUARIO sequraConfigParams.assetKey = 'CLAVE-ASSETS';//Sustituir el valor CLAVE-ASSETS } (function(){ var script = document.createElement("script"); script.src = "https://s3-eu-west-1.amazonaws.com/shop-assets.sequrapi.com/base/js/sequrapayment_v2.js"; script.async = true; document.getElementsByTagName("head")[0].appendChild(script); })() } </script>
Material visual (sliders, logos y textos):
Si se quiere crear un banner o slider personalizado, se pueden utilizar las imágenes contenidas en Marketing toolkit. Dichas imágenes están tanto en formato PNG como en SVG para que puedan ser editadas y adaptadas al estilo de cada página.
En ese mismo enlace se pueden encontrar también un tutorial de los elementos visuales disponibles de nuestros métodos de pago.
Paso anterior | Paso siguiente