liquid 相关问题

我想将相关变体的图像添加到产品的变体部分

我告诉你我的问题，我无法解决。 我想将所选产品变体的图像添加为 Shopify 产品页面的产品变体部分的背景，...

Jekyll - 无法按日期反向排序

我试图仅在我的博客上对 3 个最新的“精选”帖子进行排序，但我当前的 for 循环不允许我对集合进行排序以首先显示最新的帖子。 我下面有什么...

shopify 注册后重定向用户

我希望我的用户在流程完成后收到一条消息，表明他们已成功注册，因此我制作了一个欢迎页面，但在用户创建账户后我无法将用户重定向到该页面： t...

如何制作横幅

这里是有效的代码，但我需要提高它的效率，正如你所看到的，为了满足条件，我在检查条件是否满足后重复div，但我觉得应该有一种方法...... .

如何使英雄横幅有条件地可点击

我想让英雄横幅有条件地可点击，而不重复其他部分的部分 这是有效的代码，但我需要使其高效，正如您所看到的，以满足我所要求的条件...

在 Liquid 中创建数组变量

我正在努力寻找如何在 Liquid 中创建数组变量。 我已经尝试了这个示例的一些基本变体，但到目前为止它们都不起作用。 {% 赋值 var1= ['A','B','C'] %}

为什么 Stimulus 将传递的数值读取为字符串而不是数字？

我遇到一个问题，我试图将数值从 HTML（液体）传递到 Stimulus，但 Stimulus 正在将它们读取为字符串，为什么会发生这种情况？ 这些值是从 API 中提取的，

去掉 Shopify 数量选择器中的前导 0

我有一个 Shopify 数量选择器，目前如下所示： 在此输入图像描述 我想去掉当我有数量时出现的前导 0 < 10. But I don't know how to...

添加多个购物车属性以显示在订单上

我正在使用购物车属性，以便我的 Shopify 商店中的客户可以向其购物车中的产品添加其他收件人。 我为每个产品显示了 2 个文本字段，一个名称字段和一个电子邮件字段...

Expanse 主题 - 更新 Shopify 产品上的 Metafield 变体

我现在正在使用 Shopify 并使用 Expanse 主题，抱歉，我还是个新手，因为我的大部分项目都是 WordPress。 我正在尝试创建具有大小、颜色的元字段变体。 我已经显示了...

Shopify：如何根据当前产品页面添加按钮链接到亚马逊listing？

使用免费的 Shopify 模板之一（“刷新”），我想在默认添加到购物车和购买按钮下方添加第三个按钮，其中显示“在亚马逊上购买”并链接到亚马逊链接...

检查 Liquid 中的本地存储

我正在尝试在 Shopify（液体）中设置受密码保护的集合页面。 我正在尝试检查本地存储项“密码”是否设置了正确的值。 如果是这种情况，请包括...

如何使用 Shopify Liquid 动态更改标题的颜色？

我使用chatgpt查看代码，我不确定它是否与配色方案有关，我不确定我错过了什么或我做错了什么。我可以完美地更改标题文本

制作 Shopify 博客页面模板

我正在尝试构建一个 Shopify 博客模板，用于博客类型的新闻。我尝试分段创建一个名为 news.liquid 的文件，然后在模板中分配一个 JSON 文件，但它不起作用。什么...

如何使用 Ajax 渲染液态代码并输出为 HTML？

我正在我的 Shopify 网站上制作迷你购物车，并使用 ajax 将商品添加到购物车。对于每个行项目，我需要获取元字段数据，但 jquery 不允许我这样做。 我有所有的代码...

Shopify 自定义标签过滤

我正在使用首次亮相的主题，并希望添加自定义过滤名称，这样我就可以按产品的颜色、类型等进行过滤，并在每个过滤器下提供选项。颜色 - 然后有蓝色，红色，绿色，y...

Shopify - 联系表国家和省份

