The Available In component displays the list of states and certain delivery methods customers can receive alcoholic products to. As your licenses and available delivery methods change, the component will automatically update.

HTML Element

Insert the following HTML to include the Available In component:

<div class="vs-available"></div>

Settings

There are four sections that can be displayed. By default three are displayed when there is data to display.

• Available In
  • States in which the producer can ship alcoholic products to.
• Available In -> Other Delivery
  • Shows Pick-up and local delivery options, if either are available.
• Restricted
  • States in which some alcoholic products can not be shipped to.
• Unavailable In [not enabled by default]
  • States in which no alcoholic products can ship to.

To modify the display of these sections, see Settings.

Use with Product Catalog

When using Product Catalog, you will need to manually turn off including the "Available In" component.

Global Configuration (recommended)

The simplest way is to set the productCatalogAvailable in Configuration to false. This will force all instances of Product Catalog to not show the Available In component without needing to further modify HTML.

Per Product Catalog

You can also add the attribute data-vs-available="false" to the HTML. This will overwrite the global setting for the particular instance of the Product Catalog.

<div class="vs-products" data-vs-available="false"></div>