HTML Element Settings

The following settings can be set for each individual HTML code and are reactive.

data-vs-product-id (Required)

Type: Number

Defines the product. If adding a product that isn't associated with the producer's ID number, see data-vs-account-id.

data-vs-account-id

Type: Number
Default: Producer ID defined in Vinoshipper.init().

If your site includes products across different producer IDs, define this variable with the producer ID matching the product.

data-vs-cards

Type: Boolean
Default: false

When false, Product Item will render in the Lists layout.
When true, Product Item will render in the Cards layout.

See Product Catalog: Layouts for more information.

data-vs-product-image

Type: Boolean
Default: true

To prevent the product image from displaying, set this variable to false or 0.

data-vs-desc-force

Type: Boolean
Default: false

When false, the Product Item will render the "Show/Hide Description" actions, except when in list layout and the element is larger than 504px.

When true, the Product Item will always show the full description of each product and not render the "Show/Hide Description" actions, regardless of the layout and the width of the Product Catalog element.

data-vs-theme

Type: String | undefined
Default: undefined

Overwrites the global theme setting for the particular component instance.