feat: add marketing landing pages and tools for dynamic QR codes and analytics
This commit is contained in:
BIN
public/blog/static-vs-dynamic-qr-code.png
Normal file
BIN
public/blog/static-vs-dynamic-qr-code.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 MiB |
@@ -6,7 +6,7 @@ import { usePathname } from 'next/navigation';
|
|||||||
import { Button } from '@/components/ui/Button';
|
import { Button } from '@/components/ui/Button';
|
||||||
import { Footer } from '@/components/ui/Footer';
|
import { Footer } from '@/components/ui/Footer';
|
||||||
import en from '@/i18n/en.json';
|
import en from '@/i18n/en.json';
|
||||||
import { ChevronDown, BookOpen, Building2, Wifi, Contact, MessageCircle, QrCode, Link2, Type, Mail, MessageSquare, Phone, Calendar, MapPin, Facebook, Instagram, Twitter, Youtube, Music, Bitcoin, CreditCard, Video, Users, Barcode as BarcodeIcon } from 'lucide-react';
|
import { ChevronDown, BookOpen, Building2, Wifi, Contact, MessageCircle, QrCode, Link2, Type, Mail, MessageSquare, Phone, Calendar, MapPin, Facebook, Instagram, Twitter, Youtube, Music, Bitcoin, CreditCard, Video, Users, Barcode as BarcodeIcon, Star } from 'lucide-react';
|
||||||
import { cn } from '@/lib/utils';
|
import { cn } from '@/lib/utils';
|
||||||
import { AnimatePresence, motion } from 'framer-motion';
|
import { AnimatePresence, motion } from 'framer-motion';
|
||||||
import { allUseCases } from '@/lib/growth-pages';
|
import { allUseCases } from '@/lib/growth-pages';
|
||||||
@@ -67,6 +67,7 @@ export default function MarketingLayout({
|
|||||||
{ name: 'Zoom', description: 'Join Zoom meeting', href: '/tools/zoom-qr-code', icon: Video, color: 'text-sky-500', bgColor: 'bg-sky-50' },
|
{ name: 'Zoom', description: 'Join Zoom meeting', href: '/tools/zoom-qr-code', icon: Video, color: 'text-sky-500', bgColor: 'bg-sky-50' },
|
||||||
{ name: 'Teams', description: 'Join Teams meeting', href: '/tools/teams-qr-code', icon: Users, color: 'text-violet-500', bgColor: 'bg-violet-50' },
|
{ name: 'Teams', description: 'Join Teams meeting', href: '/tools/teams-qr-code', icon: Users, color: 'text-violet-500', bgColor: 'bg-violet-50' },
|
||||||
{ name: 'Barcode', description: 'Generate barcodes', href: '/tools/barcode-generator', icon: BarcodeIcon, color: 'text-slate-800', bgColor: 'bg-slate-100' },
|
{ name: 'Barcode', description: 'Generate barcodes', href: '/tools/barcode-generator', icon: BarcodeIcon, color: 'text-slate-800', bgColor: 'bg-slate-100' },
|
||||||
|
{ name: 'Google Review', description: 'Get more reviews', href: '/tools/google-review-qr-code', icon: Star, color: 'text-yellow-500', bgColor: 'bg-yellow-50' },
|
||||||
];
|
];
|
||||||
|
|
||||||
const resources = [
|
const resources = [
|
||||||
@@ -129,6 +130,7 @@ export default function MarketingLayout({
|
|||||||
<li><a href="/tools/zoom-qr-code">Zoom QR Code</a></li>
|
<li><a href="/tools/zoom-qr-code">Zoom QR Code</a></li>
|
||||||
<li><a href="/tools/teams-qr-code">Teams QR Code</a></li>
|
<li><a href="/tools/teams-qr-code">Teams QR Code</a></li>
|
||||||
<li><a href="/tools/barcode-generator">Barcode Generator</a></li>
|
<li><a href="/tools/barcode-generator">Barcode Generator</a></li>
|
||||||
|
<li><a href="/tools/google-review-qr-code">Google Review QR Code</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -314,6 +314,18 @@ export default function CustomQRCodeGeneratorPage() {
|
|||||||
description: 'Useful when branded property signage needs a cleaner listing handoff and trackable scan context.',
|
description: 'Useful when branded property signage needs a cleaner listing handoff and trackable scan context.',
|
||||||
ctaLabel: 'Create your real estate QR code',
|
ctaLabel: 'Create your real estate QR code',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
href: '/dynamic-qr-code-generator',
|
||||||
|
title: 'Dynamic QR Code Generator',
|
||||||
|
description: 'Add tracking and updatable destinations to your branded QR codes.',
|
||||||
|
ctaLabel: 'Create dynamic QR',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/tools/vcard-qr-code',
|
||||||
|
title: 'vCard QR Code Generator',
|
||||||
|
description: 'Turn your brand identity into a scannable digital business card.',
|
||||||
|
ctaLabel: 'Create vCard QR',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
href: '/use-cases',
|
href: '/use-cases',
|
||||||
title: 'Explore the use-case hub',
|
title: 'Explore the use-case hub',
|
||||||
|
|||||||
@@ -273,6 +273,20 @@ const relatedUseCaseLinks = [
|
|||||||
description: featuredUseCases[1].summary,
|
description: featuredUseCases[1].summary,
|
||||||
ctaLabel: featuredUseCases[1].ctaLabel,
|
ctaLabel: featuredUseCases[1].ctaLabel,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
href: '/qr-code-tracking',
|
||||||
|
title: 'Track Every QR Code Scan',
|
||||||
|
description:
|
||||||
|
'See device, time, and location context for every scan. Understand which placements drive real activity.',
|
||||||
|
ctaLabel: 'Track your QR scans',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/reprint-calculator',
|
||||||
|
title: 'QR Code Reprint Cost Calculator',
|
||||||
|
description:
|
||||||
|
'Calculate how much static QR reprints cost vs one active dynamic QR code.',
|
||||||
|
ctaLabel: 'Calculate reprint savings',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
href: '/use-cases',
|
href: '/use-cases',
|
||||||
title: 'Explore the use-case hub',
|
title: 'Explore the use-case hub',
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ import {
|
|||||||
buildUseCaseMetadata,
|
buildUseCaseMetadata,
|
||||||
UseCasePageTemplate,
|
UseCasePageTemplate,
|
||||||
} from "@/components/marketing/UseCasePageTemplate";
|
} from "@/components/marketing/UseCasePageTemplate";
|
||||||
|
import { GrowthLinksSection } from "@/components/marketing/GrowthLinksSection";
|
||||||
|
|
||||||
export const metadata: Metadata = buildUseCaseMetadata({
|
export const metadata: Metadata = buildUseCaseMetadata({
|
||||||
title: "QR Code Analytics",
|
title: "QR Code Analytics",
|
||||||
@@ -38,6 +39,7 @@ const softwareSchema = {
|
|||||||
|
|
||||||
export default function QRCodeAnalyticsPage() {
|
export default function QRCodeAnalyticsPage() {
|
||||||
return (
|
return (
|
||||||
|
<>
|
||||||
<UseCasePageTemplate
|
<UseCasePageTemplate
|
||||||
title="QR Code Analytics"
|
title="QR Code Analytics"
|
||||||
description="Measure QR code scans by placement, timing, device context, and campaign route so offline workflows become reportable."
|
description="Measure QR code scans by placement, timing, device context, and campaign route so offline workflows become reportable."
|
||||||
@@ -139,5 +141,39 @@ export default function QRCodeAnalyticsPage() {
|
|||||||
]}
|
]}
|
||||||
schemaData={[softwareSchema]}
|
schemaData={[softwareSchema]}
|
||||||
/>
|
/>
|
||||||
|
<GrowthLinksSection
|
||||||
|
eyebrow="Related workflows"
|
||||||
|
title="Analytics is only the start"
|
||||||
|
description="Tracking scans is more useful when it connects to destination flexibility, campaign comparison, and cost planning."
|
||||||
|
links={[
|
||||||
|
{
|
||||||
|
href: '/qr-code-tracking',
|
||||||
|
title: 'QR Code Tracking',
|
||||||
|
description: 'See device, time, and location context for every scan. Understand which placements drive real activity.',
|
||||||
|
ctaLabel: 'Track QR code scans',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/dynamic-qr-code-generator',
|
||||||
|
title: 'Dynamic QR Code Generator',
|
||||||
|
description: 'Create QR codes with updatable destinations so analytics can inform what to change — without reprinting.',
|
||||||
|
ctaLabel: 'Create dynamic QR code',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/reprint-calculator',
|
||||||
|
title: 'Reprint Cost Calculator',
|
||||||
|
description: 'Calculate how much static reprints are costing vs one dynamic QR subscription.',
|
||||||
|
ctaLabel: 'Calculate reprint savings',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/pricing',
|
||||||
|
title: 'Compare Plans',
|
||||||
|
description: 'See which plan gives you the scan volume, analytics depth, and QR code count your workflows need.',
|
||||||
|
ctaLabel: 'Compare plans',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
pageType="commercial"
|
||||||
|
cluster="qr-analytics"
|
||||||
|
/>
|
||||||
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
321
src/app/(main)/(marketing)/qr-code-print-size-guide/page.tsx
Normal file
321
src/app/(main)/(marketing)/qr-code-print-size-guide/page.tsx
Normal file
@@ -0,0 +1,321 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import type { Metadata } from 'next';
|
||||||
|
import SeoJsonLd from '@/components/SeoJsonLd';
|
||||||
|
import { GrowthLinksSection } from '@/components/marketing/GrowthLinksSection';
|
||||||
|
import { breadcrumbSchema } from '@/lib/schema';
|
||||||
|
import Breadcrumbs from '@/components/Breadcrumbs';
|
||||||
|
|
||||||
|
export const metadata: Metadata = {
|
||||||
|
title: 'QR Code Print Size Guide: Minimum Sizes for Every Surface | QR Master',
|
||||||
|
description: 'The minimum QR code size for print depends on scan distance. This guide gives you exact dimensions for business cards, flyers, posters, and billboards.',
|
||||||
|
keywords: ['minimum qr code size', 'qr code print size', 'qr code size for print', 'how big should a qr code be', 'qr code dimensions'],
|
||||||
|
alternates: {
|
||||||
|
canonical: 'https://www.qrmaster.net/qr-code-print-size-guide',
|
||||||
|
},
|
||||||
|
openGraph: {
|
||||||
|
title: 'QR Code Print Size Guide | QR Master',
|
||||||
|
description: 'Exact QR code dimensions for every print surface — from business cards to billboards.',
|
||||||
|
type: 'article',
|
||||||
|
url: 'https://www.qrmaster.net/qr-code-print-size-guide',
|
||||||
|
},
|
||||||
|
robots: {
|
||||||
|
index: true,
|
||||||
|
follow: true,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const breadcrumbs = [
|
||||||
|
{ name: 'Home', url: '/' },
|
||||||
|
{ name: 'QR Code Print Size Guide', url: '/qr-code-print-size-guide' },
|
||||||
|
];
|
||||||
|
|
||||||
|
const articleSchema = {
|
||||||
|
'@context': 'https://schema.org',
|
||||||
|
'@type': 'Article',
|
||||||
|
'@id': 'https://www.qrmaster.net/qr-code-print-size-guide#article',
|
||||||
|
headline: 'QR Code Print Size Guide: Minimum Sizes for Every Surface',
|
||||||
|
description: 'The minimum QR code size for print depends on scan distance. This guide gives you exact dimensions for business cards, flyers, posters, and billboards.',
|
||||||
|
author: {
|
||||||
|
'@type': 'Organization',
|
||||||
|
name: 'QR Master',
|
||||||
|
url: 'https://www.qrmaster.net',
|
||||||
|
},
|
||||||
|
publisher: {
|
||||||
|
'@type': 'Organization',
|
||||||
|
name: 'QR Master',
|
||||||
|
url: 'https://www.qrmaster.net',
|
||||||
|
},
|
||||||
|
datePublished: '2026-04-07',
|
||||||
|
dateModified: '2026-04-07',
|
||||||
|
mainEntityOfPage: 'https://www.qrmaster.net/qr-code-print-size-guide',
|
||||||
|
};
|
||||||
|
|
||||||
|
const faqSchema = {
|
||||||
|
'@context': 'https://schema.org',
|
||||||
|
'@type': 'FAQPage',
|
||||||
|
mainEntity: [
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'What is the minimum size for a QR code to be scannable?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'The minimum recommended size is 2 × 2 cm (0.8 × 0.8 in) for QR codes scanned at very close range (under 10 cm), such as on business cards. For most print materials scanned at arm\'s length (30–40 cm), use at least 3 × 3 cm.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'What DPI should I use for printing a QR code?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'For print, export your QR code at a minimum of 300 DPI. For large-format printing (posters, banners), use the vector SVG format instead of PNG — SVG scales to any size without quality loss.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'How big should a QR code be on a poster?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'For an A2 poster (420 × 594 mm) viewed at 1–2 metres, use a QR code that is at least 8 × 8 cm. Larger is always better — a 10 × 10 cm code scans reliably from 2–3 metres away.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'How big should a QR code be on a business card?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'On a standard business card (85 × 55 mm), a QR code of 2 × 2 cm to 2.5 × 2.5 cm works reliably when held at normal reading distance (15–20 cm).',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'Does adding a logo to a QR code affect scannability?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'Only if the logo covers more than about 30% of the QR code area. QR codes have built-in error correction. At "Q" (25%) or "H" (30%) error correction level, a logo is fine. Always test scan after adding a logo.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
const sizeData = [
|
||||||
|
{ surface: 'Business Card', scanDistance: '15–20 cm', minSize: '2 × 2 cm', recommended: '2.5 × 2.5 cm', dpi: '300 DPI PNG', format: 'PNG or SVG' },
|
||||||
|
{ surface: 'Flyer / Leaflet', scanDistance: '20–30 cm', minSize: '3 × 3 cm', recommended: '4 × 4 cm', dpi: '300 DPI PNG', format: 'PNG or SVG' },
|
||||||
|
{ surface: 'A4 Poster', scanDistance: '30–60 cm', minSize: '5 × 5 cm', recommended: '7 × 7 cm', dpi: '300 DPI PNG', format: 'SVG recommended' },
|
||||||
|
{ surface: 'A2 / A1 Poster', scanDistance: '1–2 m', minSize: '8 × 8 cm', recommended: '10 × 10 cm', dpi: '300 DPI', format: 'SVG required' },
|
||||||
|
{ surface: 'Window / Banner', scanDistance: '1–3 m', minSize: '10 × 10 cm', recommended: '15 × 15 cm', dpi: 'Vector only', format: 'SVG required' },
|
||||||
|
{ surface: 'Billboard', scanDistance: '3–10 m', minSize: '20 × 20 cm', recommended: '30 × 30 cm', dpi: 'Vector only', format: 'SVG required' },
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function QRCodePrintSizeGuidePage() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<SeoJsonLd data={[articleSchema, faqSchema, breadcrumbSchema(breadcrumbs)]} />
|
||||||
|
|
||||||
|
<div className="min-h-screen bg-white">
|
||||||
|
|
||||||
|
{/* HERO */}
|
||||||
|
<section className="pt-20 pb-12 bg-gradient-to-br from-slate-900 to-slate-700 text-white">
|
||||||
|
<div className="container mx-auto px-4 max-w-4xl">
|
||||||
|
<Breadcrumbs items={breadcrumbs} className="[&_ol]:text-white/70 [&_span.font-semibold]:text-white [&_a]:text-white/70 [&_span]:text-white/70" />
|
||||||
|
<div className="mt-6 inline-flex items-center gap-2 px-3 py-1 rounded-full bg-white/10 text-white/80 text-sm font-medium mb-6 border border-white/10">
|
||||||
|
Print Guide
|
||||||
|
</div>
|
||||||
|
<h1 className="text-4xl lg:text-5xl font-black mb-6 leading-tight">
|
||||||
|
QR Code Print Size Guide
|
||||||
|
</h1>
|
||||||
|
<p className="text-xl text-slate-300 max-w-2xl leading-relaxed mb-4">
|
||||||
|
The right QR code size depends on one thing: how far away will the scanner be?
|
||||||
|
This guide gives you exact minimum dimensions for every print surface.
|
||||||
|
</p>
|
||||||
|
<div className="bg-white/10 border border-white/20 rounded-xl p-4 mt-6 max-w-xl">
|
||||||
|
<p className="text-sm font-semibold text-white mb-1">Quick Rule of Thumb</p>
|
||||||
|
<p className="text-slate-300 text-sm">
|
||||||
|
QR code width = scan distance ÷ 10. Example: scanning from 30 cm → minimum 3 cm wide.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* SIZE TABLE */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8">
|
||||||
|
<div className="max-w-5xl mx-auto">
|
||||||
|
<h2 className="text-2xl font-bold text-slate-900 mb-8">
|
||||||
|
Recommended Size by Print Surface and Scan Distance
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<div className="overflow-x-auto rounded-2xl border border-slate-200 shadow-sm">
|
||||||
|
<table className="w-full text-sm">
|
||||||
|
<thead>
|
||||||
|
<tr className="bg-slate-900 text-white">
|
||||||
|
<th className="px-5 py-4 text-left font-semibold">Surface</th>
|
||||||
|
<th className="px-5 py-4 text-left font-semibold">Scan Distance</th>
|
||||||
|
<th className="px-5 py-4 text-left font-semibold">Minimum Size</th>
|
||||||
|
<th className="px-5 py-4 text-left font-semibold">Recommended</th>
|
||||||
|
<th className="px-5 py-4 text-left font-semibold">Format</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{sizeData.map((row, i) => (
|
||||||
|
<tr key={row.surface} className={i % 2 === 0 ? 'bg-white' : 'bg-slate-50'}>
|
||||||
|
<td className="px-5 py-4 font-semibold text-slate-900">{row.surface}</td>
|
||||||
|
<td className="px-5 py-4 text-slate-600">{row.scanDistance}</td>
|
||||||
|
<td className="px-5 py-4 text-red-700 font-semibold">{row.minSize}</td>
|
||||||
|
<td className="px-5 py-4 text-green-700 font-semibold">{row.recommended}</td>
|
||||||
|
<td className="px-5 py-4 text-slate-600">{row.format}</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<p className="mt-4 text-xs text-slate-500">
|
||||||
|
Sizes are for QR codes with standard black-on-white contrast at error correction level Q or H. Reduce minimum sizes by 20% only in ideal lighting conditions.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* DPI & FORMAT GUIDE */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-slate-50 border-y border-slate-200">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
<h2 className="text-2xl font-bold text-slate-900 mb-8">DPI and Format Requirements</h2>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-3 gap-6">
|
||||||
|
<div className="bg-white p-6 rounded-2xl border border-slate-100 shadow-sm">
|
||||||
|
<div className="w-10 h-10 rounded-xl bg-blue-100 flex items-center justify-center mb-4">
|
||||||
|
<span className="font-bold text-blue-700 text-sm">PNG</span>
|
||||||
|
</div>
|
||||||
|
<h3 className="font-bold text-slate-900 mb-2">PNG for Small Print</h3>
|
||||||
|
<p className="text-sm text-slate-600 leading-relaxed">
|
||||||
|
Use PNG at <strong>300 DPI minimum</strong> for business cards, flyers, and small posters. Export at 10× your target print size in pixels (e.g. 3 cm at 300 DPI = 354 px).
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-white p-6 rounded-2xl border border-emerald-100 shadow-sm ring-1 ring-emerald-200">
|
||||||
|
<div className="w-10 h-10 rounded-xl bg-emerald-100 flex items-center justify-center mb-4">
|
||||||
|
<span className="font-bold text-emerald-700 text-sm">SVG</span>
|
||||||
|
</div>
|
||||||
|
<h3 className="font-bold text-slate-900 mb-2">SVG for Everything Larger</h3>
|
||||||
|
<p className="text-sm text-slate-600 leading-relaxed">
|
||||||
|
SVG is a vector format — it scales to any size without quality loss. Use SVG for all A2+ posters, banners, and billboards. QR Master exports SVG directly from the generator.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-white p-6 rounded-2xl border border-slate-100 shadow-sm">
|
||||||
|
<div className="w-10 h-10 rounded-xl bg-amber-100 flex items-center justify-center mb-4">
|
||||||
|
<span className="font-bold text-amber-700 text-sm">ECL</span>
|
||||||
|
</div>
|
||||||
|
<h3 className="font-bold text-slate-900 mb-2">Error Correction Level</h3>
|
||||||
|
<p className="text-sm text-slate-600 leading-relaxed">
|
||||||
|
Use <strong>Level Q</strong> (25% recovery) or <strong>Level H</strong> (30% recovery) for print — especially if you add a logo. Higher error correction means more modules and a slightly larger minimum size.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* PRINT CHECKLIST */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8">
|
||||||
|
<div className="max-w-3xl mx-auto">
|
||||||
|
<h2 className="text-2xl font-bold text-slate-900 mb-8">Print QR Code Checklist</h2>
|
||||||
|
<ul className="space-y-3">
|
||||||
|
{[
|
||||||
|
'QR code is at least the minimum size for the intended scan distance',
|
||||||
|
'High contrast between QR modules and background (black on white preferred)',
|
||||||
|
'Quiet zone (white border) of at least 4 module widths on all sides',
|
||||||
|
'Exported as SVG for large format, PNG at 300+ DPI for small format',
|
||||||
|
'Scanned from target distance before sending to print',
|
||||||
|
'Error correction set to Q or H if a logo is embedded',
|
||||||
|
'Dynamic QR code used if the destination URL might change',
|
||||||
|
].map((item) => (
|
||||||
|
<li key={item} className="flex items-start gap-3">
|
||||||
|
<span className="mt-0.5 w-5 h-5 rounded-full bg-green-100 flex items-center justify-center shrink-0">
|
||||||
|
<svg className="w-3 h-3 text-green-600" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={3}>
|
||||||
|
<path strokeLinecap="round" strokeLinejoin="round" d="M5 13l4 4L19 7" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
<span className="text-slate-700 text-sm leading-relaxed">{item}</span>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<GrowthLinksSection
|
||||||
|
eyebrow="Ready to print?"
|
||||||
|
title="Create your print-ready QR code"
|
||||||
|
description="Generate, customize, and download QR codes in SVG or PNG at any size you need."
|
||||||
|
links={[
|
||||||
|
{
|
||||||
|
href: '/reprint-calculator',
|
||||||
|
title: 'Reprint Cost Calculator',
|
||||||
|
description: 'Calculate how much static reprints are costing vs one dynamic QR subscription.',
|
||||||
|
ctaLabel: 'Calculate reprint savings',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/dynamic-qr-code-generator',
|
||||||
|
title: 'Dynamic QR Code Generator',
|
||||||
|
description: 'Create QR codes you can update after printing. No reprint needed when links change.',
|
||||||
|
ctaLabel: 'Create dynamic QR code',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/custom-qr-code-generator',
|
||||||
|
title: 'Custom QR Code Generator',
|
||||||
|
description: 'Add your logo, brand colors, and a frame to create print-ready branded QR codes.',
|
||||||
|
ctaLabel: 'Create custom QR code',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
pageType="commercial"
|
||||||
|
cluster="print-size-guide"
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* FAQ */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-slate-50">
|
||||||
|
<div className="max-w-3xl mx-auto">
|
||||||
|
<h2 className="text-2xl font-bold text-slate-900 text-center mb-10">
|
||||||
|
Frequently Asked Questions
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<div className="space-y-4">
|
||||||
|
{[
|
||||||
|
{
|
||||||
|
question: 'What is the minimum size for a QR code to be scannable?',
|
||||||
|
answer: 'The absolute minimum is 2 × 2 cm for scanning at very close range (business cards, held 15 cm away). For most materials, use at least 3 × 3 cm. The general rule: minimum width = scan distance ÷ 10.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: 'What DPI should I use for printing a QR code?',
|
||||||
|
answer: 'Use 300 DPI minimum for all print. For large format (posters, banners, billboards), always use SVG — it is vector-based and scales to any size without quality loss.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: 'How big should a QR code be on a poster?',
|
||||||
|
answer: 'For an A2 poster viewed at 1–2 metres, use at least 8 × 8 cm. For A1 posters viewed from further away, 10 × 10 cm is recommended.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: 'How big should a QR code be on a business card?',
|
||||||
|
answer: 'On a standard business card (85 × 55 mm), a 2 × 2 cm to 2.5 × 2.5 cm QR code works reliably when scanned at normal reading distance.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: 'Does adding a logo affect QR code scannability?',
|
||||||
|
answer: 'Only if the logo covers more than ~30% of the QR area. Use error correction level Q or H when adding logos. Always test scan before printing at scale.',
|
||||||
|
},
|
||||||
|
].map((item) => (
|
||||||
|
<details key={item.question} className="group bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||||
|
<summary className="flex items-center justify-between p-5 cursor-pointer list-none text-slate-900 font-semibold hover:bg-slate-50 transition-colors">
|
||||||
|
{item.question}
|
||||||
|
<span className="transition group-open:rotate-180 text-slate-400">
|
||||||
|
<svg fill="none" height="20" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" viewBox="0 0 24 24" width="20">
|
||||||
|
<path d="M6 9l6 6 6-6" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</summary>
|
||||||
|
<div className="text-slate-600 px-5 pb-5 pt-0 leading-relaxed text-sm">
|
||||||
|
{item.answer}
|
||||||
|
</div>
|
||||||
|
</details>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -241,6 +241,20 @@ const relatedUseCaseLinks = [
|
|||||||
'Tie printed discount placements to measurable scans so you can compare promotion performance.',
|
'Tie printed discount placements to measurable scans so you can compare promotion performance.',
|
||||||
ctaLabel: 'Create your coupon QR code',
|
ctaLabel: 'Create your coupon QR code',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
href: '/qr-code-analytics',
|
||||||
|
title: 'QR Code Analytics Dashboard',
|
||||||
|
description:
|
||||||
|
'Go deeper into placement-level reporting and offline campaign attribution.',
|
||||||
|
ctaLabel: 'Explore QR analytics',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/reprint-calculator',
|
||||||
|
title: 'QR Code Reprint Cost Calculator',
|
||||||
|
description:
|
||||||
|
'See how much dynamic QR codes save vs reprinting static codes each campaign.',
|
||||||
|
ctaLabel: 'Calculate reprint savings',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
href: '/use-cases',
|
href: '/use-cases',
|
||||||
title: 'Explore the use-case hub',
|
title: 'Explore the use-case hub',
|
||||||
|
|||||||
@@ -2,6 +2,9 @@ import React from 'react';
|
|||||||
import type { Metadata } from 'next';
|
import type { Metadata } from 'next';
|
||||||
import ReprintSavingsCalculator from '@/components/marketing/ReprintSavingsCalculator';
|
import ReprintSavingsCalculator from '@/components/marketing/ReprintSavingsCalculator';
|
||||||
import { ArrowDown, Check, ShieldCheck, Zap } from 'lucide-react';
|
import { ArrowDown, Check, ShieldCheck, Zap } from 'lucide-react';
|
||||||
|
import SeoJsonLd from '@/components/SeoJsonLd';
|
||||||
|
import { GrowthLinksSection } from '@/components/marketing/GrowthLinksSection';
|
||||||
|
import { breadcrumbSchema } from '@/lib/schema';
|
||||||
|
|
||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: 'Reprint Cost Calculator | QR Master',
|
title: 'Reprint Cost Calculator | QR Master',
|
||||||
@@ -30,9 +33,58 @@ export const metadata: Metadata = {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const softwareSchema = {
|
||||||
|
'@context': 'https://schema.org',
|
||||||
|
'@type': 'WebApplication',
|
||||||
|
'@id': 'https://www.qrmaster.net/reprint-calculator#app',
|
||||||
|
name: 'QR Code Reprint Cost Calculator',
|
||||||
|
applicationCategory: 'BusinessApplication',
|
||||||
|
operatingSystem: 'Web Browser',
|
||||||
|
offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
|
||||||
|
description: 'Calculate the cost of reprinting static QR codes vs switching to dynamic QR codes that never need reprinting.',
|
||||||
|
};
|
||||||
|
|
||||||
|
const howToSchema = {
|
||||||
|
'@context': 'https://schema.org',
|
||||||
|
'@type': 'HowTo',
|
||||||
|
name: 'How to calculate QR code reprint costs',
|
||||||
|
step: [
|
||||||
|
{ '@type': 'HowToStep', position: 1, name: 'Enter print run size', text: 'Enter how many QR codes you print per campaign.' },
|
||||||
|
{ '@type': 'HowToStep', position: 2, name: 'Enter reprint cost', text: 'Enter your cost per reprint campaign.' },
|
||||||
|
{ '@type': 'HowToStep', position: 3, name: 'See annual savings', text: 'The calculator shows how much dynamic QR codes save annually.' },
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
const breadcrumbs = [
|
||||||
|
{ name: 'Home', url: '/' },
|
||||||
|
{ name: 'Reprint Calculator', url: '/reprint-calculator' },
|
||||||
|
];
|
||||||
|
|
||||||
|
const growthLinks = [
|
||||||
|
{
|
||||||
|
href: '/dynamic-qr-code-generator',
|
||||||
|
title: 'Dynamic QR Code Generator',
|
||||||
|
description: 'Create QR codes you can update after printing. Change the destination without reprinting a single flyer.',
|
||||||
|
ctaLabel: 'Create dynamic QR code',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/qr-code-tracking',
|
||||||
|
title: 'QR Code Tracking',
|
||||||
|
description: 'See device, time, and location context for every scan. Know which placements drive real activity.',
|
||||||
|
ctaLabel: 'Track your QR scans',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/pricing',
|
||||||
|
title: 'Compare Plans',
|
||||||
|
description: 'One dynamic QR subscription costs less than a single batch of reprints. See the plan that fits your volume.',
|
||||||
|
ctaLabel: 'Compare plans',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
export default function ReprintCalculatorPage() {
|
export default function ReprintCalculatorPage() {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
|
<SeoJsonLd data={[softwareSchema, howToSchema, breadcrumbSchema(breadcrumbs)]} />
|
||||||
{/* Hero Section */}
|
{/* Hero Section */}
|
||||||
<section className="pt-24 pb-12 bg-white relative overflow-hidden">
|
<section className="pt-24 pb-12 bg-white relative overflow-hidden">
|
||||||
<div className="container mx-auto px-4 text-center max-w-3xl relative z-10">
|
<div className="container mx-auto px-4 text-center max-w-3xl relative z-10">
|
||||||
@@ -112,6 +164,15 @@ export default function ReprintCalculatorPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<GrowthLinksSection
|
||||||
|
eyebrow="Next steps"
|
||||||
|
title="Stop reprinting. Start updating."
|
||||||
|
description="Dynamic QR codes let you change the destination after printing. One code, unlimited campaigns."
|
||||||
|
links={growthLinks}
|
||||||
|
pageType="commercial"
|
||||||
|
cluster="reprint-calculator"
|
||||||
|
/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,213 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import React, { useState, useRef } from 'react';
|
||||||
|
import { QRCodeSVG } from 'qrcode.react';
|
||||||
|
import { toPng } from 'html-to-image';
|
||||||
|
import { Star, Download, AlertCircle } from 'lucide-react';
|
||||||
|
import { Button } from '@/components/ui/Button';
|
||||||
|
import { Input } from '@/components/ui/Input';
|
||||||
|
|
||||||
|
const QR_COLORS = [
|
||||||
|
{ name: 'Google Blue', value: '#1A73E8' },
|
||||||
|
{ name: 'Classic Black', value: '#000000' },
|
||||||
|
{ name: 'Indigo', value: '#4F46E5' },
|
||||||
|
{ name: 'Emerald', value: '#10B981' },
|
||||||
|
{ name: 'Rose', value: '#F43F5E' },
|
||||||
|
{ name: 'Violet', value: '#7C3AED' },
|
||||||
|
];
|
||||||
|
|
||||||
|
const FRAME_OPTIONS = [
|
||||||
|
{ id: 'none', label: 'No Frame' },
|
||||||
|
{ id: 'review', label: 'Leave a Review' },
|
||||||
|
{ id: 'scanme', label: 'Scan Me' },
|
||||||
|
{ id: 'feedback', label: 'Share Feedback' },
|
||||||
|
];
|
||||||
|
|
||||||
|
function isValidGoogleReviewLink(url: string): boolean {
|
||||||
|
try {
|
||||||
|
const parsed = new URL(url);
|
||||||
|
return (
|
||||||
|
parsed.hostname.includes('google.com') ||
|
||||||
|
parsed.hostname.includes('g.page') ||
|
||||||
|
parsed.hostname.includes('maps.app.goo.gl')
|
||||||
|
);
|
||||||
|
} catch {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function GoogleReviewGenerator() {
|
||||||
|
const [reviewUrl, setReviewUrl] = useState('');
|
||||||
|
const [qrColor, setQrColor] = useState('#1A73E8');
|
||||||
|
const [frameType, setFrameType] = useState('review');
|
||||||
|
const [error, setError] = useState('');
|
||||||
|
|
||||||
|
const qrRef = useRef<HTMLDivElement>(null);
|
||||||
|
|
||||||
|
const handleUrlChange = (value: string) => {
|
||||||
|
setReviewUrl(value);
|
||||||
|
if (value && !isValidGoogleReviewLink(value)) {
|
||||||
|
setError('Please enter a valid Google Review link (google.com, g.page, or maps.app.goo.gl)');
|
||||||
|
} else {
|
||||||
|
setError('');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleDownload = async (format: 'png' | 'svg') => {
|
||||||
|
if (!qrRef.current) return;
|
||||||
|
try {
|
||||||
|
if (format === 'png') {
|
||||||
|
const dataUrl = await toPng(qrRef.current, { cacheBust: true, pixelRatio: 3 });
|
||||||
|
const link = document.createElement('a');
|
||||||
|
link.download = 'google-review-qr-code.png';
|
||||||
|
link.href = dataUrl;
|
||||||
|
link.click();
|
||||||
|
} else {
|
||||||
|
const svgData = qrRef.current.querySelector('svg')?.outerHTML;
|
||||||
|
if (svgData) {
|
||||||
|
const blob = new Blob([svgData], { type: 'image/svg+xml;charset=utf-8' });
|
||||||
|
const url = URL.createObjectURL(blob);
|
||||||
|
const link = document.createElement('a');
|
||||||
|
link.href = url;
|
||||||
|
link.download = 'google-review-qr-code.svg';
|
||||||
|
link.click();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.error('Download failed', err);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const frameLabel = FRAME_OPTIONS.find(f => f.id === frameType && f.id !== 'none')?.label ?? null;
|
||||||
|
const isReady = reviewUrl && !error && isValidGoogleReviewLink(reviewUrl);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="w-full max-w-5xl mx-auto px-4 md:px-6">
|
||||||
|
<div className="bg-white rounded-3xl shadow-2xl shadow-slate-900/10 overflow-hidden border border-slate-100">
|
||||||
|
<div className="grid lg:grid-cols-2">
|
||||||
|
|
||||||
|
{/* LEFT: Input */}
|
||||||
|
<div className="p-6 md:p-8 lg:p-10 space-y-8 border-r border-slate-100">
|
||||||
|
|
||||||
|
<div className="space-y-4">
|
||||||
|
<h2 className="text-lg font-bold text-slate-900 flex items-center gap-2">
|
||||||
|
<Star className="w-5 h-5 text-yellow-500" />
|
||||||
|
Your Google Review Link
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<Input
|
||||||
|
type="url"
|
||||||
|
placeholder="https://g.page/r/YOUR_ID/review"
|
||||||
|
value={reviewUrl}
|
||||||
|
onChange={(e) => handleUrlChange(e.target.value)}
|
||||||
|
className="w-full font-mono text-sm"
|
||||||
|
/>
|
||||||
|
{error && (
|
||||||
|
<div className="mt-2 flex items-center gap-2 text-sm text-red-600">
|
||||||
|
<AlertCircle className="w-4 h-4 shrink-0" />
|
||||||
|
{error}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{!reviewUrl && (
|
||||||
|
<p className="mt-2 text-xs text-slate-500">
|
||||||
|
Go to Google Maps → find your business → Share → Copy link
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Color Picker */}
|
||||||
|
<div className="space-y-3">
|
||||||
|
<h3 className="text-sm font-semibold text-slate-700">QR Color</h3>
|
||||||
|
<div className="flex flex-wrap gap-2">
|
||||||
|
{QR_COLORS.map((color) => (
|
||||||
|
<button
|
||||||
|
key={color.value}
|
||||||
|
onClick={() => setQrColor(color.value)}
|
||||||
|
className={`w-8 h-8 rounded-full border-2 transition-all ${
|
||||||
|
qrColor === color.value
|
||||||
|
? 'border-slate-900 scale-110'
|
||||||
|
: 'border-transparent hover:border-slate-300'
|
||||||
|
}`}
|
||||||
|
style={{ backgroundColor: color.value }}
|
||||||
|
title={color.name}
|
||||||
|
/>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Frame */}
|
||||||
|
<div className="space-y-3">
|
||||||
|
<h3 className="text-sm font-semibold text-slate-700">Frame Label</h3>
|
||||||
|
<div className="grid grid-cols-2 gap-2">
|
||||||
|
{FRAME_OPTIONS.map((frame) => (
|
||||||
|
<button
|
||||||
|
key={frame.id}
|
||||||
|
onClick={() => setFrameType(frame.id)}
|
||||||
|
className={`px-3 py-2 rounded-xl text-sm font-medium border transition-all ${
|
||||||
|
frameType === frame.id
|
||||||
|
? 'border-blue-600 bg-blue-50 text-blue-700'
|
||||||
|
: 'border-slate-200 text-slate-600 hover:border-slate-300'
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
{frame.label}
|
||||||
|
</button>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Download Buttons */}
|
||||||
|
<div className="space-y-3">
|
||||||
|
<Button
|
||||||
|
onClick={() => handleDownload('png')}
|
||||||
|
disabled={!isReady}
|
||||||
|
className="w-full flex items-center justify-center gap-2"
|
||||||
|
>
|
||||||
|
<Download className="w-4 h-4" />
|
||||||
|
Download PNG
|
||||||
|
</Button>
|
||||||
|
<button
|
||||||
|
onClick={() => handleDownload('svg')}
|
||||||
|
disabled={!isReady}
|
||||||
|
className="w-full px-4 py-2.5 rounded-xl border border-slate-200 text-slate-700 text-sm font-medium hover:border-slate-300 hover:bg-slate-50 transition-all disabled:opacity-40 disabled:cursor-not-allowed flex items-center justify-center gap-2"
|
||||||
|
>
|
||||||
|
<Download className="w-4 h-4" />
|
||||||
|
Download SVG
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* RIGHT: Preview */}
|
||||||
|
<div className="p-6 md:p-8 lg:p-10 flex flex-col items-center justify-center bg-slate-50">
|
||||||
|
<h3 className="text-sm font-semibold text-slate-500 uppercase tracking-wider mb-6">Preview</h3>
|
||||||
|
|
||||||
|
<div ref={qrRef} className="flex flex-col items-center bg-white p-6 rounded-2xl shadow-sm border border-slate-100">
|
||||||
|
<QRCodeSVG
|
||||||
|
value={isReady ? reviewUrl : 'https://www.qrmaster.net/tools/google-review-qr-code'}
|
||||||
|
size={200}
|
||||||
|
fgColor={qrColor}
|
||||||
|
level="Q"
|
||||||
|
includeMargin={true}
|
||||||
|
/>
|
||||||
|
{frameLabel && (
|
||||||
|
<div
|
||||||
|
className="mt-3 px-4 py-1.5 rounded-full text-sm font-semibold text-white"
|
||||||
|
style={{ backgroundColor: qrColor }}
|
||||||
|
>
|
||||||
|
{frameLabel}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{!isReady && (
|
||||||
|
<p className="mt-4 text-xs text-slate-400 text-center max-w-[200px]">
|
||||||
|
Enter your Google Review link to generate your QR code
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
366
src/app/(main)/(marketing)/tools/google-review-qr-code/page.tsx
Normal file
366
src/app/(main)/(marketing)/tools/google-review-qr-code/page.tsx
Normal file
@@ -0,0 +1,366 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import type { Metadata } from 'next';
|
||||||
|
import GoogleReviewGenerator from './GoogleReviewGenerator';
|
||||||
|
import { Star, MapPin, Search, Share2 } from 'lucide-react';
|
||||||
|
import { QRCodeSVG } from 'qrcode.react';
|
||||||
|
import { ToolBreadcrumb } from '@/components/seo/BreadcrumbSchema';
|
||||||
|
import { RelatedTools } from '@/components/marketing/RelatedTools';
|
||||||
|
import { GrowthLinksSection } from '@/components/marketing/GrowthLinksSection';
|
||||||
|
import { generateSoftwareAppSchema } from '@/lib/schema-utils';
|
||||||
|
|
||||||
|
export const metadata: Metadata = {
|
||||||
|
title: {
|
||||||
|
absolute: 'Google Review QR Code Generator — Free | QR Master',
|
||||||
|
},
|
||||||
|
description: 'Create a QR code for your Google Reviews in seconds. Customers scan once and land directly on your review form. Free, no signup required.',
|
||||||
|
keywords: ['qr code for google reviews', 'qr code generator for google reviews', 'google review qr code', 'google maps review qr code', 'get more google reviews'],
|
||||||
|
alternates: {
|
||||||
|
canonical: 'https://www.qrmaster.net/tools/google-review-qr-code',
|
||||||
|
},
|
||||||
|
openGraph: {
|
||||||
|
title: 'Google Review QR Code Generator — Free | QR Master',
|
||||||
|
description: 'Create a QR code that takes customers directly to your Google review form. More reviews, less friction.',
|
||||||
|
type: 'website',
|
||||||
|
url: 'https://www.qrmaster.net/tools/google-review-qr-code',
|
||||||
|
},
|
||||||
|
twitter: {
|
||||||
|
card: 'summary_large_image',
|
||||||
|
title: 'Google Review QR Code Generator — Free',
|
||||||
|
description: 'Create a QR code that takes customers directly to your Google review form.',
|
||||||
|
},
|
||||||
|
robots: {
|
||||||
|
index: true,
|
||||||
|
follow: true,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const jsonLd = {
|
||||||
|
'@context': 'https://schema.org',
|
||||||
|
'@graph': [
|
||||||
|
generateSoftwareAppSchema(
|
||||||
|
'Google Review QR Code Generator',
|
||||||
|
'Generate a QR code that links directly to your Google review form. Customers scan once and can leave a review immediately.',
|
||||||
|
'/og-image.png'
|
||||||
|
),
|
||||||
|
{
|
||||||
|
'@type': 'HowTo',
|
||||||
|
name: 'How to Create a Google Review QR Code',
|
||||||
|
description: 'Generate a QR code that sends customers directly to your Google review form.',
|
||||||
|
step: [
|
||||||
|
{
|
||||||
|
'@type': 'HowToStep',
|
||||||
|
position: 1,
|
||||||
|
name: 'Find your Google Review link',
|
||||||
|
text: 'Open Google Maps, search for your business, click Share → Copy link. Or use Google Business Profile → Get more reviews.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'HowToStep',
|
||||||
|
position: 2,
|
||||||
|
name: 'Paste the link into the generator',
|
||||||
|
text: 'Paste your Google review URL into the field above. The generator accepts g.page, google.com, and maps.app.goo.gl links.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'HowToStep',
|
||||||
|
position: 3,
|
||||||
|
name: 'Customize and download',
|
||||||
|
text: 'Choose a color and frame label (e.g. "Leave a Review"), then download as PNG or SVG.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'HowToStep',
|
||||||
|
position: 4,
|
||||||
|
name: 'Display the QR code',
|
||||||
|
text: 'Print the code on receipts, table cards, packaging, or your window. Customers scan once to review.',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
totalTime: 'PT60S',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'FAQPage',
|
||||||
|
mainEntity: [
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'How do I find my Google Review link?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'Open Google Maps → search for your business → click Share → Copy link. Alternatively, go to your Google Business Profile dashboard → click "Get more reviews" — this gives you a direct review shortlink.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'Does this Google Review QR code expire?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'No. This is a static QR code that directly encodes your Google review URL. It will work as long as your Google Business Profile is active.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'Can I track how many people scanned the QR code?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'Not with a static QR code. If you need scan analytics (device, location, time), create a dynamic QR code with tracking through QR Master.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'What happens when a customer scans the QR code?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'They are taken directly to your Google review form. If they are logged into a Google account on their phone, they can leave a review immediately with no extra steps.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'Question',
|
||||||
|
name: 'Where should I display the Google Review QR code?',
|
||||||
|
acceptedAnswer: {
|
||||||
|
'@type': 'Answer',
|
||||||
|
text: 'Best placements: receipts, table tent cards (restaurants), checkout counters, packaging inserts, and your shop window. The moment after a positive experience is the best time to ask for a review.',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
'@type': 'BreadcrumbList',
|
||||||
|
itemListElement: [
|
||||||
|
{ '@type': 'ListItem', position: 1, name: 'Home', item: 'https://www.qrmaster.net' },
|
||||||
|
{ '@type': 'ListItem', position: 2, name: 'QR Code Tools', item: 'https://www.qrmaster.net/tools' },
|
||||||
|
{ '@type': 'ListItem', position: 3, name: 'Google Review QR Code Generator', item: 'https://www.qrmaster.net/tools/google-review-qr-code' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function GoogleReviewQRCodePage() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<script
|
||||||
|
type="application/ld+json"
|
||||||
|
dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
|
||||||
|
/>
|
||||||
|
<ToolBreadcrumb toolName="Google Review QR Code Generator" toolSlug="google-review-qr-code" />
|
||||||
|
|
||||||
|
<div className="min-h-screen" style={{ backgroundColor: '#EBEBDF' }}>
|
||||||
|
|
||||||
|
{/* HERO */}
|
||||||
|
<section className="relative pt-20 pb-20 lg:pt-32 lg:pb-32 px-4 sm:px-6 lg:px-8 overflow-hidden bg-[#1A1265]">
|
||||||
|
<div className="max-w-7xl mx-auto grid lg:grid-cols-2 gap-12 items-center relative z-10">
|
||||||
|
<div className="text-center lg:text-left">
|
||||||
|
<div className="inline-flex items-center gap-2 px-3 py-1 rounded-full bg-white/10 text-white/90 text-sm font-medium mb-6 border border-white/10">
|
||||||
|
<span className="flex h-2 w-2 relative">
|
||||||
|
<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-yellow-400 opacity-75"></span>
|
||||||
|
<span className="relative inline-flex rounded-full h-2 w-2 bg-yellow-400"></span>
|
||||||
|
</span>
|
||||||
|
Free Tool — No Signup Required
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h1 className="text-4xl md:text-5xl lg:text-6xl font-extrabold text-white tracking-tight leading-tight mb-6">
|
||||||
|
Google Review QR Code <br className="hidden lg:block" />
|
||||||
|
<span className="text-transparent bg-clip-text bg-gradient-to-r from-yellow-400 to-orange-400">Generator — Free</span>
|
||||||
|
</h1>
|
||||||
|
|
||||||
|
<p className="text-lg md:text-xl text-indigo-100 max-w-2xl mx-auto lg:mx-0 mb-8 leading-relaxed">
|
||||||
|
Customers scan once and land directly on your Google review form.
|
||||||
|
<strong className="text-white block sm:inline mt-2 sm:mt-0"> More reviews, less friction.</strong>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="flex flex-wrap justify-center lg:justify-start gap-4 text-sm font-medium text-white/80">
|
||||||
|
<div className="flex items-center gap-2 bg-white/5 px-4 py-2.5 rounded-xl border border-white/5">
|
||||||
|
<Star className="w-4 h-4 text-yellow-400" />
|
||||||
|
Direct to Review Form
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center gap-2 bg-white/5 px-4 py-2.5 rounded-xl border border-white/5">
|
||||||
|
<MapPin className="w-4 h-4 text-emerald-400" />
|
||||||
|
Works for Any Business
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Hero QR Visual */}
|
||||||
|
<div className="hidden lg:flex relative items-center justify-center min-h-[400px]">
|
||||||
|
<div className="absolute w-[500px] h-[500px] bg-yellow-500/20 rounded-full blur-[100px] -top-20 -right-20 animate-pulse" />
|
||||||
|
<div className="relative w-80 h-96 bg-white/5 backdrop-blur-xl border border-white/20 rounded-3xl shadow-2xl flex flex-col items-center justify-center p-8 transform -rotate-3 hover:rotate-0 transition-all duration-700 group">
|
||||||
|
<div className="absolute inset-0 bg-gradient-to-br from-white/10 to-transparent rounded-3xl" />
|
||||||
|
<div className="w-48 h-48 bg-white rounded-xl p-2 shadow-inner mb-6 relative overflow-hidden flex items-center justify-center">
|
||||||
|
<QRCodeSVG value="https://www.qrmaster.net/tools/google-review-qr-code" size={170} fgColor="#1A73E8" level="Q" />
|
||||||
|
</div>
|
||||||
|
<div className="w-full bg-white/10 rounded-xl p-4 backdrop-blur-sm border border-white/10">
|
||||||
|
<div className="flex items-center gap-3">
|
||||||
|
<div className="w-8 h-8 rounded-full bg-yellow-500/20 flex items-center justify-center">
|
||||||
|
<Star className="w-4 h-4 text-yellow-300" />
|
||||||
|
</div>
|
||||||
|
<div className="space-y-1 w-full">
|
||||||
|
<div className="h-1.5 w-3/4 bg-white/30 rounded-full" />
|
||||||
|
<div className="h-1.5 w-1/2 bg-white/20 rounded-full" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* GENERATOR */}
|
||||||
|
<section className="py-12 px-4 sm:px-6 lg:px-8 -mt-8">
|
||||||
|
<GoogleReviewGenerator />
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* HOW TO FIND YOUR REVIEW LINK */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
<h2 className="text-3xl font-bold text-slate-900 text-center mb-4">
|
||||||
|
How to Find Your Google Review Link
|
||||||
|
</h2>
|
||||||
|
<p className="text-slate-600 text-center mb-12 max-w-2xl mx-auto">
|
||||||
|
You need your Google Business review URL before creating the QR code. Here are two ways to get it.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-2 gap-8">
|
||||||
|
<article className="p-6 bg-slate-50 rounded-2xl border border-slate-100">
|
||||||
|
<div className="w-12 h-12 rounded-xl bg-blue-100 flex items-center justify-center mb-4">
|
||||||
|
<Search className="w-6 h-6 text-blue-600" />
|
||||||
|
</div>
|
||||||
|
<h3 className="font-bold text-slate-900 mb-3">Method 1: Google Maps</h3>
|
||||||
|
<ol className="space-y-2 text-sm text-slate-600 list-none">
|
||||||
|
<li><span className="font-semibold text-slate-800">1.</span> Open Google Maps</li>
|
||||||
|
<li><span className="font-semibold text-slate-800">2.</span> Search for your business name</li>
|
||||||
|
<li><span className="font-semibold text-slate-800">3.</span> Click the <strong>Share</strong> button</li>
|
||||||
|
<li><span className="font-semibold text-slate-800">4.</span> Copy the short link (starts with <code className="bg-white px-1 rounded text-xs">maps.app.goo.gl</code> or <code className="bg-white px-1 rounded text-xs">g.page</code>)</li>
|
||||||
|
<li><span className="font-semibold text-slate-800">5.</span> Paste into the generator above</li>
|
||||||
|
</ol>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article className="p-6 bg-slate-50 rounded-2xl border border-slate-100">
|
||||||
|
<div className="w-12 h-12 rounded-xl bg-yellow-100 flex items-center justify-center mb-4">
|
||||||
|
<Share2 className="w-6 h-6 text-yellow-600" />
|
||||||
|
</div>
|
||||||
|
<h3 className="font-bold text-slate-900 mb-3">Method 2: Google Business Profile</h3>
|
||||||
|
<ol className="space-y-2 text-sm text-slate-600 list-none">
|
||||||
|
<li><span className="font-semibold text-slate-800">1.</span> Sign in to <strong>business.google.com</strong></li>
|
||||||
|
<li><span className="font-semibold text-slate-800">2.</span> Select your business location</li>
|
||||||
|
<li><span className="font-semibold text-slate-800">3.</span> Click <strong>"Get more reviews"</strong></li>
|
||||||
|
<li><span className="font-semibold text-slate-800">4.</span> Copy the review shortlink provided</li>
|
||||||
|
<li><span className="font-semibold text-slate-800">5.</span> Paste into the generator above</li>
|
||||||
|
</ol>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* USE CASES */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8" style={{ backgroundColor: '#EBEBDF' }}>
|
||||||
|
<div className="max-w-5xl mx-auto">
|
||||||
|
<h2 className="text-3xl font-bold text-slate-900 text-center mb-4">
|
||||||
|
Who Uses Google Review QR Codes?
|
||||||
|
</h2>
|
||||||
|
<p className="text-slate-600 text-center mb-12">
|
||||||
|
Any business where the moment of satisfaction happens in person.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="grid sm:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||||
|
{[
|
||||||
|
{ icon: '🍽️', title: 'Restaurants & Cafés', text: 'Print on receipts or table cards. Ask after the meal when the experience is fresh.' },
|
||||||
|
{ icon: '🏨', title: 'Hotels & Guesthouses', text: 'Place on checkout envelopes or in-room cards. Capture reviews at checkout.' },
|
||||||
|
{ icon: '🏥', title: 'Clinics & Salons', text: 'Display at reception. Patients and clients who had a great experience can review in seconds.' },
|
||||||
|
{ icon: '🛍️', title: 'Retail & Shops', text: 'Include in packaging or display at checkout. Turn happy shoppers into reviewers.' },
|
||||||
|
].map((item) => (
|
||||||
|
<article key={item.title} className="p-6 bg-white rounded-2xl border border-slate-100 shadow-sm">
|
||||||
|
<div className="text-3xl mb-3">{item.icon}</div>
|
||||||
|
<h3 className="font-bold text-slate-900 mb-2">{item.title}</h3>
|
||||||
|
<p className="text-sm text-slate-600 leading-relaxed">{item.text}</p>
|
||||||
|
</article>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<GrowthLinksSection
|
||||||
|
eyebrow="Level up your local marketing"
|
||||||
|
title="More QR workflows for local businesses"
|
||||||
|
description="Review QR codes work best alongside dynamic destination management and scan tracking."
|
||||||
|
links={[
|
||||||
|
{
|
||||||
|
href: '/qr-code-for/restaurants',
|
||||||
|
title: 'QR Codes for Restaurants',
|
||||||
|
description: 'Menu, ordering, and review QR workflows built for food service businesses.',
|
||||||
|
ctaLabel: 'Restaurant QR workflows',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/qr-code-for/hotels',
|
||||||
|
title: 'QR Codes for Hotels',
|
||||||
|
description: 'Check-in, room service, and review QR setups for hospitality.',
|
||||||
|
ctaLabel: 'Hotel QR workflows',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/dynamic-qr-code-generator',
|
||||||
|
title: 'Dynamic QR Code Generator',
|
||||||
|
description: 'Update your review link or redirect to a different page anytime — no reprint needed.',
|
||||||
|
ctaLabel: 'Create dynamic QR code',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/qr-code-tracking',
|
||||||
|
title: 'QR Code Tracking',
|
||||||
|
description: 'See exactly how many people scanned your review QR code and from which location.',
|
||||||
|
ctaLabel: 'Track QR code scans',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
pageType="commercial"
|
||||||
|
cluster="google-review-qr"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<RelatedTools />
|
||||||
|
|
||||||
|
{/* FAQ */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8" style={{ backgroundColor: '#EBEBDF' }}>
|
||||||
|
<div className="max-w-3xl mx-auto">
|
||||||
|
<h2 className="text-3xl font-bold text-slate-900 text-center mb-4">
|
||||||
|
Frequently Asked Questions
|
||||||
|
</h2>
|
||||||
|
<p className="text-slate-600 text-center mb-10">
|
||||||
|
Common questions about Google Review QR codes.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="space-y-4">
|
||||||
|
{[
|
||||||
|
{
|
||||||
|
question: 'How do I find my Google Review link?',
|
||||||
|
answer: 'Open Google Maps → search your business → click Share → Copy link. Or go to Google Business Profile → "Get more reviews" for a direct shortlink.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: 'Does the Google Review QR code expire?',
|
||||||
|
answer: 'No. This is a static QR code that encodes your Google review URL directly. It works indefinitely as long as your Google Business Profile is active.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: 'Can I track how many people scanned it?',
|
||||||
|
answer: 'Not with a static QR code. For scan analytics (device, location, time), create a dynamic QR code with tracking through QR Master.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: 'What happens when a customer scans the QR code?',
|
||||||
|
answer: 'They are taken directly to your Google review form. If they are logged into a Google account, they can leave a star rating and review immediately.',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: 'Where should I put the Google Review QR code?',
|
||||||
|
answer: 'Best placements: receipts, table cards, checkout counters, packaging inserts, and your shop window. Ask for reviews right after the positive experience.',
|
||||||
|
},
|
||||||
|
].map((item) => (
|
||||||
|
<details key={item.question} className="group bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
||||||
|
<summary className="flex items-center justify-between p-5 cursor-pointer list-none text-slate-900 font-semibold hover:bg-slate-50 transition-colors">
|
||||||
|
{item.question}
|
||||||
|
<span className="transition group-open:rotate-180 text-slate-400">
|
||||||
|
<svg fill="none" height="20" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" viewBox="0 0 24 24" width="20">
|
||||||
|
<path d="M6 9l6 6 6-6" />
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</summary>
|
||||||
|
<div className="text-slate-600 px-5 pb-5 pt-0 leading-relaxed text-sm">
|
||||||
|
{item.answer}
|
||||||
|
</div>
|
||||||
|
</details>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -5,6 +5,7 @@ import { User, Shield, Zap, Smartphone, Contact, Share2, Check, UserPlus } from
|
|||||||
import { QRCodeSVG } from 'qrcode.react';
|
import { QRCodeSVG } from 'qrcode.react';
|
||||||
import { ToolBreadcrumb } from '@/components/seo/BreadcrumbSchema';
|
import { ToolBreadcrumb } from '@/components/seo/BreadcrumbSchema';
|
||||||
import { RelatedTools } from '@/components/marketing/RelatedTools';
|
import { RelatedTools } from '@/components/marketing/RelatedTools';
|
||||||
|
import { GrowthLinksSection } from '@/components/marketing/GrowthLinksSection';
|
||||||
import { generateSoftwareAppSchema, generateFaqSchema } from '@/lib/schema-utils';
|
import { generateSoftwareAppSchema, generateFaqSchema } from '@/lib/schema-utils';
|
||||||
|
|
||||||
// SEO Optimized Metadata
|
// SEO Optimized Metadata
|
||||||
@@ -238,6 +239,29 @@ export default function VCardQRCodePage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* GROWTH LINKS */}
|
||||||
|
<GrowthLinksSection
|
||||||
|
eyebrow="Level up your QR strategy"
|
||||||
|
title="More ways to use QR codes for your brand"
|
||||||
|
description="A vCard QR code is a great start. Add custom design, tracking, and dynamic destinations to get the most out of every print."
|
||||||
|
links={[
|
||||||
|
{
|
||||||
|
href: '/custom-qr-code-generator',
|
||||||
|
title: 'Custom QR Code Generator',
|
||||||
|
description: 'Add your logo, brand colors, and a custom frame to your QR codes.',
|
||||||
|
ctaLabel: 'Custom QR with logo',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
href: '/dynamic-qr-code-generator',
|
||||||
|
title: 'Dynamic QR Code Generator',
|
||||||
|
description: 'Update your contact destination after printing. No new QR code needed.',
|
||||||
|
ctaLabel: 'Dynamic QR with tracking',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
pageType="commercial"
|
||||||
|
cluster="vcard-qr"
|
||||||
|
/>
|
||||||
|
|
||||||
{/* RELATED TOOLS */}
|
{/* RELATED TOOLS */}
|
||||||
<RelatedTools />
|
<RelatedTools />
|
||||||
|
|
||||||
|
|||||||
@@ -23,7 +23,8 @@ import {
|
|||||||
CreditCard,
|
CreditCard,
|
||||||
Video,
|
Video,
|
||||||
Users,
|
Users,
|
||||||
Barcode
|
Barcode,
|
||||||
|
Star
|
||||||
} from 'lucide-react';
|
} from 'lucide-react';
|
||||||
|
|
||||||
const TOOLS = [
|
const TOOLS = [
|
||||||
@@ -186,6 +187,14 @@ const TOOLS = [
|
|||||||
href: '/tools/barcode-generator',
|
href: '/tools/barcode-generator',
|
||||||
color: 'text-slate-900',
|
color: 'text-slate-900',
|
||||||
bg: 'bg-slate-100'
|
bg: 'bg-slate-100'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Star,
|
||||||
|
name: 'Google Review',
|
||||||
|
description: 'Get more Google reviews',
|
||||||
|
href: '/tools/google-review-qr-code',
|
||||||
|
color: 'text-yellow-500',
|
||||||
|
bg: 'bg-yellow-50'
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|||||||
@@ -5,6 +5,201 @@ export const blogPosts: BlogPost[] = [
|
|||||||
// NEW POSTS
|
// NEW POSTS
|
||||||
// ==================================================================================
|
// ==================================================================================
|
||||||
|
|
||||||
|
{
|
||||||
|
slug: "static-vs-dynamic-qr-code",
|
||||||
|
title: "Static vs Dynamic QR Code: What's the Difference and Which Do You Need?",
|
||||||
|
description: "Static QR codes are permanent. Dynamic QR codes let you change the destination after printing. This guide shows when to use each — with real reprint cost examples.",
|
||||||
|
excerpt: "Static QR codes are permanent. Dynamic QR codes let you change the destination after printing. This guide shows when to use each — with real reprint cost examples.",
|
||||||
|
category: "QR Code Basics",
|
||||||
|
pillar: "use-cases",
|
||||||
|
published: true,
|
||||||
|
publishDate: "2026-04-07",
|
||||||
|
date: "April 7, 2026",
|
||||||
|
datePublished: "2026-04-07T09:00:00Z",
|
||||||
|
dateModified: "2026-04-07T09:00:00Z",
|
||||||
|
updatedAt: "2026-04-07",
|
||||||
|
authorSlug: "timo",
|
||||||
|
authorName: "Timo Knuth",
|
||||||
|
authorTitle: "QR Code & Marketing Expert",
|
||||||
|
readTime: "9 Min",
|
||||||
|
image: "/blog/static-vs-dynamic-qr-code.png",
|
||||||
|
heroImage: "/blog/static-vs-dynamic-qr-code.png",
|
||||||
|
imageAlt: "Side-by-side comparison of a static QR code and a dynamic QR code with editable destination",
|
||||||
|
keywords: ["static qr codes", "dynamic qr code", "static vs dynamic qr code", "edit a qr code", "redirect a qr code", "can you change a qr code link", "can you change the url of a qr code", "dynamic qr code meaning"],
|
||||||
|
quickAnswer: `<p>A <strong>static QR code</strong> encodes data permanently — you cannot change it after printing. A <strong>dynamic QR code</strong> uses a short redirect URL so you can update the destination at any time without reprinting. Dynamic codes cost more but are essential for print campaigns where links change.</p>`,
|
||||||
|
keySteps: [
|
||||||
|
"Decide if your destination URL will ever change — if yes, use dynamic.",
|
||||||
|
"For business cards, menus, or seasonal campaigns: always use dynamic.",
|
||||||
|
"For one-time personal use (WiFi, event check-in): static is fine.",
|
||||||
|
"Calculate your reprint costs before committing to static at scale.",
|
||||||
|
"With dynamic QR codes, update the URL in your dashboard — the printed code keeps working.",
|
||||||
|
],
|
||||||
|
faq: [
|
||||||
|
{
|
||||||
|
question: "Can you edit a QR code after printing?",
|
||||||
|
answer: "Not directly. A static QR code cannot be edited — the data is fixed. A dynamic QR code can be edited: you change the destination URL in your dashboard, and the printed code automatically redirects to the new URL.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: "Can you change a QR code link?",
|
||||||
|
answer: "Yes, but only if it is a dynamic QR code. Dynamic codes point to a short redirect URL that you control. Change the destination in your dashboard and the printed code updates immediately.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: "Can you redirect a QR code?",
|
||||||
|
answer: "Yes — dynamic QR codes work through a redirect layer. You set the final destination in a dashboard and can change it at any time. Static QR codes cannot be redirected.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: "Can you change the URL of a QR code?",
|
||||||
|
answer: "Only for dynamic QR codes. The printed code links to a short managed URL. You update the destination in your account and the redirect changes — no new print needed.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: "What does dynamic QR code mean?",
|
||||||
|
answer: "A dynamic QR code encodes a short redirect URL instead of your final destination. This means you can update where the code sends people at any time — without reprinting the physical code.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: "Are static QR codes free?",
|
||||||
|
answer: "Yes. Static QR codes can be generated for free and require no account or ongoing service. However, they cannot be edited or tracked after creation.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: "What happens when I reprint a static QR code?",
|
||||||
|
answer: "Reprinting means discarding all previously printed materials and paying full production costs again. For campaigns that change URLs seasonally or annually, this adds up quickly. A single reprint batch for 500 flyers at €0.15 per piece costs €75 — before design and distribution.",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
question: "Do dynamic QR codes expire?",
|
||||||
|
answer: "Only if your subscription expires. As long as your account is active, dynamic QR codes redirect indefinitely. QR Master offers a free tier with basic dynamic codes so you can test before committing.",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
relatedSlugs: ["trackable-qr-codes", "microsoft-teams-qr-code"],
|
||||||
|
sources: [
|
||||||
|
{ name: "ISO/IEC 18004:2015 — QR Code bar code symbology specification", url: "https://www.iso.org/standard/62021.html", accessDate: "April 2026" },
|
||||||
|
{ name: "Denso Wave — QR Code inventor, official QR code information", url: "https://www.qrcode.com/en/about/", accessDate: "April 2026" },
|
||||||
|
{ name: "QR Master — Reprint Cost Calculator", url: "https://www.qrmaster.net/reprint-calculator", accessDate: "April 2026" },
|
||||||
|
{ name: "QR Master — Dynamic QR Code Generator", url: "https://www.qrmaster.net/dynamic-qr-code-generator", accessDate: "April 2026" },
|
||||||
|
],
|
||||||
|
content: `<div class="blog-content">
|
||||||
|
<div class="post-metadata bg-blue-50 p-4 rounded-lg mb-8 border-l-4 border-blue-500">
|
||||||
|
<p class="text-sm text-gray-700">
|
||||||
|
<strong>Author:</strong> Timo Knuth, QR Code & Marketing Expert<br/>
|
||||||
|
Published: April 7, 2026
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="bg-green-50 border border-green-200 rounded-xl p-6 mb-8">
|
||||||
|
<h2 class="text-lg font-bold text-green-900 mt-0 mb-3">Quick answer</h2>
|
||||||
|
<p class="text-green-800 mb-0">A <strong>static QR code</strong> is permanent — once printed, the data is fixed forever. A <strong>dynamic QR code</strong> routes through a redirect you control, so you can update the destination at any time without reprinting. Dynamic codes are essential for any campaign where URLs change.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h2>What is a Static QR Code?</h2>
|
||||||
|
<p>A static QR code encodes your data — a URL, contact, WiFi password, or plain text — directly into the QR pattern. Once generated and printed, that data is permanent. You cannot change it.</p>
|
||||||
|
<p>Static codes work fine for:</p>
|
||||||
|
<ul>
|
||||||
|
<li>Personal WiFi passwords that never change</li>
|
||||||
|
<li>One-time event check-in links</li>
|
||||||
|
<li>Plain text like a short message or fixed phone number</li>
|
||||||
|
<li>Anything where you are 100% certain the content will not change</li>
|
||||||
|
</ul>
|
||||||
|
<p>The problem starts when you use static QR codes for business campaigns where URLs change — menus get updated, promo pages expire, link structures migrate. Every change forces a full reprint.</p>
|
||||||
|
|
||||||
|
<h2>What is a Dynamic QR Code?</h2>
|
||||||
|
<p>A dynamic QR code encodes a short redirect URL (e.g., <code>qrmaster.net/r/abc123</code>) instead of your final destination. You control where that redirect points in a dashboard. Change the destination, and the printed code automatically sends scanners to the new URL — no reprint needed.</p>
|
||||||
|
<p>Dynamic codes also enable:</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Scan tracking</strong> — see how many people scanned, on which device, from which country</li>
|
||||||
|
<li><strong>A/B destination testing</strong> — route scans to different landing pages to compare performance</li>
|
||||||
|
<li><strong>Campaign attribution</strong> — tie print placements to real conversion data</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h2>Static vs Dynamic QR Code: Feature Comparison</h2>
|
||||||
|
<div class="overflow-x-auto my-8">
|
||||||
|
<table class="w-full border-collapse text-sm">
|
||||||
|
<thead>
|
||||||
|
<tr class="bg-slate-100">
|
||||||
|
<th class="border border-slate-200 px-4 py-3 text-left font-semibold">Feature</th>
|
||||||
|
<th class="border border-slate-200 px-4 py-3 text-center font-semibold">Static QR Code</th>
|
||||||
|
<th class="border border-slate-200 px-4 py-3 text-center font-semibold">Dynamic QR Code</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td class="border border-slate-200 px-4 py-3">Edit destination after print</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center text-red-600 font-semibold">No</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center text-green-600 font-semibold">Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr class="bg-slate-50">
|
||||||
|
<td class="border border-slate-200 px-4 py-3">Scan analytics</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center text-red-600 font-semibold">No</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center text-green-600 font-semibold">Yes</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="border border-slate-200 px-4 py-3">Reprint needed when URL changes</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center text-red-600 font-semibold">Yes</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center text-green-600 font-semibold">No</td>
|
||||||
|
</tr>
|
||||||
|
<tr class="bg-slate-50">
|
||||||
|
<td class="border border-slate-200 px-4 py-3">Cost after printing</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center">€0 (but reprints add up)</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center">Subscription fee</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="border border-slate-200 px-4 py-3">Works offline (WiFi, vCard)</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center text-green-600 font-semibold">Yes</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center">URL-based only</td>
|
||||||
|
</tr>
|
||||||
|
<tr class="bg-slate-50">
|
||||||
|
<td class="border border-slate-200 px-4 py-3">Best for</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center">One-time / permanent use</td>
|
||||||
|
<td class="border border-slate-200 px-4 py-3 text-center">Campaigns, print, marketing</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h2>The Real Cost of Static QR Code Reprints</h2>
|
||||||
|
<p>Here is where the math matters. Many businesses default to static QR codes because they are free to generate. But when the linked URL changes — which happens more often than expected — the cost of reprinting is significant.</p>
|
||||||
|
|
||||||
|
<h3>Example 1: Restaurant Menu</h3>
|
||||||
|
<p>A restaurant prints 200 table tent cards with a static QR code linking to their PDF menu. The menu changes quarterly (seasonal updates). Each reprint batch costs €60 in printing.</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Year 1 cost with static:</strong> €60 × 4 reprints = <strong>€240 in printing alone</strong></li>
|
||||||
|
<li><strong>Year 1 cost with dynamic:</strong> €0 in reprints + €9/month subscription = <strong>€108</strong></li>
|
||||||
|
<li><strong>Savings with dynamic in Year 1: €132</strong></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h3>Example 2: Retail Shelf Talkers</h3>
|
||||||
|
<p>A retailer places 500 shelf talkers with a static QR linking to a seasonal promotion page. The promotion runs 6 times per year.</p>
|
||||||
|
<ul>
|
||||||
|
<li><strong>Static reprint cost:</strong> 500 talkers × €0.18 × 6 = <strong>€540/year</strong></li>
|
||||||
|
<li><strong>Dynamic QR subscription:</strong> ~€108/year</li>
|
||||||
|
<li><strong>Savings: €432/year</strong></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p>Use the <a href="/reprint-calculator" class="text-blue-600 underline font-semibold">QR Code Reprint Cost Calculator</a> to enter your own numbers and see your exact savings.</p>
|
||||||
|
|
||||||
|
<h2>When to Use Static QR Codes</h2>
|
||||||
|
<p>Static is the right choice when:</p>
|
||||||
|
<ul>
|
||||||
|
<li>The destination will never change (e.g., a permanent product manual URL)</li>
|
||||||
|
<li>You are encoding non-URL data: WiFi credentials, plain text, phone numbers, vCards</li>
|
||||||
|
<li>It is a one-time use case (event check-in, single-use coupon)</li>
|
||||||
|
<li>You have no budget for a subscription and the URL is guaranteed stable</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h2>When to Use Dynamic QR Codes</h2>
|
||||||
|
<p>Dynamic is the right choice when:</p>
|
||||||
|
<ul>
|
||||||
|
<li>The destination URL might change (promotions, menus, seasonal campaigns)</li>
|
||||||
|
<li>You need to know how many people scanned and from where</li>
|
||||||
|
<li>You are printing at scale (reprinting 500+ items every time a link changes is expensive)</li>
|
||||||
|
<li>You want to test different destinations (A/B routing)</li>
|
||||||
|
<li>You need to fix a typo in the URL after printing</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<p>Get started with a <a href="/dynamic-qr-code-generator" class="text-blue-600 underline font-semibold">dynamic QR code generator</a> to create codes you can update after printing. Pair it with <a href="/qr-code-tracking" class="text-blue-600 underline font-semibold">QR code tracking</a> to see exactly who scans and from where.</p>
|
||||||
|
|
||||||
|
<h2>Summary</h2>
|
||||||
|
<p>The choice between static and dynamic QR codes comes down to one question: <strong>will the destination ever change?</strong> If yes, use dynamic — the subscription cost is almost always lower than the cost of reprinting. If no, static is free and perfectly adequate.</p>
|
||||||
|
</div>`,
|
||||||
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
slug: "microsoft-teams-qr-code",
|
slug: "microsoft-teams-qr-code",
|
||||||
title: "How to Create a Microsoft Teams QR Code for Instant Meeting Joins",
|
title: "How to Create a Microsoft Teams QR Code for Instant Meeting Joins",
|
||||||
|
|||||||
@@ -53,6 +53,7 @@ export function middleware(req: NextRequest) {
|
|||||||
'/testimonials',
|
'/testimonials',
|
||||||
'/qr-code-for-marketing-campaigns',
|
'/qr-code-for-marketing-campaigns',
|
||||||
'/qr-code-for',
|
'/qr-code-for',
|
||||||
|
'/qr-code-print-size-guide',
|
||||||
'/use-cases/flyer-qr-codes',
|
'/use-cases/flyer-qr-codes',
|
||||||
'/use-cases/packaging-qr-codes',
|
'/use-cases/packaging-qr-codes',
|
||||||
'/use-cases/real-estate-sign-qr-codes',
|
'/use-cases/real-estate-sign-qr-codes',
|
||||||
|
|||||||
Reference in New Issue
Block a user