Sales Conversion Rate Calculator & Guide
:root {
–primary-color: #004a99;
–success-color: #28a745;
–background-color: #f8f9fa;
–text-color: #333;
–border-color: #ddd;
–card-background: #fff;
–shadow: 0 2px 5px rgba(0,0,0,0.1);
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background-color: var(–background-color);
color: var(–text-color);
line-height: 1.6;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
padding-top: 20px;
padding-bottom: 40px;
}
.container {
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 0 15px;
box-sizing: border-box;
}
header {
background-color: var(–primary-color);
color: white;
padding: 20px 0;
text-align: center;
width: 100%;
margin-bottom: 30px;
}
header h1 {
margin: 0;
font-size: 2.5em;
font-weight: 700;
}
main {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.calculator-wrapper {
background-color: var(–card-background);
border-radius: 8px;
box-shadow: var(–shadow);
padding: 30px;
margin-bottom: 40px;
width: 100%;
box-sizing: border-box;
}
.calculator-wrapper h2 {
text-align: center;
color: var(–primary-color);
margin-top: 0;
margin-bottom: 25px;
font-size: 1.8em;
}
.input-group {
margin-bottom: 20px;
width: 100%;
}
.input-group label {
display: block;
margin-bottom: 8px;
font-weight: 600;
color: var(–primary-color);
}
.input-group input[type="number"],
.input-group input[type="text"],
.input-group select {
width: calc(100% – 20px);
padding: 12px 10px;
border: 1px solid var(–border-color);
border-radius: 5px;
font-size: 1em;
box-sizing: border-box;
transition: border-color 0.3s ease;
}
.input-group input[type="number"]:focus,
.input-group input[type="text"]:focus,
.input-group select:focus {
outline: none;
border-color: var(–primary-color);
}
.input-group .helper-text {
font-size: 0.85em;
color: #666;
margin-top: 5px;
display: block;
}
.input-group .error-message {
color: #dc3545;
font-size: 0.85em;
margin-top: 5px;
display: none; /* Hidden by default */
}
.input-group .error-message.visible {
display: block;
}
.button-group {
display: flex;
justify-content: space-between;
margin-top: 25px;
gap: 10px;
}
.button-group button {
padding: 12px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
font-size: 1em;
font-weight: 600;
transition: background-color 0.3s ease, transform 0.2s ease;
flex-grow: 1;
}
.button-group button.primary {
background-color: var(–primary-color);
color: white;
}
.button-group button.primary:hover {
background-color: #003366;
transform: translateY(-1px);
}
.button-group button.secondary {
background-color: #6c757d;
color: white;
}
.button-group button.secondary:hover {
background-color: #5a6268;
transform: translateY(-1px);
}
.results-container {
background-color: var(–card-background);
border-radius: 8px;
box-shadow: var(–shadow);
padding: 30px;
margin-top: 40px;
width: 100%;
box-sizing: border-box;
}
.results-container h2 {
text-align: center;
color: var(–primary-color);
margin-top: 0;
margin-bottom: 25px;
font-size: 1.8em;
}
.results-summary {
text-align: center;
margin-bottom: 25px;
padding: 15px;
background-color: var(–primary-color);
color: white;
border-radius: 5px;
font-size: 1.3em;
font-weight: 700;
box-shadow: inset 0 0 10px rgba(0,0,0,0.2);
}
.results-summary .label {
display: block;
font-size: 0.8em;
font-weight: 400;
margin-bottom: 5px;
opacity: 0.8;
}
.intermediate-results, .formula-explanation {
margin-top: 20px;
padding-top: 20px;
border-top: 1px solid var(–border-color);
}
.intermediate-results ul {
list-style: none;
padding: 0;
margin: 0;
}
.intermediate-results li {
display: flex;
justify-content: space-between;
padding: 8px 0;
border-bottom: 1px dashed var(–border-color);
}
.intermediate-results li:last-child {
border-bottom: none;
}
.intermediate-results .value {
font-weight: 600;
color: var(–primary-color);
}
.formula-explanation p {
font-size: 0.95em;
color: #555;
}
.chart-container {
background-color: var(–card-background);
border-radius: 8px;
box-shadow: var(–shadow);
padding: 30px;
margin-top: 40px;
width: 100%;
box-sizing: border-box;
text-align: center;
}
.chart-container h2 {
color: var(–primary-color);
margin-top: 0;
margin-bottom: 25px;
font-size: 1.8em;
}
.chart-container canvas {
max-width: 100%;
height: auto;
}
.chart-caption {
font-size: 0.9em;
color: #666;
margin-top: 10px;
display: block;
}
.table-container {
background-color: var(–card-background);
border-radius: 8px;
box-shadow: var(–shadow);
padding: 30px;
margin-top: 40px;
width: 100%;
box-sizing: border-box;
overflow-x: auto;
}
.table-container h2 {
color: var(–primary-color);
margin-top: 0;
margin-bottom: 25px;
font-size: 1.8em;
text-align: center;
}
table {
width: 100%;
border-collapse: collapse;
margin-top: 20px;
}
th, td {
padding: 12px 15px;
text-align: left;
border-bottom: 1px solid var(–border-color);
}
th {
background-color: var(–primary-color);
color: white;
font-weight: 700;
}
td {
background-color: var(–card-background);
}
tr:nth-child(even) td {
background-color: #f2f2f2;
}
.table-caption {
font-size: 0.9em;
color: #666;
margin-bottom: 10px;
display: block;
text-align: center;
}
.article-content {
background-color: var(–card-background);
border-radius: 8px;
box-shadow: var(–shadow);
padding: 30px;
margin-top: 40px;
width: 100%;
box-sizing: border-box;
}
.article-content h2, .article-content h3 {
color: var(–primary-color);
margin-top: 30px;
margin-bottom: 15px;
}
.article-content h2 {
font-size: 1.8em;
border-bottom: 2px solid var(–primary-color);
padding-bottom: 5px;
}
.article-content h3 {
font-size: 1.4em;
margin-top: 25px;
}
.article-content p {
margin-bottom: 15px;
}
.article-content ul, .article-content ol {
margin-left: 20px;
margin-bottom: 15px;
}
.article-content li {
margin-bottom: 8px;
}
.article-content strong {
color: var(–primary-color);
}
.faq-section {
margin-top: 30px;
}
.faq-item {
margin-bottom: 15px;
border: 1px solid var(–border-color);
border-radius: 5px;
padding: 15px;
background-color: #fdfdfd;
}
.faq-item .question {
font-weight: 700;
color: var(–primary-color);
cursor: pointer;
position: relative;
padding-left: 25px;
}
.faq-item .question::before {
content: '+';
position: absolute;
left: 5px;
font-size: 1.2em;
color: var(–primary-color);
}
.faq-item .answer {
display: none;
margin-top: 10px;
padding-left: 15px;
border-left: 2px solid var(–primary-color);
}
.faq-item.open .answer {
display: block;
}
.faq-item.open .question::before {
content: '-';
}
.related-links {
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid var(–border-color);
}
.related-links h3 {
margin-top: 0;
margin-bottom: 15px;
}
.related-links ul {
list-style: none;
padding: 0;
}
.related-links li {
margin-bottom: 10px;
}
.related-links a {
color: var(–primary-color);
text-decoration: none;
font-weight: 600;
}
.related-links a:hover {
text-decoration: underline;
}
.related-links .explanation {
font-size: 0.9em;
color: #555;
display: block;
margin-top: 3px;
}
footer {
text-align: center;
margin-top: 40px;
font-size: 0.9em;
color: #777;
}
@media (min-width: 768px) {
.button-group {
justify-content: flex-end;
}
.button-group button {
flex-grow: 0;
width: auto;
}
}
Sales Conversion Rate Calculator
Calculate Your Sales Conversion Rate
Your Results
Sales Conversion Rate
–.–%
Conversion Trend Over Time (Simulated)
Visualizing potential conversion rates based on varying lead volumes.
Conversion Rate Benchmarks
Typical sales conversion rates across different industries.
| Industry |
Average Conversion Rate (%) |
Notes |
| E-commerce |
1.0% – 3.0% |
Highly variable based on product and traffic source. |
| SaaS (Software) |
2.0% – 5.0% |
Often higher due to perceived value and recurring revenue. |
| B2B Services |
5.0% – 15.0% |
Longer sales cycles, higher value deals. |
| Real Estate |
1.0% – 5.0% |
Depends on lead quality and agent effectiveness. |
| Lead Generation Agencies |
10.0% – 25.0% |
Focus on qualifying and passing high-intent leads. |
What is a Sales Conversion Rate?
A sales conversion rate is a key performance indicator (KPI) that measures the percentage of potential customers (leads or prospects) who complete a desired action, most commonly making a purchase. In simpler terms, it tells you how effective your sales and marketing efforts are at turning interested individuals into paying customers. Understanding your sales conversion rate is crucial for assessing the health of your sales funnel, identifying bottlenecks, and making data-driven decisions to improve performance.
Who should use it?
- Sales Teams: To track individual and team performance, identify successful strategies, and forecast revenue.
- Marketing Teams: To evaluate the effectiveness of campaigns in generating qualified leads and driving sales.
- Business Owners & Managers: To gauge overall business health, profitability, and growth potential.
- E-commerce Store Owners: To understand how well their website and product offerings convert visitors into buyers.
- SaaS Companies: To measure the success of free trials, demos, and onboarding processes in converting users to paid subscribers.
Common Misconceptions:
- It's just about the final sale: While a purchase is the most common conversion, a conversion can be any desired action, like signing up for a newsletter, downloading a whitepaper, or requesting a demo. The definition depends on your business goals.
- A high rate is always good: An extremely high conversion rate might indicate that your qualification process is too strict, or you're targeting a very narrow audience, potentially missing out on broader market opportunities.
- It's a static number: Your sales conversion rate fluctuates based on seasonality, market trends, competitor actions, and changes in your own strategies. It requires continuous monitoring and optimization.
Sales Conversion Rate Formula and Mathematical Explanation
The calculation for the sales conversion rate is straightforward but powerful. It provides a clear metric for evaluating the efficiency of your sales process.
The Core Formula:
Sales Conversion Rate (%) = (Total Number of Sales / Total Number of Leads) * 100
Let's break down the variables:
| Variable |
Meaning |
Unit |
Typical Range |
| Total Number of Sales |
The count of successful transactions or desired actions completed within a specific period. |
Count |
0 to ∞ |
| Total Number of Leads |
The count of potential customers who have expressed interest or entered your sales funnel within the same period. |
Count |
0 to ∞ |
| Sales Conversion Rate |
The percentage of leads that converted into sales. |
Percentage (%) |
0% to 100% (theoretically) |
| Conversion Ratio |
A simplified ratio showing how many leads are needed for one sale. |
Ratio (e.g., 1:X) |
1:1 to 1:∞ |
Derivation:
- Identify the Period: Define the timeframe for your analysis (e.g., daily, weekly, monthly, quarterly).
- Count Total Leads: Sum up all the unique individuals or entities that entered your sales funnel during that period. This could include website form submissions, demo requests, phone inquiries, etc.
- Count Total Sales: Sum up all the completed purchases or desired conversions that originated from those leads within the same period.
- Calculate the Ratio: Divide the number of sales by the number of leads. This gives you a decimal value representing the proportion of leads that converted.
- Convert to Percentage: Multiply the ratio by 100 to express the conversion rate as a percentage.
- Calculate Conversion Ratio: This is the inverse of the conversion rate (expressed as a ratio). If your conversion rate is 5%, it means 1 sale for every 20 leads (1 / 0.05 = 20), so the ratio is 1:20.
A higher sales conversion rate generally indicates a more efficient sales process and effective marketing. However, it's essential to consider the quality of leads and the overall business context when interpreting this metric.
Practical Examples (Real-World Use Cases)
Let's illustrate the sales conversion rate calculation with practical scenarios:
Example 1: E-commerce Store
An online clothing boutique runs a targeted social media campaign for a new product line. Over one week:
- Total Leads (Website Visitors from Campaign): 5,000
- Total Sales (Purchases of the new product line): 100
Calculation:
- Conversion Rate = (100 / 5,000) * 100% = 0.02 * 100% = 2.0%
- Conversion Ratio = 5,000 leads / 100 sales = 50 leads per sale (1:50)
Interpretation: The boutique has a 2.0% sales conversion rate for this campaign. This means that for every 50 visitors driven by the campaign, one made a purchase. This rate can be compared against industry benchmarks or previous campaigns to assess success.
Example 2: B2B Software Company
A SaaS company offers a free trial for its project management software. Over a month:
- Total Leads (Free Trial Sign-ups): 800
- Total Sales (Paid Subscriptions from Trial Users): 80
Calculation:
- Conversion Rate = (80 / 800) * 100% = 0.10 * 100% = 10.0%
- Conversion Ratio = 800 leads / 80 sales = 10 leads per sale (1:10)
Interpretation: The SaaS company achieves a 10.0% conversion rate from free trial to paid subscription. This indicates that 1 out of every 10 trial users becomes a paying customer. The marketing and sales teams can analyze the trial experience and onboarding process to see if this rate can be further improved.
How to Use This Sales Conversion Rate Calculator
Our Sales Conversion Rate Calculator is designed for simplicity and accuracy. Follow these steps to get your results:
- Input Total Leads: In the "Total Leads/Prospects" field, enter the total number of potential customers who showed interest in your product or service during your chosen period.
- Input Total Sales: In the "Total Sales/Conversions" field, enter the number of those leads that successfully completed a purchase or the desired conversion action within the same period.
- Click 'Calculate': Press the "Calculate" button. The calculator will instantly process your inputs.
How to Read Results:
- Primary Result (Sales Conversion Rate): This is the highlighted percentage, showing the direct conversion efficiency. A higher percentage is generally better.
- Key Metrics: You'll see the inputs you provided (Leads and Sales) and the calculated Conversion Ratio (e.g., 1:20), which tells you how many leads, on average, it takes to make one sale.
- Formula Explanation: Understand the simple math behind the calculation.
- Chart: The dynamic chart provides a visual representation, simulating how conversion rates might look across different lead volumes.
- Benchmarks Table: Compare your calculated rate against industry averages to understand your competitive standing.
Decision-Making Guidance:
- Low Conversion Rate: If your rate is significantly below industry benchmarks, investigate potential issues in your marketing messaging, sales process, lead quality, pricing, or product-market fit. Consider A/B testing landing pages, refining ad targeting, or improving sales scripts.
- High Conversion Rate: If your rate is exceptionally high, ensure you aren't missing opportunities by being too restrictive with your targeting or qualification. Also, consider if your pricing is too low.
- Use the 'Copy Results' button: Easily share your findings with your team or stakeholders.
- Use the 'Reset' button: Quickly clear the fields and start a new calculation with default values.
Key Factors That Affect Sales Conversion Rate Results
Several elements can significantly influence your sales conversion rate. Understanding these factors helps in diagnosing performance and strategizing improvements:
- Lead Quality: Not all leads are created equal. Leads generated from highly targeted campaigns or those who have shown strong intent (e.g., requested a demo) are more likely to convert than broadly sourced leads. Poor lead quality drastically lowers conversion rates.
- Sales Process Efficiency: A well-defined, streamlined, and responsive sales process is critical. Delays in follow-up, inconsistent communication, or a confusing sales journey can cause potential customers to drop off.
- Marketing Messaging & Targeting: The clarity, relevance, and persuasiveness of your marketing messages directly impact lead generation quality and conversion. If your ads or content attract the wrong audience or fail to resonate, conversion rates will suffer.
- Product/Service Value Proposition: How well your offering meets customer needs and solves their problems is fundamental. A strong value proposition, clearly communicated, makes it easier to convert interested prospects.
- Pricing and Offers: Competitively priced products or services, coupled with attractive offers or discounts, can significantly boost conversion rates. Conversely, perceived high prices without clear justification can deter buyers.
- Website/Landing Page User Experience (UX): For online businesses, the ease of navigation, clarity of information, and simplicity of the checkout or sign-up process on your website or landing pages are vital. A poor UX is a major conversion killer.
- Sales Team Skills & Training: The ability of your sales representatives to effectively communicate value, handle objections, build rapport, and close deals directly impacts the conversion rate. Ongoing training and performance management are key.
- Market Conditions & Competition: Economic factors, industry trends, and the actions of competitors can influence customer purchasing decisions and, consequently, your conversion rates. A saturated market or economic downturn may lower overall conversion potential.
Frequently Asked Questions (FAQ)
What is considered a "good" sales conversion rate?
There's no universal "good" rate, as it varies significantly by industry, business model, lead source, and sales cycle length. For e-commerce, 1-3% might be average, while for B2B services, 5-15% could be typical. It's best to benchmark against your industry and track your own trends over time.
How often should I calculate my sales conversion rate?
Ideally, you should track your sales conversion rate regularly – weekly or monthly – to monitor performance trends. For specific campaigns, calculate it for the duration of the campaign. Consistent tracking allows for timely adjustments.
Can a sales conversion rate be over 100%?
No, a sales conversion rate cannot exceed 100%. It represents the percentage of leads that convert, and you cannot have more conversions than the total number of opportunities (leads) you started with.
What's the difference between conversion rate and lead conversion rate?
"Sales Conversion Rate" typically refers to the final sale. "Lead Conversion Rate" can sometimes be used interchangeably, but it might also refer to a specific stage in the funnel, like converting a marketing qualified lead (MQL) to a sales qualified lead (SQL), or a lead to a demo. Our calculator focuses on the ultimate sale from total leads.
How do I improve my sales conversion rate?
Improving your sales conversion rate involves optimizing various aspects: enhancing lead quality through better targeting, refining your sales pitch and process, improving website UX, offering competitive pricing, providing excellent customer service, and ensuring your sales team is well-trained.
Does the time period matter for conversion rate calculation?
Yes, the time period is crucial. Ensure you are comparing apples to apples by using the same timeframe for both leads and sales. A monthly calculation might smooth out daily fluctuations, while a weekly one can highlight immediate impacts of changes.
What if I have multiple types of conversions?
If you have multiple conversion goals (e.g., demo requests, newsletter sign-ups, purchases), you should calculate the conversion rate for each specific goal separately. This calculator is primarily for the final sales conversion.
How does lead scoring affect conversion rates?
Lead scoring helps prioritize leads based on their likelihood to convert. By focusing sales efforts on high-scoring leads, you can significantly increase your sales conversion rate, as you're investing resources where they are most likely to yield results.
var chartInstance = null; // Global variable to hold chart instance
function validateInput(id, errorId, minValue, maxValue) {
var input = document.getElementById(id);
var errorElement = document.getElementById(errorId);
var value = parseFloat(input.value);
var isValid = true;
errorElement.classList.remove('visible');
input.style.borderColor = 'var(–border-color)';
if (isNaN(value)) {
errorElement.textContent = 'Please enter a valid number.';
errorElement.classList.add('visible');
input.style.borderColor = '#dc3545';
isValid = false;
} else if (value < 0) {
errorElement.textContent = 'Value cannot be negative.';
errorElement.classList.add('visible');
input.style.borderColor = '#dc3545';
isValid = false;
} else if (minValue !== undefined && value maxValue) {
errorElement.textContent = 'Value cannot exceed ' + maxValue + '.';
errorElement.classList.add('visible');
input.style.borderColor = '#dc3545';
isValid = false;
}
return isValid;
}
function calculateConversionRate() {
var leadsInput = document.getElementById('leads');
var salesInput = document.getElementById('sales');
var leadsError = document.getElementById('leadsError');
var salesError = document.getElementById('salesError');
var isValidLeads = validateInput('leads', 'leadsError', 0);
var isValidSales = validateInput('sales', 'salesError', 0);
if (!isValidLeads || !isValidSales) {
return;
}
var leads = parseFloat(leadsInput.value);
var sales = parseFloat(salesInput.value);
var conversionRate = 0;
var conversionRatio = 'N/A';
if (leads > 0) {
conversionRate = (sales / leads) * 100;
var ratioDenominator = sales > 0 ? leads / sales : Infinity;
conversionRatio = '1:' + ratioDenominator.toFixed(0);
} else if (sales > 0) {
conversionRate = Infinity; // Technically, if leads is 0 and sales > 0, it's infinitely good.
conversionRatio = '1:0';
}
document.getElementById('mainResult').textContent = conversionRate.toFixed(2) + '%';
document.getElementById('resultLeads').textContent = leads.toLocaleString();
document.getElementById('resultSales').textContent = sales.toLocaleString();
document.getElementById('resultRatio').textContent = conversionRatio;
updateChart(leads, sales, conversionRate);
}
function resetCalculator() {
document.getElementById('leads').value = '1000';
document.getElementById('sales').value = '50';
document.getElementById('leadsError').textContent = ";
document.getElementById('salesError').textContent = ";
document.getElementById('leads').style.borderColor = 'var(–border-color)';
document.getElementById('sales').style.borderColor = 'var(–border-color)';
calculateConversionRate(); // Recalculate with default values
}
function copyResults() {
var mainResult = document.getElementById('mainResult').textContent;
var resultLeads = document.getElementById('resultLeads').textContent;
var resultSales = document.getElementById('resultSales').textContent;
var resultRatio = document.getElementById('resultRatio').textContent;
var formula = "Formula: (Total Sales / Total Leads) * 100%";
var textToCopy = "Sales Conversion Rate Results:\n";
textToCopy += "—————————–\n";
textToCopy += "Sales Conversion Rate: " + mainResult + "\n";
textToCopy += "Total Leads: " + resultLeads + "\n";
textToCopy += "Total Sales: " + resultSales + "\n";
textToCopy += "Conversion Ratio: " + resultRatio + "\n";
textToCopy += "\nKey Assumption: " + formula;
navigator.clipboard.writeText(textToCopy).then(function() {
// Optional: Show a confirmation message
var copyButton = document.querySelector('button[onclick="copyResults()"]');
var originalText = copyButton.textContent;
copyButton.textContent = 'Copied!';
setTimeout(function() {
copyButton.textContent = originalText;
}, 1500);
}).catch(function(err) {
console.error('Failed to copy text: ', err);
// Fallback for older browsers or environments where clipboard API is not available
alert('Could not copy text. Please manually select and copy the results.');
});
}
function updateChart(currentLeads, currentSales, currentRate) {
var ctx = document.getElementById('conversionChart').getContext('2d');
// Simulate data points for the chart
var simulatedLeads = [500, 750, 1000, 1250, 1500, 1750, 2000];
var simulatedSales = [20, 35, 50, 60, 70, 80, 90]; // Corresponding sales for simulated leads
var simulatedRates = [];
for (var i = 0; i 0) {
simulatedRates.push((simulatedSales[i] / simulatedLeads[i]) * 100);
} else {
simulatedRates.push(0);
}
}
// Add current data point to simulated data if it's not already there
var currentIndex = simulatedLeads.indexOf(currentLeads);
if (currentIndex === -1) {
simulatedLeads.push(currentLeads);
simulatedSales.push(currentSales);
simulatedRates.push(currentRate);
// Sort all arrays based on leads to maintain order
var combined = [];
for (var i = 0; i < simulatedLeads.length; i++) {
combined.push({ leads: simulatedLeads[i], sales: simulatedSales[i], rate: simulatedRates[i] });
}
combined.sort(function(a, b) { return a.leads – b.leads; });
simulatedLeads = combined.map(function(item) { return item.leads; });
simulatedSales = combined.map(function(item) { return item.sales; });
simulatedRates = combined.map(function(item) { return item.rate; });
} else {
// Update the existing data point
simulatedSales[currentIndex] = currentSales;
simulatedRates[currentIndex] = currentRate;
}
if (chartInstance) {
chartInstance.destroy();
}
chartInstance = new Chart(ctx, {
type: 'line',
data: {
labels: simulatedLeads.map(function(l) { return l.toLocaleString(); }), // Use leads as labels
datasets: [{
label: 'Sales Conversion Rate (%)',
data: simulatedRates,
borderColor: 'var(–primary-color)',
backgroundColor: 'rgba(0, 74, 153, 0.2)',
fill: true,
tension: 0.1
},
{
label: 'Total Sales',
data: simulatedSales,
borderColor: 'var(–success-color)',
backgroundColor: 'rgba(40, 167, 69, 0.2)',
fill: false,
tension: 0.1,
yAxisID: 'y-axis-sales' // Assign to secondary Y-axis
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
scales: {
x: {
title: {
display: true,
text: 'Total Leads'
}
},
y: {
title: {
display: true,
text: 'Conversion Rate (%)'
},
beginAtZero: true,
ticks: {
callback: function(value) {
return value.toFixed(1) + '%';
}
}
},
'y-axis-sales': { // Configuration for the secondary Y-axis
type: 'linear',
position: 'right',
title: {
display: true,
text: 'Total Sales'
},
beginAtZero: true,
grid: {
drawOnChartArea: false, // Don't draw grid lines for this axis
}
}
},
plugins: {
tooltip: {
callbacks: {
label: function(context) {
var label = context.dataset.label || '';
if (label) {
label += ': ';
}
if (context.parsed.y !== null) {
if (context.dataset.label === 'Sales Conversion Rate (%)') {
label += context.parsed.y.toFixed(2) + '%';
} else {
label += context.parsed.y.toLocaleString();
}
}
return label;
}
}
},
legend: {
position: 'top'
}
}
}
});
}
// Initialize FAQ toggles
document.addEventListener('DOMContentLoaded', function() {
var faqItems = document.querySelectorAll('.faq-item .question');
faqItems.forEach(function(item) {
item.addEventListener('click', function() {
var faqItem = this.parentElement;
faqItem.classList.toggle('open');
});
});
// Initial calculation and chart render
calculateConversionRate();
});
// Add Chart.js library dynamically if not present
if (typeof Chart === 'undefined') {
var script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/chart.js@3.7.0/dist/chart.min.js';
script.onload = function() {
// Chart.js loaded, now initialize the chart
calculateConversionRate(); // Recalculate to ensure chart is drawn with initial values
};
document.head.appendChild(script);
} else {
// Chart.js is already loaded, just initialize
calculateConversionRate();
}