This code snippet adds the ability to show and hide page elements based on the account billing stage (trialing, subscribing, canceled, past due, etc). It works similarly to how the Outseta nocode module already lets you hide and show page elements based on the plan and more.

Copy and paste the code between <!-- ✨ Custom Snippet Start ✨ --> and <!-- ✨ Custom Snippet End ✨ --> from the demo below.

Then add the data-account-stage attribute to the elements you'd like to control based on the account billing stage. Use a comma-separated list of account billing stages that should be shown the page element:

<div data-account-stage="2,3">
Only visbible for AccountStage = "Trialing" or "Subscribing"
</div>

The account stage attribute may be combined with for instance data-o-plan-content.

<div data-account-stage="2" data-o-plan-content="L9Pxnp9J">
Only visible for AccountStage = "Trialing" and Plan Pro ("L9PozjQJ")
</div>

For a complete list of all billing stages, go to Account Billing Stages Explained.

Full demo on Code Sandbox