Table of Contents
Table of Contents
Introducing the "Pricing Calculator" Module: Your Ultimate Pricing Customization Solution
The "Pricing Calculator" module is your go-to solution for creating dynamic, engaging pricing tables. You have the freedom to customize every aspect of your pricing plans, making it easier than ever to tailor your pricing to your audience's needs. Here's what you can expect:
Plan Names: Personalize the names of your pricing plans to reflect the uniqueness of your products or services. This ensures that customers immediately identify which plan suits them best.
Plan Prices: Setting prices for your plans is a breeze. Whether you're offering competitive rates, discounted pricing, or tiered subscription models, you have full control over pricing.
Flexible Units: The module accommodates different units, enabling you to sell items in the quantity that makes sense for your business. Whether it's packages, subscriptions, or individual items, you can specify the unit type and quantity.
Dynamic Slider: At the core of the "Pricing Calculator" module is a powerful range slider. This slider simplifies quantity selection and allows users to increase or decrease units with a single slide. It's an intuitive way to determine the exact quantity they need, and the slider dynamically adjusts the price based on their selection.
Real-Time Price Updates: The real magic happens when users interact with the slider. As they adjust the quantity, the pricing for all plans automatically updates in real-time. This ensures that your customers are always aware of the costs associated with their chosen quantity.
Custom Sync Settings: To provide even greater flexibility, you can enable or disable the price synchronization with the slider. This means you can decide if the prices for certain plans should remain fixed, free, or subject to customization. You can also determine the extent of the price increment or decrement per step of the slider.
Highlight Recommended Plans: You can make specific plans stand out by marking them as "Recommended." These standout plans can be adorned with special styling or text to capture your customers' attention.
Total Plan Customization
With the "Pricing Calculator" module, the possibilities for plan customization are virtually limitless. Here are some of the key elements you can tailor to your liking:
Plan Descriptions: Customize and fine-tune the descriptions for each plan. Provide detailed information about what each plan offers, ensuring your customers have all the information they need to make informed choices.
Plan Features: You have the freedom to add, remove, or customize plan features. Whether it's listing benefits, features, or specifications, you can make each plan unique.
Buttons and Links: Tailor the text and links associated with your pricing plans. Create compelling call-to-action buttons that guide users toward the desired action, whether it's signing up, making a purchase, or learning more.
Style It Your Way
Your brand's identity and aesthetics are crucial, and the "Pricing Calculator" module gives you full control over the visual presentation of your pricing plans. You can customize:
Slider Appearance: Define the appearance of the slider to match your website's design. Adjust the track and thumb colors, as well as the appearance of the value text.
Grid Layout: Modify the width of your pricing plans and the spacing between them, ensuring a seamless, visually appealing presentation.
Backgrounds: Define the background colors for both the plans themselves and the active plan, creating a harmonious and eye-catching layout.
Color Schemes: Customize the text colors for plan names, prices, and features. You can also specify the colors for the active plan, ensuring it stands out.
Borders and Box Shadows: Personalize the border style, color, thickness, border radius, and box shadow for each plan. This level of detail allows you to create a polished and professional look.
Alignment and Spacing: Control the alignment of your pricing plans (left, center, or right) and set the padding for each plan, ensuring they fit seamlessly into your website's layout.
Active Plan Scaling: To make your active or recommended plan even more appealing, you can adjust its text and background colors and even apply scaling effects for emphasis.
Support
If you need assistance at any step of the way; get in touch with us at support@transfunnel.com.
Increment/Decrement Slider: Precision Pricing at Your Fingertips
The Increment/Decrement Slider is a game-changer when it comes to precision pricing. This feature is designed to provide users with fine control over the quantity or units they wish to purchase, resulting in a dynamic and user-centric pricing experience.
Here's a detailed breakdown of how this slider works and the benefits it offers:
Dynamic Adjustment: The slider is prominently positioned at the top of all pricing plans, offering users an intuitive and visually engaging way to adjust quantities. This dynamic element allows users to seamlessly increase or decrease the number of units they want to purchase. As they interact with the slider, the quantity value is immediately updated, providing instant feedback.
Real-Time Price Updates: What sets this slider apart is its ability to dynamically adjust pricing in real-time. As users slide the control, the prices for all plans are automatically updated, reflecting the changes in quantity. This ensures that your customers are always informed about the costs associated with their selected quantity.
Custom Sync Settings: To provide maximum flexibility, the "Pricing Calculator" module allows you to enable or disable the price synchronization feature with the slider. This means you have the power to decide which pricing plans should be subject to dynamic changes based on the slider input and which should remain fixed. Furthermore, you can fine-tune the extent of price increments or decrements that occur with each step of the slider. This level of customization ensures that the module adapts to your specific pricing model, whether it involves tiered pricing, discounts, or any other structure.
User-Friendly Configuration: The Increment/Decrement Slider is designed with a user-centric approach. Administrators can easily set the minimum and maximum values that the slider can reach, ensuring that it aligns with their product or service offerings. Additionally, administrators can specify the increment and decrement values for each step of the slider. This means you have full control over how much the price changes with each adjustment, ensuring that the pricing model remains transparent and easy to understand.
Enhanced User Experience: The slider's interactive and real-time nature elevates the overall user experience. Customers can experiment with different quantities and immediately see how it affects their pricing, providing them with a sense of control and transparency. This can lead to increased user satisfaction and a higher likelihood of conversion.
In summary, the Increment/Decrement Slider is a powerful tool within the "Pricing Calculator" module that enhances pricing customization, transparency, and user engagement. It empowers users to fine-tune their orders, see the immediate impact on pricing, and make informed decisions. Administrators, on the other hand, benefit from the ability to configure the slider to align with their unique pricing strategies and business requirements.
Repeater Feature: Infinite Possibilities for Pricing Plans and Features
The Repeater Feature in the "Pricing Calculator" module offers unmatched flexibility when it comes to designing your pricing page. With this feature, you can effortlessly create, customize, and repeat pricing plans and features, ensuring that your pricing page is tailored to your specific business needs. Here's a comprehensive look at how this powerful feature works:
Repeating Pricing Plans:
-
Up to Six Plans: The Repeater Feature allows you to create and repeat pricing plans up to six times. This is particularly useful for businesses offering a variety of subscription levels, product packages, or service tiers. Whether you have three plans, four plans, or the full six, you can easily add and tailor each one to cater to different customer segments.
-
Customization: Each repeated pricing plan is a canvas for customization. You can give each plan a distinct name, set its pricing, specify the unit type, and choose the quantity or units included. This customization ensures that each plan accurately represents the unique offering it entails.
Seamless User Experience:
-
Intuitive Organization: The repeated pricing plans and their associated features are neatly organized, ensuring a structured and user-friendly layout. This aids users in quickly comparing the different offerings and making informed decisions.
-
Effortless Navigation: Users can effortlessly scroll through the plans and their features, making it easy to understand the value of each offering. The organized and streamlined interface contributes to a positive user experience, ultimately driving conversion and engagement.
Responsive Design:
- Adaptability: The module is designed with a responsive approach in mind. Pricing plans and features adjust to fit different screen sizes and devices, guaranteeing that your pricing page looks great and functions smoothly on desktops, tablets, and mobile devices.
Content Customization: Your Brand, Your Message
The Content Customization Feature within the "Pricing Calculator" module empowers administrators to take complete control over the text and information presented on the pricing page. This level of customization ensures that your pricing page effectively communicates the unique value of your offerings while maintaining a cohesive brand identity. Here's a comprehensive look at how this feature works:
1. Plan Names and Descriptions:
-
Personalized Plan Names: Customize the names of your pricing plans to reflect your brand's voice and the uniqueness of your products or services. Whether you prefer straightforward names or creative, memorable titles, the choice is entirely yours.
-
Detailed Plan Descriptions: Tailor the descriptions for each pricing plan to provide customers with comprehensive information about what each plan includes. Whether it's a breakdown of features, benefits, or the specific value proposition, you have the freedom to convey the details effectively.
2. Feature Customization:
-
Feature Names: Customize the names of the features included in each pricing plan. This allows you to highlight the key aspects of your offerings and align them with your customers' needs and preferences.
-
Feature Descriptions: Provide detailed and informative descriptions for each feature. Explain how each feature benefits the customer and how it sets your offerings apart from the competition.
-
Icons and Visuals: Enhance the visual appeal and clarity of your feature list by adding icons or visuals next to each feature. These visual elements can help customers quickly grasp the essence of each feature.
3. Call-to-Action Buttons:
-
Text Customization: Customize the text on your call-to-action buttons to guide users toward their desired action. Whether it's encouraging them to sign up, make a purchase, or learn more, you can craft compelling button text.
-
Button Links: Specify the links that the call-to-action buttons direct users to. This can include signup forms, checkout pages, or additional information about the selected plan.
4. Dynamic Content Updates:
- Real-Time Changes: As you customize the content for each pricing plan and feature, you can instantly preview these changes. This real-time preview allows you to ensure that your messaging and information are accurate and align with your brand's voice.
5. Styling Options:
-
Text Color: Modify the text color for plan names, feature names, feature descriptions, and button text. This level of detail ensures that your content is visually engaging and in harmony with your brand's color scheme.
-
Background Color: Customize background colors to create a visually appealing layout that reflects your brand's aesthetic. Differentiating the backgrounds of active plans or specific sections can also draw users' attention to essential information.
-
Alignment: Control the alignment of your content elements. Whether you prefer left, center, or right alignment, you can ensure that your content is displayed in the most visually pleasing and user-friendly way.
In summary, the Content Customization Feature provides an extensive toolkit for tailoring the content on your pricing page to align with your brand's identity and effectively communicate the value of your products or services. You can craft personalized plan names and descriptions, customize feature details, and create compelling call-to-action buttons with specific text and links.
Styling Feature: Elevate Your Pricing Page Aesthetics
The Styling Feature in the "Pricing Calculator" module allows you to create a visually appealing and cohesive pricing page that aligns with your brand's identity. You can fine-tune the module's appearance with the following styling options, all available directly within the module:
1. Slider Styling:
-
Slider Track: Customize the appearance of the slider's track, including the track color. You can select a color that matches your brand's color scheme, ensuring that the slider seamlessly integrates into your pricing page.
-
Slider Thumb: Tailor the look of the slider's thumb, which users interact with to adjust the quantity. This includes selecting the thumb color, making it visually appealing and user-friendly.
-
Slider Value: Customize the appearance of the value text displayed on the slider. You can choose the text color, background color, and border color to create a visually engaging and informative element.
2. Grid Styling:
-
Plans Width: Adjust the width of your pricing plans to create a layout that fits your design preferences and content. You can ensure that your pricing plans are displayed in a visually pleasing manner.
-
Spacing Between Plans: Set the spacing between pricing plans to create a balanced and well-organized layout. You can specify the space between each plan to match your brand's aesthetics.
3. Background Styling:
-
Plan Background: Define the background color for the pricing plans. This customization option allows you to create a cohesive and visually pleasing pricing page that aligns with your brand's color scheme.
-
Active Plan Background: Customize the background color of the active plan, ensuring that it stands out and draws users' attention to the selected plan. This can be particularly effective in highlighting the user's choice.
4. Color Styling:
-
Plan Name Text Color: Modify the text color of the plan names. This level of customization ensures that your plan names are not only informative but also visually appealing.
-
Plan Price Text Color: Tailor the text color of plan prices to match your brand's color scheme and maintain a consistent visual identity.
-
Plan Features Text Color: Customize the text color of the plan features. This includes the names and descriptions of the features, allowing you to create a cohesive and visually engaging feature list.
-
Button Styling: Customize the appearance of call-to-action buttons. You can modify the button text color, button background color, button text color on hover, and button background color on hover. These customization options make your buttons more enticing and visually responsive.
5. Border and Box Shadow Styling:
-
Border Style: Adjust the border style for pricing plans, enabling you to create a polished and visually appealing look. You can choose from options such as solid, dashed, or dotted borders.
-
Border Color: Select the border color that best complements your pricing page's design. This choice can enhance the overall aesthetics of your pricing plans.
-
Border Thickness: Set the thickness of the borders for pricing plans. This detail allows you to fine-tune the visual presentation, creating a clean and professional appearance.
-
Border Radius: Customize the border radius for pricing plans, giving them rounded corners or specific shapes that match your brand's visual identity.
-
Box Shadow: Add a box shadow to pricing plans to create depth and dimension. This visual effect can make your pricing page more engaging and aesthetically pleasing.
6. Alignment Styling:
- Content Alignment: Control the alignment of content within pricing plans. You can choose between left, center, and right alignment to ensure that your content is presented in a visually appealing and user-friendly manner.
7. Spacing Styling:
-
Padding: Specify the padding for pricing plans, ensuring that the content is well-spaced and visually appealing. Adequate padding contributes to a clean and organized layout.
-
Space Between Slider and Plans: Define the space between the slider and the pricing plans to create a visually balanced design that guides users smoothly through the pricing page.
8. Active Plan Scaling:
- Active Plan Styling: Customize the active plan's appearance, including text color and background color. You can also apply scaling effects to make the active or recommended plan more visually appealing and attention-grabbing.