One of the most exciting ways to offer payments, donations, and items in your Webflow website is with PayStand's Direct Checkout Buy Buttons. Again each of your PayStand's items automatically has button code that can be copied and pasted into your website as easy as embedding a YouTube video. When these buttons are clicked, an inline 1-click checkout receipt appears over your website for directly checkout.
Sample Website: Sample PayStand + WebStand Website
Step 1: Setup Your WebFlow
To learn how to setup your new page go to WebFlow University: http://tutorials.webflow.com/ Once you have your initial WebFlow website setup, find a place you would like to put a Add To Cart or Payment Button.
Step 2: Choose Where to Place Your Buttons
Your buttons can be placed anywhere on your website. You can take a donation or a payment from the header, you can put product items under images, or even build an entire product page around each buy button. Placement options are up to your imagination and creativity. No matter where you decide to place your buttons, once clicked a 1-click direct checkout receipt will appear over your site.
Step 3: Drag & Drop an "Embed" icon from "Layout Menu" into Select Areas
Step 4: Copy your PayStand Button Embed Code
From your PayStand Dashboard find the item you'd like to add a button for. Hover over that item until you see the card flip over. Click the "Share Item" button to bring up the embed/share promote options. After hovering over "Buy Button" copy the button embed code you would like to show up on your page. You can grab the embed code for other items in a similar fashion.
Step 5: Paste your PayStand Button Embed Code to WebFlow Website
After double clicking the Embed section on your WebFlow website page, paste your PayStand embed code into the popup HTML code widget. Pro Tip: In the embed code, you can change the text that appears on the button (ie. Change "Pay" to "Online Payment")
Step 8: Publish your Page to See New Buttons
Click on the Rocketship Icon in the upper left hand corner to publish your site. Enjoy easy stores and payments with direct checkout in your Webflow website. Manage your store from your PayStand dashboard and changes are instantly made wherever you have your PayStand available.
Step 9: Bonus: Customize your Direct Checkout Experience
Your receipt and direct checkout experience can be customized to match the look and feel of your WebFlow website. Checkout our blog on Customizing your WebStand to learn more.