In some subscription use cases, you may want to restrict customers from skipping or cancelling specific plans - for example, prepaid plans, commitment-based subscriptions, or special pricing tiers.
By default, the Recurpay customer portal allows customers to manage their subscriptions freely, including skipping or cancelling. However, using custom JavaScript and CSS, you can selectively remove these options for specific plans, ensuring better control over your subscription experience.
In case you want minimum order cancellation policy to apply on all plans, you can refer to this article.
Why remove skip and cancellation for specific plans?
Enforce commitment-based plans
For prepaid or minimum commitment subscriptions, preventing skip or cancellation ensures customers complete the intended billing cycle.
Protect discounted or special pricing plans
Plans offering exclusive pricing or benefits can be safeguarded from misuse by restricting cancellation or skipping up to minimum order commitment.
How it works?
This setup works by identifying a specific subscription plan (or product) in the customer portal and conditionally hiding or removing the skip and cancellation options using custom JavaScript and CSS.
Step 1: Navigate to Customer portal custom code section
Settings > General > Customer Portal
We will add our custom JavaScript or CSS in this section.
Step 2: Identify the target plan
To apply this logic, you need a unique identifier for the plan you want to target. This could be:
Plan name (most common)
Plan Id
You can get the plan name via Plans page in the Recurpay admin panel or plan id from url params.
Step 3: Add JavaScript to Remove Skip and Cancel Options
There could be different scripts based on how you are looking to remove skip or cancellation options.
Option 1: Target by Plan ID
<script>
$(document).ready(function() {
// Replace with your actual plan ID
var targetPlanId = 19497;
if (window.recurpay_account && window.recurpay_account.subscription) {
var subscription = window.recurpay_account.subscription;
if (subscription.plan && subscription.plan.id === targetPlanId) {
// Remove skip subscription option
$('#js-skipSubscription').remove();
$('.skip-subscription-revamp').remove();
$('#js-skipSubscriptionReason').remove();
// Remove cancel subscription option
$('#js-cancelSubscription').remove();
$('.cancellation-wrapper').remove();
}
}
});
</script>
Option 2: Target by Plan name
<script>
$(document).ready(function() {
// Replace with your actual plan name
var targetPlanName = "Monthly Subscription";
if (window.recurpay_account && window.recurpay_account.subscription) {
var subscription = window.recurpay_account.subscription;
if (subscription.plan && subscription.plan.name === targetPlanName) {
// Remove skip subscription option
$('#js-skipSubscription').remove();
$('.skip-subscription-revamp').remove();
$('#js-skipSubscriptionReason').remove();
// Remove cancel subscription option
$('#js-cancelSubscription').remove();
$('.cancellation-wrapper').remove();
}
}
});
</script>
Option 3: Check minimum number of orders renewed on subscription before removing cancellation or skip option
<script>
$(document).ready(function() {
// Configuration
var minOrderCount = 3; // Minimum orders required
var targetPlanId = 19497;
if (window.recurpay_account && window.recurpay_account.subscription) {
var subscription = window.recurpay_account.subscription;
// Check if total orders is less than minimum AND plan ID matches
if (subscription.total_orders < minOrderCount &&
subscription.plan &&
subscription.plan.id === targetPlanId) {
// Remove skip subscription option
$('#js-skipSubscription').remove();
$('.skip-subscription-revamp').remove();
$('#js-skipSubscriptionReason').remove();
// Remove cancel subscription option
$('#js-cancelSubscription').remove();
$('.cancellation-wrapper').remove();
}
}
});
</script>
This script checks the current subscription plan and removes the skip and cancellation actions if it matches your target plan.
Troubleshooting steps:
Ensure the selector is correct - verify the element (
#js-skipSubscription,#js-skipSubscriptionReason,#js-cancelSubscription.product-title, etc.) from cusotmer portal HTMLVerify the plan id and name with the exact value from admin panel or global
window.recurpay_accountobjectTest across multiple subscriptions to ensure the logic only applies to the intended plan
If you face any issues during installation, reach out to our team at help@recurpay.com or click the Instant Call button on your dashboard for real-time assistance. You can also start a live chat anytime we are available 24*7.