Documentation Index
Fetch the complete documentation index at: https://partner-docs.foxsell.app/llms.txt
Use this file to discover all available pages before exploring further.
- Structure
- Liquid Section
- Javascript
- FoxSell JS Object
Volume Bundle Settings JSON
Hide fields
Hide fields
ID of the bundle within the app
If Bundle is set
active on the appAdd this snippet as a section in your theme to see the values of the metafield
{% liquid
assign namespace = 'foxbundle'
assign volume_bundle_config = product.metafields[namespace].volume_bundle_settings.value
assign bundle_id = volume_bundle_config.id
assign active = volume_bundle_config.active
assign widget_settings = volume_bundle_config.widget_settings
assign discounts = volume_bundle_config.discounts
%}
<p><strong>Bundle ID: </strong>{{ bundle_id }}</p>
<p><strong>Available Variant Ids: </strong>{{ volume_bundle_config.variants }}</p>
<p>
<strong>Active: </strong>
{{ active }}
</p>
<p><strong>Widget Settings:</strong></p>
<p>{{ widget_settings | json }}</p>
<p><strong>Discounts:</strong></p>
{% for discount in discounts %}
<p><strong>Title: </strong>{{ discount.title }}</p>
<p><strong>Quantity: </strong>{{ discount.quantity }}</p>
<p><strong>Percentage: </strong>{{ discount.value }}%</p>
{% endfor %}
{% schema %}
{
"name": "FoxSell VB Snippet",
"tag": "section",
"blocks": [],
"settings": [
],
"presets": [
{
"name": "FoxSell VB Snippet"
}
]
}
{% endschema %}
Below is a simplified example that uses the
fetch API to add a bundle to the cart.A unique bundle identifier is generated using the bundle ID (assumed to be stored in a variable called bundleId) and product ID. This identifier is passed as a line item property, __foxsell:volume_bundle_id.const identifier = `${bundleId}_${productId}`
const formData = {
items: [
{
id: 5642421514254, // variant id
quantity: 5,
properties: {
"__foxsell:volume_bundle_id": identifier
}
}
]
}
fetch(window.Shopify.routes.root + 'cart/add.js', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(formData)
})
.then(response => {
return response.json();
})
.catch((error) => {
console.error('Error:', error);
});
Add this snippet in your
liquid file to access bundle config via window.foxsell object{% liquid
assign namespace = 'foxbundle'
assign volume_bundle_config = product.metafields[namespace].volume_bundle_settings.value
assign bundle_id = volume_bundle_config.id
assign active = volume_bundle_config.active
assign widget_settings = volume_bundle_config.widget_settings
assign discounts = volume_bundle_config.discounts
assign selected_variants = volume_bundle_config.variants
%}
<script>
window.foxsell = window.foxsell || {};
window.foxsell.bundleConfig = {
id: "{{ bundle_id }}",
active: {{ active }},
discountTiers: {{ discounts | json }},
product: {{ product | json }},
widgetSettings: {{ widget_settings | json }},
selectedVariantIds: [
{% for selected_variant in selected_variants %}
'{{ selected_variant | replace: "gid://shopify/ProductVariant/", "" }}',
{% endfor %}
]
}
</script>