liquid 相关问题

在 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...

Shopify 变体更改后如何刷新库存？

在 Shopify 上，我得到了此代码来显示库存的可用数量，并在产品页面上具有漂亮的视觉效果，但它不会在具有变体的产品上刷新。我正在寻找更新库存的方法

Shopify 购物车页面上的手动折扣输入不起作用

我需要在购物车页面上输入优惠券代码，但它似乎无法以简单形式运行： 我需要在购物车页面上输入优惠券代码，但它似乎无法以简单形式运行： <input type="hidden" name="discount" value="{{ settings.modal_promo_code }}" > 我把它放在表单内提交按钮之前。 结帐页面上的订单不适用实时优惠券。 我还需要做什么才能使其正常工作吗？ 编辑：表格看起来像这样 - <form action="/cart" method="post" class="cart"> <input type="hidden" name="discount" value="{{ settings.modal_promo_code }}" > 它会重定向到这样的 URL： https://store.com/4934605xxxx/checkouts/04d6478feeb9d3262fbea5571b682ebc?_ga=2.260083023.358228188.1608464294-110675315.1604953057 似乎存在冲突，不允许折扣应用于 URL 或被删除？_ga=2.260083023.358228188.1608464294-110675315.1604953057，因为在 chrome 设置中禁用 JS 并再次提交结账时，它会起作用并且会应用折扣。 对此有什么想法吗？我怎样才能让它像这样工作： https://store.com/4934605xxxx/checkouts/04d6478feeb9d3262fbea5571b682ebc?_ga=2.260083023.358228188.1608464294-110675315.1604953057&discount=TBSRWDVS 谢谢你 只要您的购物车没有使用 AJAX 来升级和转移，这应该可以工作。 结帐页面确认 ?rebate= 的获取争用，并包含带有 name="discount" 的字段，将将该争用包含到结帐中。 如果您专门生成标准形状，则这将起作用。 （如果你修改购物车，现场返利内容将不会出现，你需要重新输入）如果你必须修改形状，你可以通过几种方式保留markdown代码，通过修改使用 ajax 购物车或将其作为 cookie 存放起来。 所以你的代码应该可以工作，我在我的开发商店中对其进行了双重检查，没有任何问题，由于存在获取争用，它会向结帐页面应用回扣。 PS：这不包括购物车问题的回扣，因为它允许结帐转移包含获取竞争，仅此而已。所以通常相当于用制作界面 结帐 回复晚了，但想回答您的问题并分享解决方案。 首先，您不能按照您所描述的方式将折扣代码应用于购物车，这是可能且可行的，但比在表单中添加输入字段要复杂一些。 没有针对此的 OOTB Shopify 解决方案，但有一些未记录的 API 端点可用于创建此功能。 查看Shopify Discounter Web Component，它支持： 折扣码 自动折扣 礼品卡 折扣组合 多种货币 内化 使用 css 变量自定义样式 将其放置在商店的任何地方 希望这有帮助。 在 Shopify 中，如果您使用的是 Dawn 主题，您只需删除 if 语句即可让折扣字段始终显示。 为此，请转到 main-cart-footer.liquid 部分文件并查找下面的代码块： {%- if cart.cart_level_discount_applications.size > 0 -%} <ul class="discounts list-unstyled" role="list" aria-label="{{ 'customer.order.discount' | t }}"> {%- for discount in cart.cart_level_discount_applications -%} <li class="discounts__discount discounts__discount--position"> {%- render 'icon-discount' -%} {{ discount.title }} (-{{ discount.total_allocated_amount | money }}) </li> {%- endfor -%} </ul> {%- endif -%} 只需删除包装 if 语句，您的最终代码应如下所示： <ul class="discounts list-unstyled" role="list" aria-label="{{ 'customer.order.discount' | t }}"> {%- for discount in cart.cart_level_discount_applications -%} <li class="discounts__discount discounts__discount--position"> {%- render 'icon-discount' -%} {{ discount.title }} (-{{ discount.total_allocated_amount | money }}) </li> {%- endfor -%} </ul> 享受吧！

在shopify中添加产品变体标题

我有一些具有不同变体的产品 - 即颜色、尺寸等。 我正在尝试使用 - {{variant.title}} 输出父（？）变体标题，但这只是输出变体操作...

有没有办法让文本优先和图像优先布局以相同的方式渲染

下面是我的液体文件，因为我正在为某人构建 Shopify 主题，但是当使用文本优先布局时，由于其后面的内容以及带有文本的图像的高度，图像被半隐藏......

在shopify中是否可以获取产品的变体元数据？

我正在开发嵌入式应用程序扩展，需要在特定集合页面上获取产品变体元数据。是否可以像在产品展示页面上一样获取元数据？ 对于