Setup guide · Webflow

Sell with crypto on your Webflow site

Ten minutes from installing the app to a live product card. You will need a PaySovra account with at least one product, and a Webflow site you can edit and publish.

1

Install the app

In the Webflow Marketplace, open PaySovra and press Install, then choose the site. The app appears in that site’s Designer under the Apps panel, which you open with the E key or the puzzle-piece icon in the left bar.

2

Connect your account

Open PaySovra in the Apps panel and press Connect PaySovra. A tab opens on paysovra.com. Sign in if you need to, check the site name, and press Approve. Back in the Designer the panel shows your store name and your products.

The connection is a key for that one site that can only read your product list. The site counts as one website on your plan; its webflow.io staging address and its custom domain count together as one.

3

Place a product

Search the list, then press Card for a photo, name, price and button, or Button for the button alone. The element lands where you have something selected, or at the end of the page. Cards placed one after another sit side by side.

Cards are ordinary Webflow elements with the classes PaySovra Product and PaySovra Button. Restyle those classes once and every card on the site follows.

4

Publish and try it

Press Publish. On the live site, press the button on a card: your PaySovra checkout opens over the page, full screen on a phone. Buy something small from yourself. The order appears in PaySovra marked Sold through · Webflow with the site it came from.

Anything you change in the Designer, and the checkout script itself, reaches the live site only when you publish.
5

Keep selling

Change a price, a name or a photo in PaySovra and every published card follows on the next visit. Rename a product and its links keep working. Switch a product off and its card says so and leads customers to your newest product instead. There is nothing to republish for any of this.

In the Designer, opening the PaySovra panel refreshes the cards on the page to match, so what you see while editing is what is live.

6

Disconnect, if you ever need to

Press Disconnect at the top of the panel, then press it again to confirm. PaySovra removes the checkout script from the site and revokes the site’s key. Publish once more to take the script off the live pages. Cards you placed stay as plain links to your product pages.

If something looks off

Pay opens a new page instead of the overlay
The checkout script isn't on the live site yet. Either it was never installed, or the site hasn't been published since.
Open the PaySovra panel. If it shows Install or Update, press it, then publish the site. The button's link always works in the meantime, so no customer is stuck.
The panel says this site isn't connected
The connection belongs to the browser you made it in, or it was disconnected.
Press Connect PaySovra and approve again. Buttons you placed earlier keep working and pick up the connection on the next panel refresh.
A card in the Designer shows an old price
The Designer shows what was there when you placed the card; the live site is always current.
Open the PaySovra panel. It refreshes every card on the page to the current name, price, photo and link, and tells you how many changed.
A button reads “No longer available”
That product was removed or switched off in PaySovra.
Replace the card with another product, or switch the product back on. Its link still leads customers to your newest product in the meantime.
The panel offers an Update
A newer checkout script is available.
Press Update, then publish the site. Published sites keep the version they were published with until you do.

Still stuck? Write to support@paysovra.com with the site address and we will look at it with you.