This article contains various Liquid tags that you can use to customize your bundles. However, please be aware that we are unable to provide any support for adding Liquid tags or making any customizations to your app or themes.
We only recommend editing code and using Liquid tags if you are experienced in web development. Please seek assistance from a web development service if you require help using Liquid tags.
HeyCarson and StoreTasker are recommended partners of Kitenzo - both specializing in website development and offering free quotes for their services.
add_to_bundle_form
Use this tag to add a product variant to the bundle.
The current section instance has to be used as a parameter to the add_to_bundle_form
tag.
Use input
or select
with name="variant"
inside. The value must be a variant id.
Add a button
with type="submit"
to add a variant to bundle.
Quantity
here controls the quantity selector - this will let the customer change how many items will be added to the bundle when "add" is clicked, however, this is optional and can be removed if preferred.
Example:
{% add_to_bundle_form bundle.current_section %}
<select name="variant">
{% for variant in product.available_variants %}
<option value="##{{ variant.id }}">
##{{ variant.title }}
</option>
{% endfor %}
</select>
<input type="number" name="quantity" value="1" min="1" />
<button type="submit">Add</button>
{% end_add_to_bundle_form %}
remove_from_bundle_form
Use this tag to remove a product from a bundle.
The BundleItem instance should be removed as a parameter.
Inside of the tag, a button
with type="submit"
must be present.
Example:
{% remove_from_bundle_form item %}<br><button type="submit">Remove</button>
{% end_remove_from_bundle_form %}
section_switch_form
You can implement section switching (or just show all the sections at once) by yourself.
You can also use this helper to simplify the process.
Example:
{% if bundle.has_next_section %}
{% section_switch_form %}
<input type="hidden" name="section" value="##{{ bundle.current_section.index | plus: 1 }}" />
<button type="submit">Next</button>
{% end_section_switch_form %}
{% endif %}
{% if bundle.has_prev_section %}
{% section_switch_form %}
<input type="hidden" name="section" value="##{{ bundle.current_section.index | plus: -1 }}" />
<button type="submit">Previous</button>
{% end_section_switch_form %}
{% endif %}
add_to_cart_form
Use this tag to implement adding current bundle configuration as a product to the cart.
Example:
{% add_to_cart_form %}
<button type="submit"{% unless bundle.can_add_to_cart %} disabled="disabled"{% endunless %}>
{% if bundle.adding_to_cart %}
Processing...
{% else %}
Add bundle to cart
{% endif %}
</button>
{% end_add_to_cart_form %}
change_variant_in_bundle_form
Use this tag to implement changing variant of a product that is already added to a bundle.
The BundleItem instance should be passed as a parameter.
Example:
{% change_variant_in_bundle_form item %}
<select name="variant">
{% for variant in item.variant.product.variants %}
<option {% if item.variant.id == variant.id %}selected="selected"{% endif %} value="##{{ variant.id }}">##{{ variant.title }}</option>
{% endfor %}
</select>
{% end_change_variant_in_bundle_form %}
note_field
Use this snippet to add a note to a bundle.
Example:
{% if settings.note_enabled %}
<div class="note-field--container">
<label>##{{ settings.note_label }}{% if settings.note_required %} (required){% endif %}</label>
{% note_field %}##{{ settings.note_text }}{% end_note_field %}
</div>
{% if settings.note_prompt_visible %}
<div className="note-field--error-message">
<p>Note required before adding to cart.</p>
</div>
{% endif %}
{% endif %}
remove_from_bundle_form
Use the above tag to remove a product(s) from a bundle.
The BundleItem
or UniqueBundleItem
instances should be used as a parameter.
add_to_cart_form
Use this snippet:
{% add_to_cart_form %} <button type="submit"{% unless bundle.can_add_to_cart %} disabled="disabled"{% endunless %}> {% if bundle.adding_to_cart %} Processing... {% else %} Add bundle to cart {% endif %} </button>{% end_add_to_cart_form %}
change_quantity_form
Use the above tag to add a quantity selector for each variant after it has been added to the bundle:
{% for variant in product.variants_in_bundle %}
{% change_quantity_form %}
##{{ variant.title }}
<input type="hidden" name="variant" value="##{{ variant.id }}" />
<input type="hidden" name="section" value="##{{ bundle.current_section.index }}" />
<button type="submit" name="remove">-</button>
##{{ variant.count }}
<button type="submit" name="add">+</button>
{% end_change_quantity_form %}
{% endfor %}
bundle.id ==
This tag can be used to edit the design on a specific bundle page. Insert the bundle's unique numerical ID at the end, then you can add customizations without affecting other pages.
Bundle IDs can be found in the bundle URL (e.g. 110)
Example:
{% if bundle.id == 110 %} Template for bundle with ID 110 {% else %} Template for all other bundles {% endif %}