我正在使用以下代码根据此处的方法将国家/地区下拉列表添加到联系表单中 {{ 'contact.form.country' | t }} 我正在使用以下代码根据方法此处将国家/地区下拉列表添加到联系表单中 <label for="ContactFormCountry" class="label--hidden">{{ 'contact.form.country' | t }}</label> <select required id="ContactFormCountry" name="contact[country]" data-default="{{form.country}}">{{ country_option_tags }}</select> 我将如何制作另一个下拉菜单以允许选择所选国家/地区的省份？ 我从Dawn theme找到了这段代码，它运行良好 表格（演示） <div class="container" data-customer-addresses> <div class="add-new-address"> <div class="action text-center"> <a class="btn btn-secondary my-3" data-bs-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">Add a new address</a> </div> <div class="collapse my-5" id="collapseExample"> <div class="address-add"> <div class="row justify-content-center"> <div class="col-lg-6 col-md-6"> <div id="AddAddress"> <form action="#"> <div class="form-group my-3"> <div class="select"> <select class="form-control" id="AddressCountryNew" name="address[country]" data-default="{{ form.country }}" autocomplete="country" > {{ all_country_option_tags }} </select> </div> </div> <div id="AddressProvinceContainerNew" style="display: none"> <div class="select"> <select class="form-control" id="AddressProvinceNew" name="address[province]" data-default="{{ form.province }}" autocomplete="address-level1" ></select> </div> </div> </form> </div> </div> </div> </div> </div> </div> </div> 在 theme.liquid 上添加此代码即可访问每个页面。 if (typeof window.Shopify == 'undefined') { window.Shopify = {}; } Shopify.bind = function (fn, scope) { return function () { return fn.apply(scope, arguments); }; }; Shopify.addListener = function (target, eventName, callback) { target.addEventListener ? target.addEventListener(eventName, callback, false) : target.attachEvent('on' + eventName, callback); }; Shopify.CountryProvinceSelector = function (country_domid, province_domid, options) { this.countryEl = document.getElementById(country_domid); this.provinceEl = document.getElementById(province_domid); this.provinceContainer = document.getElementById(options['hideElement'] || province_domid); Shopify.addListener(this.countryEl, 'change', Shopify.bind(this.countryHandler, this)); this.initCountry(); this.initProvince(); }; Shopify.CountryProvinceSelector.prototype = { initCountry: function () { var value = this.countryEl.getAttribute('data-default'); Shopify.setSelectorByValue(this.countryEl, value); this.countryHandler(); }, initProvince: function () { var value = this.provinceEl.getAttribute('data-default'); if (value && this.provinceEl.options.length > 0) { Shopify.setSelectorByValue(this.provinceEl, value); } }, countryHandler: function (e) { var opt = this.countryEl.options[this.countryEl.selectedIndex]; var raw = opt.getAttribute('data-provinces'); var provinces = JSON.parse(raw); this.clearOptions(this.provinceEl); if (provinces && provinces.length == 0) { this.provinceContainer.style.display = 'none'; } else { for (var i = 0; i < provinces.length; i++) { var opt = document.createElement('option'); opt.value = provinces[i][0]; opt.innerHTML = provinces[i][1]; this.provinceEl.appendChild(opt); } this.provinceContainer.style.display = ''; } }, clearOptions: function (selector) { while (selector.firstChild) { selector.removeChild(selector.firstChild); } }, setOptions: function (selector, values) { for (var i = 0, count = values.length; i < values.length; i++) { var opt = document.createElement('option'); opt.value = values[i]; opt.innerHTML = values[i]; selector.appendChild(opt); } }, }; 现在根据您的表单添加此代码 const selectors = { customerAddresses: '[data-customer-addresses]', addressCountrySelect: '[data-address-country-select]', addressContainer: '[data-address]', toggleAddressButton: 'button[aria-expanded]', cancelAddressButton: 'button[type="reset"]', deleteAddressButton: 'button[data-confirm-message]', }; const attributes = { expanded: 'aria-expanded', confirmMessage: 'data-confirm-message', }; class CustomerAddresses { constructor() { this.elements = this._getElements(); if (Object.keys(this.elements).length === 0) return; this._setupCountries(); this._setupEventListeners(); } _getElements() { const container = document.querySelector(selectors.customerAddresses); return container ? { container, addressContainer: container.querySelector(selectors.addressContainer), toggleButtons: document.querySelectorAll(selectors.toggleAddressButton), cancelButtons: container.querySelectorAll(selectors.cancelAddressButton), deleteButtons: container.querySelectorAll(selectors.deleteAddressButton), countrySelects: container.querySelectorAll(selectors.addressCountrySelect), } : {}; } _setupCountries() { if (Shopify && Shopify.CountryProvinceSelector) { // eslint-disable-next-line no-new new Shopify.CountryProvinceSelector('AddressCountryNew', 'AddressProvinceNew', { hideElement: 'AddressProvinceContainerNew', }); this.elements.countrySelects.forEach((select) => { const formId = select.dataset.formId; // eslint-disable-next-line no-new new Shopify.CountryProvinceSelector(`AddressCountry_${formId}`, `AddressProvince_${formId}`, { hideElement: `AddressProvinceContainer_${formId}`, }); }); } } _setupEventListeners() { this.elements.toggleButtons.forEach((element) => { element.addEventListener('click', this._handleAddEditButtonClick); }); this.elements.cancelButtons.forEach((element) => { element.addEventListener('click', this._handleCancelButtonClick); }); this.elements.deleteButtons.forEach((element) => { element.addEventListener('click', this._handleDeleteButtonClick); }); } _toggleExpanded(target) { target.setAttribute(attributes.expanded, (target.getAttribute(attributes.expanded) === 'false').toString()); } _handleAddEditButtonClick = ({ currentTarget }) => { this._toggleExpanded(currentTarget); }; _handleCancelButtonClick = ({ currentTarget }) => { this._toggleExpanded(currentTarget.closest(selectors.addressContainer).querySelector(`[${attributes.expanded}]`)); }; _handleDeleteButtonClick = ({ currentTarget }) => { // eslint-disable-next-line no-alert if (confirm(currentTarget.getAttribute(attributes.confirmMessage))) { Shopify.postLink(currentTarget.dataset.target, { parameters: { _method: 'delete' }, }); } }; }

在 Shopify 中的过滤器内对选项进行排序

我在 Shopify 上有一家商店，我正在尝试修复。客户销售鞋子并将其鞋子列为“英国尺码 1、英国尺码 2、英国尺码 3”等。问题是“英国尺码 10”的鞋子尺码介于...

在 Liquid 中显示减去重复项的结果列表

我有一个名为“行业”的字符串字段，人们将进入他们的行业。例如农业、制造业、IT、园林绿化等 我想使用液体输出这些数据......

如何在 Shopify Liquid 中展平数组？

我尝试循环遍历数组并使用以下命令捕获输出： 数组： ["cat1","cat2","cat3","cat4"] ["cat1","cat2&q...