Troubleshooting Display Settings in Bold Subscriptions

 Pro-Tip

Please note that this article only relates to Version 1 of Bold Subscriptions. If you have Version 2 of Bold Subscriptions installed on your store, please visit Troubleshooting Bold Subscriptions V2.

If you are unsure of which version of Bold Subscriptions that you have currently installed, please visit Bold Subscriptions V1 & V2 Comparison.

Overview

Bold Subscriptions V1 is an app that is packed with so many features and options built within in. Since there is a lot to create and set up, there is the potential that things may not display how they should. 

Here are the most common fixes that can be applied to troubleshoot your Display Settings in Bold Subscriptions V1:

 


 

During the initial setup of Bold Subscriptions or if you recently switched to a different theme, you may encounter issues with the subscription widget not appearing on the product page. While this can be caused by a variety of different issues, the most common cause of this issue is missing or misplaced liquid code in the theme.

If you have recently installed Bold Subscriptions V1 on your store or changed to a different theme, we recommend following the install instructions for Bold Subscriptions V1 to ensure all of the liquid code is present in your theme.

If the subscription widget is appearing for some products but not for other products that were recently added to a subscription group, you may need to clear the cache for Bold Subscriptions to sync the subscription properties to the storefront. Please visit Caching in Bold Subscriptions for more information on clearing the subscription cache on your store.

Note: If you would simply like to move the subscription widget to a different location on the product page, you can do so by moving the line of code in your theme's liquid code. The widget can only be placed anywhere within a <form> or {%form%} on the product page.

<div class="ro_widget"></div>

 

The "See Details" feature can be enabled on your store to display more information about your subscriptions. If you have enabled this setting, but are not seeing it appear on your storefront - then we would recommend reviewing the display settings.

If the text for this feature is the same color as your stores background, it will appear to be invisible or appearing in the background.

To review this setting and change the color if applicable, please follow these steps:

  1. From Shopify's admin, select Apps.
  2. Select Bold Subscriptions V1.
  3. Select Settings, then Display Settings.
  4. Within the "Product Page Widget" tab, scroll down to More Details Hover Box.
  5. Adjust the Background Color and/or Font Color to ensure it stands out from your themes color.

    See Details Feature Display

  6. Select Save.

If this area is still not appearing, it could benefit from a refresh of the Subscriptions cache, here.

There are a few things that can cause the checkout to display a $0 when buying a subscription. Most of the time it's because of a symbol in your product description, specifically the equals sign (=). If your product description has a "=" sign in it, please try removing it and attempting to checkout again.

To review your Shopify product description to resolve this trouble, please follow these steps:

  1. From Shopify's admin, select Products.
  2. Select the product that is displaying as $0.
  3. In the "Description field, check for and remove the "=" symbols if they are present.

    Shopify Product Description

  4. Select Save.

If the continue button doesn't work on your Bold Subscriptions V1 checkout page, it may be because you have a password set up on your Shopify storefront. You can verify this by typing your Shopify URL in the address bar of your web browser. If you are taken to your stores URL with /password at the end, then this is the problem.

Subscriptions will not function when the storefront is password protected. Please follow these steps to remove the password from your storefront:

  1. From Shopify's admin, select Online Store.
  2. Select Preferences.
  3. Scroll down to "Password Page"
  4. Deselect Enable password page to disable it.
  5. Select Save.
    Note: If you are still testing your store and haven't launched it yet, you can re-enable the password page when you are finished testing Bold Subscriptions V1.

The other solution to resolving this problem could be using Fixed Shipping Rates in Bold Subscriptions V1. If you set up a fixed shipping rate for a country, you should be able to enter a shipping rate address within that country and place a test order (even with a storefront password). This workaround only applies to fixed shipping rates created for Canada, and the United States.

Please remember to remove the fixed shipping rate before your store launches, or our app won't know to use your Shopify shipping rates instead (if that's your intent).

For customers who are currently signed in to your store and have an active subscription, they should see an "Add to Existing Subscription" button appear on your product page. This will appear near the "Add to Cart" button, and allows your customers to add new products to their existing subscriptions.

If the button isn't showing up, please follow these steps to fix it:

  1. From Shopify's admin, select Online Store.
  2. Select Actions on your theme.
  3. Select Edit Code.
  4. Under "Templates", select product.liquid.
    Note: 
    If your theme contains sections you may need to open the product-template.liquid under "Sections" instead.
  5. Find The add to cart input:
    <input id="addToCart" class="btn" name="add" type="submit" value="add to cart"/>
  6. and add this class:
    class="{{ bold_add_to_cart_class }}"
    If you don't see this code, then you'll have to create one. The code should look something like this:
    <input class="btn {{ bold_add_to_cart_class }}" name="add" type="submit" value="add to cart"/>
  7. Below this code, add:
    <!-- bold-ro-liquid --> <div class="bold_add_to_orders" style="display: inline-block;"> </div> <!-- bold-ro-liquid -->
  8. Select Save.

Since this requires a more technical fix, please feel free to contact our Merchant Success Team should you require any additional assistance with resolving this.

Depending on your theme's style settings you might end up with "add to cart" and "add to subscription" buttons on top of each other instead of beside each other. 

To have the buttons appears next to each other, please follow these steps:

  1. From Shopify's admin, select Online Store.
  2. Select Actions.
  3. Select Edit code.
  4. Under "Assets", select your theme's main CSS file.
    Note: This will vary by theme and could be something like theme.scss.liquid.
  5. Find the class below:
    .product-form__cart-submit
  6. Add this CSS styling to it:
    float: left; 
    margin-right: 5px;
  7. Select Save.

If the widget is not appearing on the featured product on the home page of your store, it is possible that it is not being added to the Bold.common.Shopify.variants objects. To add the featured product to the object, please follow these steps:

  1. From the Shopify admin, navigate to Online Store.
  2. Select Edit code on the theme you'd like to make these changes on.
  3. Find the liquid file that is using the featured-product display on the home page.

    Note: This liquid file could be located in sections, snippets or templates.

  4. At the top of the file, paste the following code:
    <script>
    {%- comment -%} product page {%- endcomment -%}
    window.BOLD.common.Shopify.saveProduct({{ product.handle | json }}, {{ product.id | json }});
    {%- for variant in product.variants -%} window.BOLD.common.Shopify.saveVariant({{ variant.id | json }}, {product_id: {{ product.id | json }}, product_handle: {{ product.handle | json }}, price: {{ variant.price | json }}, group_id: '{{variant.metafields.bold_rp.rp_group_id}}'}); {%- endfor -%}
    </script>
 Caution

If the liquid product variable is named something different than product, make sure to adjust the product variable in the snippet code above to match.

Was this article helpful?
0 out of 0 found this helpful