How do I add a Delm widget to my theme?
You may integrate widgets either through the `Delm Widget`app block or by adding the app block code to .liquid templates.
With the Delm Widget block, widgets can be easily integrated via the Shopify visual theme editor, without the need for programming skills.
If your theme does not support app blocks, you can integrate widgets into .liquid templates.
You may use the <delm-widget> HTML element to integrate widgets into .liquid templates.
Please ensure that the Delm Core app embed is enabled in your theme settings.
You can use the following code snippet to integrate widgets into your into .liquid templates.
The name of the product object may vary depending on the context. Please ensure that the correct object is used to access the product information.
The following attributes are supported by the <delm-widget> element. All attributes are optional.
Using app block
With the Delm Widget block, widgets can be easily integrated via the Shopify visual theme editor, without the need for programming skills.
If your theme does not support app blocks, you can integrate widgets into .liquid templates.
Using Liquid
You may use the <delm-widget> HTML element to integrate widgets into .liquid templates.
Please ensure that the Delm Core app embed is enabled in your theme settings.
Code example
You can use the following code snippet to integrate widgets into your into .liquid templates.
<delm-widget data-variant-id="{{ product.selected_or_first_available_variant.id }}"></delm-widget>
The name of the product object may vary depending on the context. Please ensure that the correct object is used to access the product information.
Element attributes
The following attributes are supported by the <delm-widget> element. All attributes are optional.
Attribute | Description |
---|---|
data-widget-id | Load a specific widget by it's ID. Leave empty to load default widget. |
data-variant-id | Link a product variant to this widget to display product specific data. |
Updated on: 21/01/2025
Thank you!