Getting PayWhirl set up can involve a bit of coding, but we tried to simplify things as much as possible. We are also here to help if you have any questions along the way.

Step 1 - Select the theme you want to use for PayWhirl

In this example, I will be using the latest version of the debut theme. Many of the steps shown below will work for the other themes:

Note: Some themes installs may require a developer to help implement. However, many will work if you follow the basic set up instructions below:



Step 2A - Install PayWhirl Snippets Automagically (RECOMMENDED)

We can automatically install our snippets into your theme in most cases. On the installation page in the app, you'll see several buttons to help install your theme snippets automagically. Nothing will be visible to customers until you add subscriptions to your product pages in Shopify.

The first button, "Install PayWhirl Snippets" will install our product page and settings snippets into your theme along with a javascript file called "paywhirl.js." You can find these in your theme in the snippets and assets folder after install.

Note: We also provide the manual instructions for each step if you'd prefer to do it manually or have issues with the automatic install method.

The next button will install the "paywhirl-main" include in your main theme.liquid file before your closing </body> tag.

The cart snippet is up next and is not required on all themes. Beginning in November 2020, Shopify requires theme developers to support selling plans in the cart out of the box. You should wait to complete this step until after you've tested adding a subscription product to the cart. If you can already see selling plans in your cart, you can skip this step.

The next snippet installs the subscription customer portal in your Shopify store. It will be accessible when customers log in to your site on the account page.

After you've added the customer portal snippet you'll need to add a link somewhere in your account page theme file. When customers click this link it will load the customer portal on the account page in Shopify.

You can install the portal link anywhere in your account theme file but it usually looks best next to the logout link or in the sidebar menu.

Step 2B - Install PayWhirl Snippets (MANUAL METHOD)

You can also install the snippets manually if you'd prefer, or if you have any issues with the automatic installation method. Below we'll show you how to install the snippets manually, if necessary.

Add the "paywhirl-main" include to your theme.liquid file.

The link will open up the theme editor in Shopify. You will see a bunch of code. Scroll down to the bottom of the page and paste the snippet right before the </body> tag.

Make sure to click save after adding the snippet.


Add the cart snippet to your theme manually.

Copy the example code in the cart instructions of your installation location. In debut it is <ul class="product-details" or {% assign property_size = ... %} depending on when you installed your debut theme. Also, note if you'll be REPLACING code or pasting BEFORE/AFTER the install location example.

Then click the link in the instructions to open your cart theme file. Click in the code section and type CTRL F (or command F on Mac) to bring up a search bar. Paste the installation location to search the file for the install location.

Note: If you are not able to find the install location, remove any blank spaces in the search bar. If you still can't find it, please reach out to our team. Some cart files use different code, depending on when you installed your theme).

Also, your instructions may have you paste before or after the example location code. Please make sure you follow the specific instructions on the install page in the app. We're here if you have any questions.

Highlight and delete the code from the <ul class="product tag through the closing </ul> tag several lines down. Don't worry, you can always revert the version of the theme file if anything breaks.

Go back to your other browser tab and copy the cart snippet under section 5 on the PayWhirl app install page. Paste that snippet in the blank spot where you deleted the code, and click save.

Note: Shopify is working on implementing this step automatically on their themes. However, if you have customized your theme and are using an older version, you will likely need to follow the steps above to install the cart snippet.

Installing the portal snippets manually.

Copy the first code snippet and click the link to your theme file.

Paste the customer portal snippet at the very bottom of the customer account file.

Go back to your other browser tab and copy the second code snippet for the portal, under section 6 on the PayWhirl app installation page. This snippet goes towards the top of the page right above the "customer_logout_link":

Click Save. That's it!

If you made it this far give yourself a pat on the back! You are ready to associate your selling plans with products in Shopify. This will be done from your product page(s) in Shopify. Please see our full setup guide for more details.


Need help troubleshooting?

If you are having issues installing your theme snippets, we're here to help. Please reach out through our support widget and we'll do our best to assist. We can help with basic theme install support, however, if for any reason we are unable to help, we can refer you to 3rd party Shopify developers who can troubleshoot any remaining issues (for a fee).


Related Articles:

If you have any questions or concerns please reach out to our support. We're happy to help.

Sincerely,

Team PayWhirl

Did this answer your question?