Docs

Shopyflow Components

Shopify Storefront API data and cart logic is bound to your Webflow elements through Shopyflow attributes. Any Webflow element that has a Shopyflow attribute is called a Shopyflow Component. In the list below you can find all the available Shopyflow Components.

ComPONENT REFERENCE

Buy Module

Selling Plan Selector Contaier

Purchase option selector container.
Attribute Name
sf-change-selling-plan
Attribute Value
True or 1

Selling Plan Selector

Changes the selling plan
Attribute Name
Attribute Value
True or 1

Product Image Slider

Dynamic Product Image slider.
Attribute Name
Attribute Value
True or 1

Unavailable variant option state

Customise the unavailable state of Custom Option Value
Attribute Name
sf-option-unavailable
Attribute Value
True or 1

Active Variant Option State

How to customise the selected state of Custom Option Value
Attribute Name
sf-active
Attribute Value
True or 1

Cart Module

Cart Container

Cart wrapping container.
Attribute Name
sf-cart
Attribute Value
True or 1

Cart Items List

Looping container for Cart Items.
Attribute Name
sf-cart-list
Attribute Value
True or 1

Cart Module

Attribute Name
Attribute Value
True or 1

Cart Item

Cart item container.
Attribute Name
sf-cart-item
Attribute Value
True or 1

Cart Item Title

Cart item product title displayer.
Attribute Name
sf-show-title
Attribute Value
True or 1

Product Listing Module

Taxonomy Filter

Product filtering component based on the Shopify product organization taxonomies
Attribute Name
Attribute Value
True or 1

Option Filter Wrapper

Attribute Name
sf-option-filter
Attribute Value
True or 1
{Option Name}

Option Filter Value

Option filter changer
Attribute Name
sf-filter-value
Attribute Value
True or 1
{Option Value}

Option Filter

Product filtering component based on the Shopify product variants.
Attribute Name
Attribute Value
True or 1

Filter Reset Button (Taxonomy)

Taxonomy filter selection reset button
Attribute Name
sf-filter-reset
Attribute Value
True or 1

Customer Accounts

Login Form

Attribute Name
Attribute Value
True or 1

Login Form Container

Login form container.
Attribute Name
sf-login-form
Attribute Value
True or 1
1 or True

Logout Link

User log out button.
Attribute Name
sf-logout
Attribute Value
True or 1

Login Email Field

Email collecting field
Attribute Name
sf-email
Attribute Value
True or 1

Login Password Field

Password collecting field
Attribute Name
sf-password
Attribute Value
True or 1

Other Components

Currency Selector Module

Currency switcher as a Webflow Dropdown element.
Attribute Name
Attribute Value
True or 1

Currency Selector

Store currency selector input.
Attribute Name
sf-change-currency
Attribute Value
True or 1

Currency Selector Value

Store currency selector button.
Attribute Name
sf-currency-value
Attribute Value
True or 1
{Currency Value}

Currency Selector Wrapper

Store currency selector container.
Attribute Name
sf-change-currency
Attribute Value
True or 1

Currency Displayer

Store currency displayer
Attribute Name
sf-show-currency-selection
Attribute Value
True or 1