When you set up your Store, you can add a Shopping Bag widget to your website so that users can navigate to their cart and check out after adding products, regardless of which page they're viewing.
To set up a Shopping Bag widget:
1. Navigate back to the Content panel on the Websites 360 dashboard, then select Footer in the top-right corner of the page, under the section labeled Global Content.
2. Add an HTML block to the footer by clicking the green (+) button and selecting HTML from the menu that appears. In the newly-created HTML Block, paste the following code to display the Shopping Bag widget:
<!--SHOPPING BAG-->
<div data-responsive="TRUE"
data-show-buy-animation="TRUE"
data-layout="MEDIUM_ICON_COUNTER"
data-fixed="TRUE"
data-fixed-position="BOTTOM_RIGHT"
data-fixed-shape="PILL"
data-horizontal-indent="20"
data-vertical-indent="20"
data-icon="CART"
data-show-empty-cart="TRUE"
class="ec-cart-widget">
</div>
<div>
<script data-cfasync="false" type="text/javascript" src="https://app.shop.websites360.com/script.js?xxxxxxxx&data_platform=code" charset="utf-8"></script>
<script>Ecwid.init();</script>
</div>
Note: You can change the location of your Shopping Bag icon by changing the information in the data-fixed-position field to "BOTTOM_LEFT", "TOP_LEFT", or "TOP_RIGHT", as well as adjust the icon's padding by editing the numerical values in the data-horizontal-indent and data-vertical-indent fields.
3. Replace 'xxxxxxx' with your store ID from. Pro Tip: Use the Find & Replace feature!
You can find your store ID in your Shop App dashboard. Click Shop App from the Marketing 360 dashboard or from the App Menu near the top left corner of the page.
The result will be a 'floating' widget in the top right corner of the browser that displays once the user adds a product to their shopping bag.
4. Save the HTML block.
Note: It's important to make sure that all pages on the site use the global footer. This allows the Shopping Bag widget to be displayed on all pages.
Comments
0 comments
Article is closed for comments.