Set the Subscriptions Widget's Default Option to Subscribe and Save

Follow

Bold Subscriptions allows you to set your subscription options as the default selection on the storefront. Normally the "one time purchase" option is the default, but with a small coding adjustment we're able to change this.

To change the default option, please follow these steps:

  1. From Shopify's admin, select Online Store.

    Select Online Store

  2. Select Actions.

    Select Actions

  3. Select Edit code.

    Select Edit Code

  4. Under "Snippets", select Add a new snippet.

    Select Add a New Snippet

  5. Enter bold-subscriptions-default-option.liquid as the snippet name.

    Enter Snippet Name

  6. Select Create snippet.

    Select Create Snippet

  7. Copy and paste the following code into this snippet:
    <script>
      BOLD.common.eventEmitter.enableLog();
       
      if(window.BOLD && window.BOLD.common && window.BOLD.common.eventEmitter && window.BOLD.recurring_orders){
         
        //recurring cart event emitter listener
        BOLD.common.eventEmitter.on("BOLD_RECURRING_ORDERS_cart_widget_loaded", function(e){
          BOLD.common.preselect_subscribe_recurring_orders_widget(e.data)
        });
     
        //single and multiple product event emitter listener
        BOLD.common.eventEmitter.on("BOLD_RECURRING_ORDERS_widget_loaded",function(e){
          BOLD.common.preselect_subscribe_recurring_orders_widget(e.data.form);
        });
     
        //function added to bold common scope, requires an element higher in hierarchy than the subscribe div
        BOLD.common.preselect_subscribe_recurring_orders_widget =  function (e){
          setTimeout(function(){
            var btn;
     
            //recurring_cart: 0, single_product: 1, mixed_cart: 2
            //if in recurring cart
            if(BOLD.recurring_orders.modes.current_mode == 0){
              btn = e.querySelector('.bold-ro__recurring-div .bold-ro__recurring-radio-btn');
            }
            //if in single product or multiple product
            else{
              btn = e.querySelector('.bold-ro__subscribe-radio-btn');
            }
     
            //if button exists, click it, if not, do nothing
            if(btn){
              btn.click();
            }
          }, 100);
        }
      }
    </script>

    Copy/Paste Code

  8. Select Save.

    Select Save

  9. Under "Layout", select theme.liquid.

    Select theme.liquid

  10. Copy and paste the following code to the bottom of this file:
    {% include 'bold-subscriptions-default-option' %}

    Paste Code

  11. Select Save.

    Select Save

That's it!

Next Steps:

Blog Posts:

0 out of 0 found this helpful

Comments

0 comments

Please sign in to leave a comment.