586 lines
25 KiB
TypeScript
586 lines
25 KiB
TypeScript
import React from 'react';
|
|
import type { Metadata } from 'next';
|
|
import { Button } from '@/components/ui/Button';
|
|
import { Card } from '@/components/ui/Card';
|
|
import SeoJsonLd from '@/components/SeoJsonLd';
|
|
import Breadcrumbs, { BreadcrumbItem } from '@/components/Breadcrumbs';
|
|
import { breadcrumbSchema } from '@/lib/schema';
|
|
import { AnswerFirstBlock } from '@/components/marketing/AnswerFirstBlock';
|
|
import { GrowthLinksSection } from '@/components/marketing/GrowthLinksSection';
|
|
import { MarketingPageTracker, TrackedCtaLink } from '@/components/marketing/MarketingAnalytics';
|
|
import { featuredUseCases } from '@/lib/growth-pages';
|
|
|
|
export const metadata: Metadata = {
|
|
title: {
|
|
absolute: 'Dynamic QR Code Generator - Edit Anytime',
|
|
},
|
|
description: 'Create dynamic QR codes that can be edited after printing. Change destination URLs and track scans without reprinting. Free generator with advanced features.',
|
|
keywords: 'dynamic qr code generator, editable qr code, dynamic qr code, free dynamic qr code, qr code generator dynamic, best dynamic qr code generator',
|
|
alternates: {
|
|
canonical: 'https://www.qrmaster.net/dynamic-qr-code-generator',
|
|
languages: {
|
|
'x-default': 'https://www.qrmaster.net/dynamic-qr-code-generator',
|
|
en: 'https://www.qrmaster.net/dynamic-qr-code-generator',
|
|
},
|
|
},
|
|
openGraph: {
|
|
title: 'Dynamic QR Code Generator - Edit Anytime',
|
|
description: 'Create dynamic QR codes that can be edited after printing. Change URLs, track scans, and update content anytime.',
|
|
url: 'https://www.qrmaster.net/dynamic-qr-code-generator',
|
|
type: 'website',
|
|
images: ['/og-image.png'],
|
|
},
|
|
twitter: {
|
|
title: 'Dynamic QR Code Generator - Edit Anytime',
|
|
description: 'Create dynamic QR codes that can be edited after printing. Change URLs, track scans, and update content anytime.',
|
|
},
|
|
};
|
|
|
|
export default function DynamicQRCodeGeneratorPage() {
|
|
const dynamicFeatures = [
|
|
{
|
|
icon: '✏️',
|
|
title: 'Edit Anytime',
|
|
description: 'Change the destination URL or content after your QR code is printed. No need to reprint!',
|
|
},
|
|
{
|
|
icon: '📊',
|
|
title: 'Advanced Analytics',
|
|
description: 'Track scans, locations, devices, and time patterns. Get insights to optimize your campaigns.',
|
|
},
|
|
{
|
|
icon: '🎨',
|
|
title: 'Full Customization',
|
|
description: 'Add your logo, brand colors, custom shapes, and frames. Make your QR code stand out.',
|
|
},
|
|
{
|
|
icon: '🔄',
|
|
title: 'A/B Testing',
|
|
description: 'Test different landing pages without changing the QR code. Optimize conversions easily.',
|
|
},
|
|
{
|
|
icon: '⏰',
|
|
title: 'Schedule Content',
|
|
description: 'Set time-based redirects. Show different content based on day, time, or season.',
|
|
},
|
|
{
|
|
icon: '🌍',
|
|
title: 'Geo-Targeting',
|
|
description: 'Redirect users to different pages based on their location. Perfect for multi-region campaigns.',
|
|
},
|
|
];
|
|
|
|
const staticVsDynamic = [
|
|
{
|
|
feature: 'Edit After Printing',
|
|
static: false,
|
|
dynamic: true,
|
|
},
|
|
{
|
|
feature: 'Track Scans',
|
|
static: false,
|
|
dynamic: true,
|
|
},
|
|
{
|
|
feature: 'A/B Testing',
|
|
static: false,
|
|
dynamic: true,
|
|
},
|
|
{
|
|
feature: 'Analytics Dashboard',
|
|
static: false,
|
|
dynamic: true,
|
|
},
|
|
{
|
|
feature: 'Custom Domain',
|
|
static: false,
|
|
dynamic: true,
|
|
},
|
|
{
|
|
feature: 'Password Protection',
|
|
static: false,
|
|
dynamic: true,
|
|
},
|
|
{
|
|
feature: 'Expiration Date',
|
|
static: false,
|
|
dynamic: true,
|
|
},
|
|
];
|
|
|
|
const useCases = [
|
|
{
|
|
title: 'Marketing Campaigns',
|
|
icon: '📢',
|
|
description: 'Update campaign landing pages without reprinting materials. Test different offers and track performance.',
|
|
example: 'Print QR codes on billboards, then test different promotions weekly.',
|
|
},
|
|
{
|
|
title: 'Product Packaging',
|
|
icon: '📦',
|
|
description: 'Link to product manuals, videos, or registration forms. Update information as products evolve.',
|
|
example: 'Update software download links without changing packaging.',
|
|
},
|
|
{
|
|
title: 'Business Cards',
|
|
icon: '💼',
|
|
description: 'Keep your contact information current. Update your vCard details without printing new cards.',
|
|
example: 'Change job title, phone, or email anytime.',
|
|
},
|
|
{
|
|
title: 'Restaurant Menus',
|
|
icon: '🍽️',
|
|
description: 'Update menu items, prices, and specials daily. Track which items get the most views.',
|
|
example: 'Show daily specials without printing new menus.',
|
|
},
|
|
];
|
|
|
|
const softwareSchema = {
|
|
'@context': 'https://schema.org',
|
|
'@type': 'SoftwareApplication',
|
|
'@id': 'https://www.qrmaster.net/dynamic-qr-code-generator#software',
|
|
name: 'QR Master - Dynamic QR Code Generator',
|
|
applicationCategory: 'BusinessApplication',
|
|
operatingSystem: 'Web Browser',
|
|
offers: {
|
|
'@type': 'Offer',
|
|
price: '0',
|
|
priceCurrency: 'USD',
|
|
availability: 'https://schema.org/InStock',
|
|
},
|
|
|
|
description: 'Create dynamic QR codes that can be edited after printing. Change destination URLs, track scans, and update content without reprinting.',
|
|
featureList: [
|
|
'Edit QR codes after printing',
|
|
'Real-time scan tracking',
|
|
'A/B testing capabilities',
|
|
'Custom branding and design',
|
|
'Geo-targeting options',
|
|
'Scheduled content updates',
|
|
'Password protection',
|
|
'Expiration dates',
|
|
],
|
|
};
|
|
|
|
const howToSchema = {
|
|
'@context': 'https://schema.org',
|
|
'@type': 'HowTo',
|
|
'@id': 'https://www.qrmaster.net/dynamic-qr-code-generator#howto',
|
|
name: 'How to Create a Dynamic QR Code',
|
|
description: 'Learn how to create editable QR codes that can be updated after printing',
|
|
totalTime: 'PT3M',
|
|
step: [
|
|
{
|
|
'@type': 'HowToStep',
|
|
position: 1,
|
|
name: 'Sign Up Free',
|
|
text: 'Create a free QR Master account to start generating dynamic QR codes',
|
|
url: 'https://www.qrmaster.net/signup',
|
|
},
|
|
{
|
|
'@type': 'HowToStep',
|
|
position: 2,
|
|
name: 'Generate QR Code',
|
|
text: 'Enter your destination URL and customize the design with your branding',
|
|
url: 'https://www.qrmaster.net/signup',
|
|
},
|
|
{
|
|
'@type': 'HowToStep',
|
|
position: 3,
|
|
name: 'Download and Print',
|
|
text: 'Download your QR code in high resolution and add it to your marketing materials',
|
|
},
|
|
{
|
|
'@type': 'HowToStep',
|
|
position: 4,
|
|
name: 'Update Anytime',
|
|
text: 'Log into your dashboard to change the destination URL whenever needed - no reprinting required',
|
|
url: 'https://www.qrmaster.net/dashboard',
|
|
},
|
|
],
|
|
};
|
|
|
|
const faqSchema = {
|
|
'@context': 'https://schema.org',
|
|
'@type': 'FAQPage',
|
|
'@id': 'https://www.qrmaster.net/dynamic-qr-code-generator#faq',
|
|
mainEntity: [
|
|
{
|
|
'@type': 'Question',
|
|
name: 'What is a dynamic QR code?',
|
|
acceptedAnswer: {
|
|
'@type': 'Answer',
|
|
text: 'A dynamic QR code is an editable QR code that redirects through a short URL, allowing you to change the destination without reprinting the code. Unlike static QR codes, dynamic codes can be tracked and updated anytime.',
|
|
},
|
|
},
|
|
{
|
|
'@type': 'Question',
|
|
name: 'Can I edit a QR code after printing?',
|
|
acceptedAnswer: {
|
|
'@type': 'Answer',
|
|
text: 'Yes, with dynamic QR codes you can edit the destination URL anytime after printing. The QR code image stays the same, but the content it points to can be changed from your dashboard.',
|
|
},
|
|
},
|
|
{
|
|
'@type': 'Question',
|
|
name: 'Is dynamic QR code generator free?',
|
|
acceptedAnswer: {
|
|
'@type': 'Answer',
|
|
text: 'Yes, QR Master offers a free plan for creating dynamic QR codes with basic tracking features. Premium plans include advanced analytics and customization options.',
|
|
},
|
|
},
|
|
],
|
|
};
|
|
|
|
const breadcrumbItems: BreadcrumbItem[] = [
|
|
{ name: 'Home', url: '/' },
|
|
{ name: 'Dynamic QR Code Generator', url: '/dynamic-qr-code-generator' },
|
|
];
|
|
|
|
const relatedUseCaseLinks = [
|
|
{
|
|
href: featuredUseCases[0].href,
|
|
title: featuredUseCases[0].title,
|
|
description: featuredUseCases[0].summary,
|
|
ctaLabel: featuredUseCases[0].ctaLabel,
|
|
},
|
|
{
|
|
href: featuredUseCases[1].href,
|
|
title: featuredUseCases[1].title,
|
|
description: featuredUseCases[1].summary,
|
|
ctaLabel: featuredUseCases[1].ctaLabel,
|
|
},
|
|
{
|
|
href: featuredUseCases[2].href,
|
|
title: featuredUseCases[2].title,
|
|
description: featuredUseCases[2].summary,
|
|
ctaLabel: featuredUseCases[2].ctaLabel,
|
|
},
|
|
{
|
|
href: '/use-cases',
|
|
title: 'Explore the use-case hub',
|
|
description: 'See how dynamic QR workflows connect to commercial pages, tools, and support content.',
|
|
ctaLabel: 'Explore QR code use cases',
|
|
},
|
|
];
|
|
|
|
return (
|
|
<>
|
|
<SeoJsonLd data={[softwareSchema, howToSchema, faqSchema, breadcrumbSchema(breadcrumbItems)]} />
|
|
<MarketingPageTracker pageType="commercial" cluster="dynamic-qr" />
|
|
<div className="min-h-screen bg-white">
|
|
{/* Hero Section */}
|
|
<section className="relative overflow-hidden bg-gradient-to-br from-purple-50 via-white to-blue-50 py-20">
|
|
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-7xl">
|
|
<Breadcrumbs items={breadcrumbItems} />
|
|
<div className="grid lg:grid-cols-2 gap-12 items-center">
|
|
<div className="space-y-8">
|
|
<div className="inline-flex items-center space-x-2 bg-purple-100 text-purple-800 px-4 py-2 rounded-full text-sm font-semibold">
|
|
<span>✨</span>
|
|
<span>Edit After Printing</span>
|
|
</div>
|
|
|
|
<h1 className="text-5xl lg:text-6xl font-bold text-gray-900 leading-tight">
|
|
Dynamic QR Code Generator
|
|
</h1>
|
|
|
|
<p className="text-xl text-gray-600 leading-relaxed">
|
|
Create QR codes you can edit anytime - even after printing. Change URLs, track scans, and update content without reprinting. The smart choice for businesses.
|
|
</p>
|
|
|
|
<div className="space-y-3">
|
|
{[
|
|
'Edit content after printing',
|
|
'Track scans and analytics',
|
|
'A/B test without reprinting',
|
|
'Custom branding and design',
|
|
].map((feature, index) => (
|
|
<div key={index} className="flex items-center space-x-3">
|
|
<div className="flex-shrink-0 w-5 h-5 bg-green-500 rounded-full flex items-center justify-center">
|
|
<svg className="w-3 h-3 text-white" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fillRule="evenodd" d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z" clipRule="evenodd" />
|
|
</svg>
|
|
</div>
|
|
<span className="text-gray-700">{feature}</span>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
<div className="flex flex-col sm:flex-row gap-4">
|
|
<TrackedCtaLink href="/signup" ctaLabel="Create Dynamic QR Code" ctaLocation="hero_primary" pageType="commercial" cluster="dynamic-qr">
|
|
<Button size="lg" className="text-lg px-8 py-4 w-full sm:w-auto">
|
|
Create Dynamic QR Code
|
|
</Button>
|
|
</TrackedCtaLink>
|
|
<TrackedCtaLink href="/pricing" ctaLabel="View Pricing" ctaLocation="hero_secondary" pageType="commercial" cluster="dynamic-qr">
|
|
<Button variant="outline" size="lg" className="text-lg px-8 py-4 w-full sm:w-auto">
|
|
View Pricing
|
|
</Button>
|
|
</TrackedCtaLink>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Visual Demo */}
|
|
<div className="relative">
|
|
<Card className="p-8 shadow-2xl">
|
|
<div className="text-center mb-6">
|
|
<div className="inline-block bg-gray-200 rounded-lg p-8">
|
|
<div className="w-48 h-48 bg-black rounded-lg flex items-center justify-center">
|
|
<span className="text-white text-sm font-mono">QR Code</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="space-y-3 text-sm">
|
|
<div className="flex items-center justify-between p-3 bg-blue-50 rounded-lg">
|
|
<span className="text-gray-700">Current URL:</span>
|
|
<span className="text-blue-600 font-mono">summer-sale.com</span>
|
|
</div>
|
|
<div className="flex items-center justify-center">
|
|
<svg className="w-6 h-6 text-green-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 14l-7 7m0 0l-7-7m7 7V3" />
|
|
</svg>
|
|
</div>
|
|
<div className="flex items-center justify-between p-3 bg-green-50 rounded-lg">
|
|
<span className="text-gray-700">Updated URL:</span>
|
|
<span className="text-green-600 font-mono">fall-sale.com</span>
|
|
</div>
|
|
</div>
|
|
<p className="text-center text-sm text-gray-600 mt-4">
|
|
Same QR code, different destination!
|
|
</p>
|
|
</Card>
|
|
<div className="absolute -top-4 -right-4 bg-purple-500 text-white px-4 py-2 rounded-full text-sm font-semibold shadow-lg">
|
|
No Reprint Needed!
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Answer First Block (SEO/AEO) */}
|
|
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-7xl">
|
|
<AnswerFirstBlock
|
|
whatIsIt="A dynamic QR code points to a redirect URL, allowing you to change the final destination anytime without reprinting. Unlike static codes, it enables real-time scan tracking (location, device, time) and advanced campaign management."
|
|
whenToUse={[
|
|
"Update destination URLs instantly (e.g., for menus, promotions, or out-of-stock items)",
|
|
"Track precise scan metrics to measure campaign ROI (location, device type, unique scans)",
|
|
"Keep the QR pattern simple and scannable, even for long, complex URLs"
|
|
]}
|
|
comparison={{
|
|
leftTitle: "Static QR",
|
|
rightTitle: "Dynamic QR",
|
|
items: [
|
|
{ label: "Target URL", value: true, text: "Fixed" },
|
|
{ label: "Scan Tracking", value: true, text: "None" },
|
|
{ label: "Printing", value: true, text: "One-time" }
|
|
]
|
|
}}
|
|
howTo={{
|
|
steps: [
|
|
"Sign up for a free QR Master account (required for management)",
|
|
"Select 'Dynamic URL' and enter your destination link",
|
|
"Download the QR code and print it. Log in to dashboard to update the target URL anytime."
|
|
]
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
{/* Static vs Dynamic */}
|
|
<section className="py-20 bg-gray-50">
|
|
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-6xl">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-4xl font-bold text-gray-900 mb-4">
|
|
Dynamic vs Static QR Codes
|
|
</h2>
|
|
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
|
|
Understand why dynamic QR codes are the smart choice for businesses
|
|
</p>
|
|
</div>
|
|
|
|
<Card className="overflow-hidden shadow-xl">
|
|
<div className="grid md:grid-cols-3">
|
|
<div className="p-6 bg-white">
|
|
<h3 className="font-semibold text-lg mb-4">Feature</h3>
|
|
{staticVsDynamic.map((item, index) => (
|
|
<div key={index} className="py-4 border-b last:border-b-0">
|
|
<p className="text-gray-900 font-medium">{item.feature}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
<div className="p-6 bg-gray-50">
|
|
<h3 className="font-semibold text-lg mb-4 text-gray-600">Static QR</h3>
|
|
{staticVsDynamic.map((item, index) => (
|
|
<div key={index} className="py-4 border-b last:border-b-0 flex items-center justify-center">
|
|
{item.static ? (
|
|
<span className="text-green-500 text-2xl">✓</span>
|
|
) : (
|
|
<span className="text-red-500 text-2xl">✗</span>
|
|
)}
|
|
</div>
|
|
))}
|
|
</div>
|
|
<div className="p-6 bg-primary-50">
|
|
<h3 className="font-semibold text-lg mb-4 text-primary-600">Dynamic QR</h3>
|
|
{staticVsDynamic.map((item, index) => (
|
|
<div key={index} className="py-4 border-b last:border-b-0 flex items-center justify-center">
|
|
{item.dynamic ? (
|
|
<span className="text-green-500 text-2xl">✓</span>
|
|
) : (
|
|
<span className="text-red-500 text-2xl">✗</span>
|
|
)}
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</Card>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Features */}
|
|
<section className="py-20">
|
|
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-7xl">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-4xl font-bold text-gray-900 mb-4">
|
|
Powerful Dynamic QR Features
|
|
</h2>
|
|
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
|
|
Everything you need to create, manage, and optimize your QR code campaigns
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
|
|
{dynamicFeatures.map((feature, index) => (
|
|
<Card key={index} className="p-6 hover:shadow-lg transition-shadow">
|
|
<div className="text-4xl mb-4">{feature.icon}</div>
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-2">
|
|
{feature.title}
|
|
</h3>
|
|
<p className="text-gray-600">
|
|
{feature.description}
|
|
</p>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* Use Cases */}
|
|
<section className="py-20 bg-gray-50">
|
|
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-7xl">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-4xl font-bold text-gray-900 mb-4">
|
|
How Businesses Use Dynamic QR Codes
|
|
</h2>
|
|
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
|
|
Real-world examples of dynamic QR code applications
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid md:grid-cols-2 gap-8">
|
|
{useCases.map((useCase, index) => (
|
|
<Card key={index} className="p-8">
|
|
<div className="flex items-start space-x-4">
|
|
<div className="text-4xl">{useCase.icon}</div>
|
|
<div className="flex-1">
|
|
<h3 className="text-2xl font-bold text-gray-900 mb-3">
|
|
{useCase.title}
|
|
</h3>
|
|
<p className="text-gray-600 mb-4">
|
|
{useCase.description}
|
|
</p>
|
|
<div className="bg-blue-50 border-l-4 border-blue-500 p-4">
|
|
<p className="text-sm text-gray-700">
|
|
<strong>Example:</strong> {useCase.example}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
{/* How It Works */}
|
|
<section className="py-20">
|
|
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-5xl">
|
|
<div className="text-center mb-16">
|
|
<h2 className="text-4xl font-bold text-gray-900 mb-4">
|
|
How Dynamic QR Codes Work
|
|
</h2>
|
|
<p className="text-xl text-gray-600">
|
|
Simple technology, powerful results
|
|
</p>
|
|
</div>
|
|
|
|
<div className="grid md:grid-cols-3 gap-8">
|
|
<Card className="p-6 text-center">
|
|
<div className="w-16 h-16 bg-primary-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
|
<span className="text-2xl font-bold text-primary-600">1</span>
|
|
</div>
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-2">Create QR Code</h3>
|
|
<p className="text-gray-600">
|
|
Generate a dynamic QR code with a short redirect URL
|
|
</p>
|
|
</Card>
|
|
|
|
<Card className="p-6 text-center">
|
|
<div className="w-16 h-16 bg-primary-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
|
<span className="text-2xl font-bold text-primary-600">2</span>
|
|
</div>
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-2">Print Anywhere</h3>
|
|
<p className="text-gray-600">
|
|
Add to packaging, posters, cards, or anywhere you need
|
|
</p>
|
|
</Card>
|
|
|
|
<Card className="p-6 text-center">
|
|
<div className="w-16 h-16 bg-primary-100 rounded-full flex items-center justify-center mx-auto mb-4">
|
|
<span className="text-2xl font-bold text-primary-600">3</span>
|
|
</div>
|
|
<h3 className="text-xl font-semibold text-gray-900 mb-2">Update Anytime</h3>
|
|
<p className="text-gray-600">
|
|
Change the destination URL from your dashboard whenever needed
|
|
</p>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<GrowthLinksSection
|
|
eyebrow="Best next workflows"
|
|
title="See where dynamic QR becomes most useful"
|
|
description="These are the strongest first workflows for dynamic QR because the printed asset stays the same while the destination or campaign context keeps moving."
|
|
links={relatedUseCaseLinks}
|
|
pageType="commercial"
|
|
cluster="dynamic-qr"
|
|
/>
|
|
|
|
{/* CTA Section */}
|
|
<section className="py-20 bg-gradient-to-r from-purple-600 to-blue-600 text-white">
|
|
<div className="container mx-auto px-4 sm:px-6 lg:px-8 max-w-4xl text-center">
|
|
<h2 className="text-4xl font-bold mb-6">
|
|
Start Creating Dynamic QR Codes Today
|
|
</h2>
|
|
<p className="text-xl mb-8 text-purple-100">
|
|
Use one QR code that can keep working even when the destination behind it needs to change.
|
|
</p>
|
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<TrackedCtaLink href="/signup" ctaLabel="Get Started Free" ctaLocation="footer_primary" pageType="commercial" cluster="dynamic-qr">
|
|
<Button size="lg" variant="secondary" className="text-lg px-8 py-4 w-full sm:w-auto bg-white text-purple-600 hover:bg-gray-100">
|
|
Get Started Free
|
|
</Button>
|
|
</TrackedCtaLink>
|
|
<TrackedCtaLink href="/signup" ctaLabel="Create QR Code Now" ctaLocation="footer_secondary" pageType="commercial" cluster="dynamic-qr">
|
|
<Button size="lg" variant="outline" className="text-lg px-8 py-4 w-full sm:w-auto border-white text-white hover:bg-white/10">
|
|
Create QR Code Now
|
|
</Button>
|
|
</TrackedCtaLink>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|