How to embed Subbly on Weebly

Since we have plenty of customers using Weebly for their site, it would be really useful for them to know how they can easily integrate their Subbly product checkouts on their existing Weebly store. Read on..

Before we proceed with the instructions, for those of you that are more comfortable with the actual video walkthough πŸ“Ί you can find one below πŸ‘‡

There are basically 2 ways of integrating Subbly to your Weebly page to allow you to accept recurring payments:

  1. Create a separate button on your Weebly site and link it to the Subbly product checkout page. Note that this will open a checkout in the separate tab and will move customers away from your site to checkout.
  2. Embed Subbly product checkout to your Weebly website. This will create a button on your existing page and will invoke a checkout in a popup directly on site. Useful if you don't want your customers to feel like they are being taken off of your Weebly page πŸ˜‰
Subbly has also a featured app on Weebly's app store which you'll be able to install directly from there. However, this requires a paying plan on Weebly, whereas in this article will show you how to embed the Subbly's products onto your Weebly page even if you're on the free trial plan 😎

For the purpose of this tutorial we will use some generic Weebly theme and just show you how to create a button on it and how to link it to your product created on the Subbly admin.

First of all, you will need to choose to add a button to a desired place underneath product description while on Weebly web builder. Drag and drop button element.

You will be able to customize the styling of this button directly through the context menu on Weebly. You can change the likes of color style, font family, size of the button or caption πŸ˜‰

Next we will need a Subbly product unique URL. In order to obtain one, go to your Subbly admin and paste the Checkout Product URL from your product's page.

Of course, you will need to create a product before that. You can do it from here.

We have detailed instructions on how to build products on Subbly πŸ‘‰ here.Β 

Paste the Checkout URL to an appropriate field on your Weebly button editor. Click on Link, choose Website URL option and paste the code provided on Subbly.

And that's it! 😊 The checkout will now open in a new tab whenever someone clicks on this button.

How to embed Subbly product checkout to your Weebly page?

In this subsection, we will guide you on how to embedΒ your Subbly checkouts to your Weebly page by adding an Embed Code block to it.

Main benefit of doing this is to keep the entire checkout experience on the same page, without the need for the customer to be redirected to a separate page in order to finish the checkout. If you embed Subbly product checkouts to your Weebly page, they will appear as a pop-up on your (Weebly) site.

So, first you'll need to choose to add Embed Code and to drag and drop that element to a desired position, just like in the picture.

It's time for us to get back to our Subbly product listing page and to extract an embed code for our Subbly product we want to embed on our Weebly page.

Go here and click on Action --> Embed from the menu to the right of the desired product.

You will be redirected to the Widget BuilderΒ page on Subbly where you will be able to change the looks of your button. After you've finished customizing it, make sure to copy the chunk of widget embed code generated...

...and paste it in the appropriate field on your Weebly page.

Don't forget to save your progress after that and to PublishΒ the store!

Congrats! πŸŽ‰ You just embedded Subbly product checkout to your Weebly page 😊

Your product checkout will now appear as a pop-up after someone clicks on the SubscribeΒ button you just embedded.

If there are any questions you might have, feel free to shoot an email to support@subbly.co anytime or simply use the chat widget you can find down below πŸ’¬

How did we do?

How to embed Subbly to Shopify

How to embed Subbly to Wordpress?

Contact