I would like to pick the experts’ brains regards metafields. We want to use Product metafields with pre-populated values.
The use case is that we will manage thousands of products linked to multiple categories. We want our product managers to be able to pick from a set list of values instead of typing in values into a free text box to avoid errors.
I found that the Product metafield ‘text’ - ‘Single line text’ supports to add values via ‘Limit to preset choices’ but this option only allows to select 1 value only. We need to select multiple values.
Does anyone have recommendations how to best manage this case? I’d like to avoid using more 3rd party Apps but we are open for any suggestions.
I’m curious myself, as I’m in the same boat as you where I want to select multiple metafield values, but I don’t know how (it doesn’t appear to let you).
Once you click Add Item, it will create another field for you to add more choices. You can click on the right to remove a previous choice, and you can continue adding choices and it will add a drop-down selector in your Product Metafield options. You can save and return to add or remove choices later.
While adding multiple options to the meta fields setup is possible and quite intuitive - an option to select multiple values on a product level seems to be left out or missing. This means you can’t have a shirt that is red and blue, both show up in filtering for blue and/or red and have both filter options show that same product. There are tons of use cases for this scenario and quite honestly, no reason not to have that option available. Ie. When you create multiple values, a simple “allow multiple” checkbox would so.
Looking for the same functionality here… This could previously be achieved using tags, but for some reason, tags are not available to use for “storefront filtering” (or at least I have not found a way to do so).
Please Shopify, we need the option to select multiple values!
Hi everyone, I came up with a solution for this issue today that involves some additional liquid and custom Javascript. While this code will not be a copy paste fix for you, I hope it gives you an idea of how to add this functionality to your theme.
While looping through your collection filters, on “list” type filters, you can add something like this:
{% if filter_group.label == 'Origin' %}
{% assign mockFilterProperties = '' %}
{% for filter in filter_group.values %}
{% capture mockFilterProperties %}{{mockFilterProperties}}{{filter.value}}, {% endcapture %}
{% endfor %}
{% assign mockFilterProperties = mockFilterProperties | split: ', ' | uniq | sort %}
{% for filter in mockFilterProperties %}
{% endfor %}
{% endif %}
{% for filter in filter_group.values %}
{% endfor %}
The code above with create a set of filter checkboxes that look at the metafield values, and break them up into individual values (separated by comma).
Next you’ll need some JS to tie the mock checkboxes to the real checkboxes. Here is a function to do that (Vanilla JS):
function checkMockFilters () {
var originFilterContainer = document.getElementById('origin');
if (originFilterContainer) {
var originMockFilters = originFilterContainer.querySelectorAll('.mock-filters input');
var originFilters = originFilterContainer.querySelectorAll('.filters input');
var activeOriginFilters = [];
for (i = 0; i < originMockFilters.length; ++i) {
if (originMockFilters[i].checked == true) {
activeOriginFilters.push(originMockFilters[i].value);
}
}
for (i = 0; i < originFilters.length; ++i) { // Uncheck all filters
originFilters[i].checked = false;
}
for (i = 0; i < originFilters.length; ++i) { // Loop through mock filters, check all filters that contain the mock filter values
for (ii = 0; ii < activeOriginFilters.length; ++ii) {
if (originFilters[i].value.includes(activeOriginFilters[ii])) {
originFilters[i].checked = true;
}
}
}
}
}
The last part with be to add some CSS to hide the default checkboxes and show the mock checkboxes.
.mock-filters + .filters {
display: none;
}
Hope this helps out some of you. Advanced knowledge of Liquid and Javascript will be required for this to work and modification will be required so it works in your specific theme. You can take it further than I did to make it more flexible, but I only needed this functionality for a single filter parameter called Origin.
It looks like Shopify has recently solved this problem in their April 6th changelog by allowing to create multiple values for the single line text field.
Nice! The only problem for me now is that it uses “OR” instead of “AND” for filtering when selecting multiple options, so I cannot use it to narrow down my options which was the intended purpose. We have a large inventory and was looking to create filters so that people could find for example, all the products that are “Organic” + “Vegan”. With this setup, when a user clicks those 3 filters it will display, for example, Organic Turkey Bacon, which is clearly not vegan.
Another issue is the difficulty to deal with a large product catalog, as there is no way to edit in bulk
Is there a way to edit product metafield lists in bulk?
When the product metafield has the type “Single line” and “Accepts multiple values” – if values are not empty – they are shown in bulk editor as [“Value 1”,“Value 2”].
Also if they’re not empty – bulk editor accepts values in this JSON format and overwrites them successfully.
But if those values are not specified, bulk editor doesn’t accept a JSON string: it says “1 Invalid value found. Update the invalid value, then save again”.
Is there a way to initialize values for metafield lists in bulk, without loading every single product edit page and specifying the first value in the list manually?
Did they take away this “Accepts multiple values” option on single-line product metafields?! I am trying to figure out how to select/add multiple values on my admin product page, but I don’t see a checkbox under the metafield properties page (when adding the metafield) to allow multiple values.
Then when you’re attaching values to it by a customer or product or wherever your single line text metafield is being used, you’ll see either a select dropdown (if you have it set to “Limit to preset choices”) or a text input box.
And right under the dropdown or text input you’ll now see an “Add item” button for attaching more values.
Hi, I was facing same problem like I want to show one product in multiple filter
In my store I have to add one product in more then one Occasion like product can wear in Diwali and Navratri also.