feat: implement marketing pages, core QR tools, and SEO infrastructure for QR Master
This commit is contained in:
15
CLAUDE.md
15
CLAUDE.md
@@ -227,6 +227,21 @@ openssl rand -base64 32 # NEXTAUTH_SECRET and IP_SALT
|
|||||||
- Image optimization enabled in `next.config.mjs`
|
- Image optimization enabled in `next.config.mjs`
|
||||||
- Prisma connection pooling recommended for production
|
- Prisma connection pooling recommended for production
|
||||||
|
|
||||||
|
## Database Change Policy
|
||||||
|
|
||||||
|
**IMPORTANT: No Prisma migrations.** All database schema changes (new columns, new enum values, new tables) must be applied via raw SQL commands directly against the running PostgreSQL instance.
|
||||||
|
|
||||||
|
Workflow for schema changes:
|
||||||
|
1. Write the raw SQL (e.g. `ALTER TABLE`, `ALTER TYPE ... ADD VALUE`)
|
||||||
|
2. Run via Docker: `npm run docker:db` then execute SQL, or use `docker-compose exec db psql -U postgres -d qrmaster -c "..."`
|
||||||
|
3. Update `prisma/schema.prisma` to match (so Prisma client types stay in sync)
|
||||||
|
4. Run `npx prisma generate` to regenerate the client (no `migrate`)
|
||||||
|
|
||||||
|
Example — adding an enum value:
|
||||||
|
```sql
|
||||||
|
ALTER TYPE "ContentType" ADD VALUE 'BARCODE';
|
||||||
|
```
|
||||||
|
|
||||||
## Common Pitfalls
|
## Common Pitfalls
|
||||||
|
|
||||||
1. **Database Connection**: If "Can't reach database server", ensure Docker is running (`npm run docker:dev`)
|
1. **Database Connection**: If "Can't reach database server", ensure Docker is running (`npm run docker:dev`)
|
||||||
|
|||||||
179
PLAN_bulk_dynamic_and_barcode.md
Normal file
179
PLAN_bulk_dynamic_and_barcode.md
Normal file
@@ -0,0 +1,179 @@
|
|||||||
|
# Feature Plan: Bulk Dynamic QR + Dynamic Barcode Generator
|
||||||
|
|
||||||
|
## Feature 1: Bulk Generator → Dynamic QR freischalten
|
||||||
|
|
||||||
|
### Ziel
|
||||||
|
Nutzer können beim Bulk-Import wählen ob sie statische oder dynamische QR-Codes erstellen. Dynamisch = DB-Einträge mit Slugs + Tracking. Nur für PRO/BUSINESS.
|
||||||
|
|
||||||
|
### Aktueller Stand (Ist)
|
||||||
|
- `bulk-creation/page.tsx` generiert QR-Codes rein client-seitig (kein DB-Eintrag)
|
||||||
|
- `generateStaticQRCodes()` rendert SVGs lokal via `qrcode`-Library
|
||||||
|
- `saveQRCodesToDatabase()` sendet an `POST /api/qrs` mit `isStatic: true` — also immer statisch
|
||||||
|
- Kein Toggle Static/Dynamic vorhanden
|
||||||
|
- Kein Plan-Check für Dynamic im Bulk-Flow
|
||||||
|
|
||||||
|
### Änderungen
|
||||||
|
|
||||||
|
#### A) Frontend: `bulk-creation/page.tsx`
|
||||||
|
|
||||||
|
1. **Toggle "Static / Dynamic" hinzufügen** (nach Plan-Check)
|
||||||
|
- Nur sichtbar/aktivierbar wenn `userPlan === 'PRO' || 'BUSINESS'`
|
||||||
|
- FREE-Nutzer sehen den Toggle gesperrt mit Upgrade-Hinweis
|
||||||
|
- State: `const [isDynamic, setIsDynamic] = useState(false)`
|
||||||
|
|
||||||
|
2. **Interface erweitern**
|
||||||
|
```ts
|
||||||
|
interface GeneratedQR {
|
||||||
|
title: string;
|
||||||
|
content: string;
|
||||||
|
svg: string;
|
||||||
|
slug?: string; // nur bei dynamic, nach API-Antwort gesetzt
|
||||||
|
redirectUrl?: string; // z.B. https://qrmaster.net/r/abc123
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
3. **Generierungslogik aufteilen**
|
||||||
|
- Static (wie bisher): client-seitig SVG generieren, kein DB-Eintrag nötig
|
||||||
|
- Dynamic: direkt `POST /api/qrs` pro Eintrag mit `isDynamic: true` → API gibt Slug zurück → QR encodiert `/r/[slug]` statt Original-URL
|
||||||
|
|
||||||
|
4. **Preview-Spalte erweitern**
|
||||||
|
- Bei dynamic: Slug-Link anzeigen + "Ziel änderbar" Badge
|
||||||
|
- Download-ZIP enthält QR-SVGs die `/r/[slug]` encodieren
|
||||||
|
|
||||||
|
5. **Limit-Anzeige**
|
||||||
|
- PRO: max 50 dynamic / Bulk-Run (entspricht QR-Limit)
|
||||||
|
- BUSINESS: max 500
|
||||||
|
|
||||||
|
#### B) Backend: `POST /api/qrs`
|
||||||
|
|
||||||
|
Keine strukturelle Änderung nötig — der bestehende Endpunkt unterstützt bereits `isDynamic: false/true` und gibt `slug` zurück. Nur sicherstellen:
|
||||||
|
|
||||||
|
- Plan-Limit-Check zählt korrekt bei Bulk-Erstellung (momentan prüft `POST /api/qrs` nur ob Gesamtanzahl < Limit — das bleibt so, aber Bulk erstellt X Requests nacheinander → ggf. Rate-Limit beachten)
|
||||||
|
- Evtl. neuen Endpunkt `POST /api/qrs/bulk` der ein Array entgegennimmt und in einer DB-Transaktion schreibt (besser als 500 Einzelrequests)
|
||||||
|
|
||||||
|
#### C) Optionaler neuer Endpunkt: `POST /api/qrs/bulk` (empfohlen)
|
||||||
|
|
||||||
|
```ts
|
||||||
|
// Body: { qrCodes: Array<{ title, content, contentType, isDynamic }>, plan }
|
||||||
|
// Response: { created: Array<{ id, slug, redirectUrl }>, failed: number }
|
||||||
|
// Vorteile: eine DB-Transaktion, ein CSRF-Check, schneller
|
||||||
|
```
|
||||||
|
|
||||||
|
Plan-Check: `if (isDynamic && plan === 'FREE') return 403`
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Reihenfolge der Umsetzung
|
||||||
|
|
||||||
|
1. Toggle + Plan-Check im Frontend
|
||||||
|
2. Dynamic-Generierungslogik (nutzt bestehenden `POST /api/qrs`)
|
||||||
|
3. (Optional) `POST /api/qrs/bulk` für Performance
|
||||||
|
4. ZIP-Download mit Redirect-URLs als Metadaten-CSV
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Feature 2: Dynamischer Barcode Generator
|
||||||
|
|
||||||
|
### Aufteilung: Landingpage (Marketing) + Dashboard (Funktion)
|
||||||
|
|
||||||
|
**Wichtig:** "Dynamic" existiert nur im Dashboard `/create`. Die Landingpage erklärt das Konzept und treibt Nutzer zum Signup/Login — sie hat keinen eigenen Dynamic-Modus.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 2a) Landingpage: `/tools/dynamic-barcode-generator`
|
||||||
|
|
||||||
|
**Ziel:** SEO-Traffic auf Keyword "barcode generator" (100k–1M, 0% Competition) konvertieren zu Signups.
|
||||||
|
|
||||||
|
**Was die Landingpage NICHT hat:**
|
||||||
|
- Keinen Dynamic-Toggle
|
||||||
|
- Keine echte Dynamic-Funktionalität
|
||||||
|
|
||||||
|
**Was die Landingpage HAT:**
|
||||||
|
- Bestehenden `BarcodeGeneratorClient` eingebettet (statischer Generator, unverändert)
|
||||||
|
- Erklärung was ein dynamischer Barcode ist + Vorteile
|
||||||
|
- Klarer CTA: "Create Dynamic Barcode → Sign up / Dashboard"
|
||||||
|
|
||||||
|
**Aufbau** (`src/app/(main)/(marketing)/tools/dynamic-barcode-generator/page.tsx`):
|
||||||
|
|
||||||
|
```
|
||||||
|
Hero-Section
|
||||||
|
H1: "Dynamic Barcode Generator — Update Any Barcode Without Reprinting"
|
||||||
|
Subtext: Erklärt Tracking + Redirect-Konzept
|
||||||
|
CTA-Button: "Create Dynamic Barcode" → /login oder /signup
|
||||||
|
|
||||||
|
Tool-Section
|
||||||
|
BarcodeGeneratorClient (statisch, wie bisher, keine Änderungen)
|
||||||
|
Banner darunter: "Want dynamic barcodes? Sign up free →"
|
||||||
|
|
||||||
|
How It Works (3 Schritte)
|
||||||
|
1. Sign up & create barcode in dashboard
|
||||||
|
2. Print it once
|
||||||
|
3. Update the destination anytime — no reprint needed
|
||||||
|
|
||||||
|
Use Cases
|
||||||
|
Retail-Verpackungen, Logistik-Labels, Produktkataloge, Event-Badges
|
||||||
|
|
||||||
|
FAQ-Section (schema.org FAQ markup)
|
||||||
|
- "Was ist ein dynamischer Barcode?"
|
||||||
|
- "Wie unterscheidet sich dynamisch von statisch?"
|
||||||
|
- "Welche Formate werden unterstützt?"
|
||||||
|
|
||||||
|
RelatedTools-Komponente (bereits vorhanden)
|
||||||
|
```
|
||||||
|
|
||||||
|
**Metadata:**
|
||||||
|
```ts
|
||||||
|
title: 'Dynamic Barcode Generator — Trackable & Editable Barcodes'
|
||||||
|
description: 'Create dynamic barcodes that you can update without reprinting. Track scans, change destinations, and manage all barcodes from one dashboard.'
|
||||||
|
canonical: 'https://www.qrmaster.net/tools/dynamic-barcode-generator'
|
||||||
|
keywords: ['dynamic barcode generator', 'barcode generator', 'trackable barcode', 'editable barcode']
|
||||||
|
```
|
||||||
|
|
||||||
|
**Sitemap:** `/tools/dynamic-barcode-generator` hinzufügen.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### 2b) Dashboard `/create` — BARCODE als ContentType
|
||||||
|
|
||||||
|
**Ziel:** Eingeloggte Nutzer können Barcodes (statisch oder dynamisch) im Dashboard erstellen, speichern und tracken.
|
||||||
|
|
||||||
|
**DB-Änderung (kein migrate!):**
|
||||||
|
```sql
|
||||||
|
-- Direkt gegen PostgreSQL ausführen (npm run docker:db)
|
||||||
|
ALTER TYPE "ContentType" ADD VALUE 'BARCODE';
|
||||||
|
```
|
||||||
|
Danach: `npx prisma generate`
|
||||||
|
|
||||||
|
**Änderungen `create/page.tsx`:**
|
||||||
|
- BARCODE zu `contentTypes` Array hinzufügen
|
||||||
|
- `renderContentFields()` Case: Barcode-Wert + Format-Picker (CODE128, EAN13, UPC, etc.)
|
||||||
|
- Preview: `react-barcode` statt `QRCodeSVG` wenn ContentType === BARCODE
|
||||||
|
- QR-spezifische Optionen ausblenden bei BARCODE (Frames, Logo, Corner Style)
|
||||||
|
- Dynamic Barcode = encodiert `/r/[slug]` → nutzt bestehendes Redirect- + Tracking-System
|
||||||
|
- Static Barcode = encodiert Rohwert direkt
|
||||||
|
|
||||||
|
**Kein neues Backend nötig** — `POST /api/qrs` + `/r/[slug]`-Redirect funktionieren bereits.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
### Reihenfolge der Umsetzung
|
||||||
|
|
||||||
|
**Phase 1 — Landingpage (kein DB-Change):**
|
||||||
|
1. `page.tsx` unter `/tools/dynamic-barcode-generator` erstellen
|
||||||
|
2. Sitemap-Eintrag
|
||||||
|
|
||||||
|
**Phase 2 — Dashboard BARCODE:**
|
||||||
|
1. SQL ausführen: `ALTER TYPE "ContentType" ADD VALUE 'BARCODE'`
|
||||||
|
2. `npx prisma generate`
|
||||||
|
3. `create/page.tsx` erweitern
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Abhängigkeiten zwischen den Features
|
||||||
|
|
||||||
|
| Feature | Hängt ab von |
|
||||||
|
|---------|-------------|
|
||||||
|
| Bulk Dynamic | Bestehendem `POST /api/qrs` (bereits fertig) |
|
||||||
|
| Bulk Dynamic (optional) | Neuem `POST /api/qrs/bulk` Endpunkt |
|
||||||
|
| Landingpage Dynamic Barcode | Bestehendem BarcodeGeneratorClient (keine Änderungen) |
|
||||||
|
| Dashboard BARCODE | SQL-Enum-Erweiterung + `prisma generate` |
|
||||||
@@ -176,6 +176,13 @@ const howToSchema = {
|
|||||||
'@type': 'HowTo',
|
'@type': 'HowTo',
|
||||||
'@id': 'https://www.qrmaster.net/bulk-qr-code-generator#howto',
|
'@id': 'https://www.qrmaster.net/bulk-qr-code-generator#howto',
|
||||||
name: 'How to generate bulk QR codes from a spreadsheet',
|
name: 'How to generate bulk QR codes from a spreadsheet',
|
||||||
|
datePublished: '2024-01-01',
|
||||||
|
dateModified: '2025-06-01',
|
||||||
|
author: {
|
||||||
|
'@type': 'Person',
|
||||||
|
name: 'Timo Knuth',
|
||||||
|
url: 'https://www.qrmaster.net/authors/timo',
|
||||||
|
},
|
||||||
description:
|
description:
|
||||||
'Upload a spreadsheet, map the title and content columns, preview the batch, then generate and download the QR codes.',
|
'Upload a spreadsheet, map the title and content columns, preview the batch, then generate and download the QR codes.',
|
||||||
totalTime: 'PT10M',
|
totalTime: 'PT10M',
|
||||||
@@ -380,6 +387,12 @@ export default function BulkQRCodeGeneratorPage() {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className="container mx-auto max-w-5xl px-4 pb-2 sm:px-6 lg:px-8">
|
||||||
|
<p className="text-xs text-gray-400 italic px-1">
|
||||||
|
By Timo Knuth, QR Master · Last updated: June 2025
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className="container mx-auto max-w-5xl px-4 pb-8 sm:px-6 lg:px-8">
|
<div className="container mx-auto max-w-5xl px-4 pb-8 sm:px-6 lg:px-8">
|
||||||
<FAQSection items={faqItems} title="Bulk QR questions" />
|
<FAQSection items={faqItems} title="Bulk QR questions" />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -248,6 +248,13 @@ export default function CustomQRCodeGeneratorPage() {
|
|||||||
'@type': 'HowTo',
|
'@type': 'HowTo',
|
||||||
'@id': 'https://www.qrmaster.net/custom-qr-code-generator#howto',
|
'@id': 'https://www.qrmaster.net/custom-qr-code-generator#howto',
|
||||||
name: 'How to Create a Custom QR Code with Logo',
|
name: 'How to Create a Custom QR Code with Logo',
|
||||||
|
datePublished: '2024-01-01',
|
||||||
|
dateModified: '2025-06-01',
|
||||||
|
author: {
|
||||||
|
'@type': 'Person',
|
||||||
|
name: 'Timo Knuth',
|
||||||
|
url: 'https://www.qrmaster.net/authors/timo',
|
||||||
|
},
|
||||||
step: [
|
step: [
|
||||||
{
|
{
|
||||||
'@type': 'HowToStep',
|
'@type': 'HowToStep',
|
||||||
@@ -326,6 +333,12 @@ export default function CustomQRCodeGeneratorPage() {
|
|||||||
description: 'Turn your brand identity into a scannable digital business card.',
|
description: 'Turn your brand identity into a scannable digital business card.',
|
||||||
ctaLabel: 'Create vCard QR',
|
ctaLabel: 'Create vCard QR',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
href: '/tools/barcode-generator',
|
||||||
|
title: 'Free Barcode Generator',
|
||||||
|
description: 'Need a 1D barcode for retail or inventory? Create EAN-13, UPC-A, and Code 128 barcodes instantly — no signup required.',
|
||||||
|
ctaLabel: 'Create a barcode',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
href: '/use-cases',
|
href: '/use-cases',
|
||||||
title: 'Explore the use-case hub',
|
title: 'Explore the use-case hub',
|
||||||
@@ -667,6 +680,48 @@ export default function CustomQRCodeGeneratorPage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* WHY CUSTOM DESIGN MATTERS — STATISTICS */}
|
||||||
|
<section className="py-16 bg-white">
|
||||||
|
<div className="container mx-auto max-w-4xl px-4 sm:px-6 lg:px-8">
|
||||||
|
<div className="flex items-center gap-2 mb-3">
|
||||||
|
<svg className="w-5 h-5 text-purple-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6" /></svg>
|
||||||
|
<span className="text-sm font-semibold text-purple-600 uppercase tracking-wider">Research-backed impact</span>
|
||||||
|
</div>
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900 mb-4">
|
||||||
|
Why Brand Design in QR Codes Increases Engagement
|
||||||
|
</h2>
|
||||||
|
<p className="text-gray-600 mb-10 max-w-2xl">
|
||||||
|
A <strong>custom QR code</strong> with your brand colors and logo doesn't just look better — it signals trust and gets scanned more often.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-2 gap-6 mb-8">
|
||||||
|
<div className="bg-purple-50 border border-purple-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-purple-600 mb-2">+80%</div>
|
||||||
|
<p className="text-gray-700 text-sm leading-relaxed mb-3">
|
||||||
|
Color increases brand recognition by up to 80%. A branded QR code using your brand colors is recognized and associated with your business faster than a generic black-and-white grid — increasing scan intent.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-gray-500">
|
||||||
|
Source: <a href="https://www.loyola.edu/academia/marketing/insights/brand-recognition" target="_blank" rel="noopener noreferrer" className="underline hover:text-gray-700">University of Loyola Maryland</a> — Color & Brand Recognition Study
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-blue-50 border border-blue-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-blue-600 mb-2">+40%</div>
|
||||||
|
<p className="text-gray-700 text-sm leading-relaxed mb-3">
|
||||||
|
Adding a recognizable brand element — like a logo — to a functional graphic increases user engagement and trust. Familiar visual cues reduce hesitation and increase the likelihood of scanning.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-gray-500">
|
||||||
|
Source: <a href="https://www.nngroup.com/articles/visual-design-trust/" target="_blank" rel="noopener noreferrer" className="underline hover:text-gray-700">Nielsen Norman Group</a> — Visual Design and Trust Research
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p className="text-xs text-gray-400 italic">
|
||||||
|
By Timo Knuth, QR Master · Last updated: June 2025 · Based on independent academic and industry research
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<GrowthLinksSection
|
<GrowthLinksSection
|
||||||
eyebrow="Branded workflows"
|
eyebrow="Branded workflows"
|
||||||
title="Where custom QR design supports the workflow"
|
title="Where custom QR design supports the workflow"
|
||||||
|
|||||||
@@ -202,6 +202,13 @@ const howToSchema = {
|
|||||||
'@type': 'HowTo',
|
'@type': 'HowTo',
|
||||||
'@id': 'https://www.qrmaster.net/dynamic-qr-code-generator#howto',
|
'@id': 'https://www.qrmaster.net/dynamic-qr-code-generator#howto',
|
||||||
name: 'How to create a dynamic QR code',
|
name: 'How to create a dynamic QR code',
|
||||||
|
datePublished: '2024-01-01',
|
||||||
|
dateModified: '2025-06-01',
|
||||||
|
author: {
|
||||||
|
'@type': 'Person',
|
||||||
|
name: 'Timo Knuth',
|
||||||
|
url: 'https://www.qrmaster.net/authors/timo',
|
||||||
|
},
|
||||||
description: 'Create a dynamic QR code and update the destination later without replacing the printed QR image.',
|
description: 'Create a dynamic QR code and update the destination later without replacing the printed QR image.',
|
||||||
totalTime: 'PT3M',
|
totalTime: 'PT3M',
|
||||||
step: [
|
step: [
|
||||||
@@ -585,6 +592,48 @@ export default function DynamicQRCodeGeneratorPage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* WHY DYNAMIC QR — STATISTICS */}
|
||||||
|
<section className="bg-white py-16">
|
||||||
|
<div className="container mx-auto max-w-4xl px-4 sm:px-6 lg:px-8">
|
||||||
|
<div className="flex items-center gap-2 mb-3">
|
||||||
|
<svg className="w-5 h-5 text-purple-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6" /></svg>
|
||||||
|
<span className="text-sm font-semibold text-purple-600 uppercase tracking-wider">Research-backed impact</span>
|
||||||
|
</div>
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900 mb-4">
|
||||||
|
Why Dynamic QR Codes Deliver Better Business Outcomes
|
||||||
|
</h2>
|
||||||
|
<p className="text-gray-600 mb-10 max-w-2xl">
|
||||||
|
The ability to update destinations after printing — and track every scan — transforms a static print asset into a measurable marketing channel.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-2 gap-6 mb-8">
|
||||||
|
<div className="bg-purple-50 border border-purple-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-purple-600 mb-2">89% vs 33%</div>
|
||||||
|
<p className="text-gray-700 text-sm leading-relaxed mb-3">
|
||||||
|
Companies with strong omnichannel customer engagement — enabled by closed-loop tracking from offline to online — retain <strong>89% of their customers</strong>, compared to only 33% for companies with weak omnichannel engagement.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-gray-500">
|
||||||
|
Source: <a href="https://www.aberdeengroup.com/" target="_blank" rel="noopener noreferrer" className="underline hover:text-gray-700">Aberdeen Group</a> — Omnichannel Customer Engagement Study
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-blue-50 border border-blue-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-blue-600 mb-2">46%</div>
|
||||||
|
<p className="text-gray-700 text-sm leading-relaxed mb-3">
|
||||||
|
of small businesses report printing and direct mail errors as a major source of wasted marketing budget. Dynamic QR codes eliminate this risk — update the destination, never reprint.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-gray-500">
|
||||||
|
Source: <a href="https://thedma.org/" target="_blank" rel="noopener noreferrer" className="underline hover:text-gray-700">Data & Marketing Association (DMA)</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p className="text-xs text-gray-400 italic">
|
||||||
|
By Timo Knuth, QR Master · Last updated: June 2025 · Based on independent academic and industry research
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<GrowthLinksSection
|
<GrowthLinksSection
|
||||||
eyebrow="Best next workflows"
|
eyebrow="Best next workflows"
|
||||||
title="See where dynamic QR becomes most useful"
|
title="See where dynamic QR becomes most useful"
|
||||||
|
|||||||
@@ -78,7 +78,8 @@ export default function HomePage() {
|
|||||||
<p>
|
<p>
|
||||||
Features include: Dynamic QR codes with real-time tracking, bulk QR code generation from Excel/CSV,
|
Features include: Dynamic QR codes with real-time tracking, bulk QR code generation from Excel/CSV,
|
||||||
custom branding with colors and logos, advanced scan analytics showing device types and locations,
|
custom branding with colors and logos, advanced scan analytics showing device types and locations,
|
||||||
vCard QR codes for digital business cards, and restaurant menu QR codes.
|
vCard QR codes for digital business cards, restaurant menu QR codes, and a free{' '}
|
||||||
|
<a href="/tools/barcode-generator">barcode generator</a> for EAN-13, UPC-A, and Code 128 barcodes.
|
||||||
</p>
|
</p>
|
||||||
<p>
|
<p>
|
||||||
Start free with 3 active dynamic QR codes and unlimited static codes. Upgrade to Pro for 50 codes
|
Start free with 3 active dynamic QR codes and unlimited static codes. Upgrade to Pro for 50 codes
|
||||||
|
|||||||
@@ -169,6 +169,13 @@ const howToSchema = {
|
|||||||
'@type': 'HowTo',
|
'@type': 'HowTo',
|
||||||
'@id': 'https://www.qrmaster.net/qr-code-tracking#howto',
|
'@id': 'https://www.qrmaster.net/qr-code-tracking#howto',
|
||||||
name: 'How to track QR code scans',
|
name: 'How to track QR code scans',
|
||||||
|
datePublished: '2024-01-01',
|
||||||
|
dateModified: '2025-06-01',
|
||||||
|
author: {
|
||||||
|
'@type': 'Person',
|
||||||
|
name: 'Timo Knuth',
|
||||||
|
url: 'https://www.qrmaster.net/authors/timo',
|
||||||
|
},
|
||||||
description: 'Create a dynamic QR code, deploy it, and review scan analytics from the QR Master dashboard.',
|
description: 'Create a dynamic QR code, deploy it, and review scan analytics from the QR Master dashboard.',
|
||||||
totalTime: 'PT5M',
|
totalTime: 'PT5M',
|
||||||
step: [
|
step: [
|
||||||
@@ -486,6 +493,48 @@ export default function QRCodeTrackingPage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* WHY QR TRACKING MATTERS — STATISTICS */}
|
||||||
|
<section className="bg-white py-16">
|
||||||
|
<div className="container mx-auto max-w-4xl px-4 sm:px-6 lg:px-8">
|
||||||
|
<div className="flex items-center gap-2 mb-3">
|
||||||
|
<svg className="w-5 h-5 text-emerald-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6" /></svg>
|
||||||
|
<span className="text-sm font-semibold text-emerald-600 uppercase tracking-wider">Research-backed impact</span>
|
||||||
|
</div>
|
||||||
|
<h2 className="text-3xl font-bold text-gray-900 mb-4">
|
||||||
|
Why Tracking Makes QR Codes Measurable Marketing Assets
|
||||||
|
</h2>
|
||||||
|
<p className="text-gray-600 mb-10 max-w-2xl">
|
||||||
|
Without scan analytics, a printed QR code is invisible — you can't tell if your campaign placement is working. Tracking turns every scan into actionable data.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-2 gap-6 mb-8">
|
||||||
|
<div className="bg-emerald-50 border border-emerald-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-emerald-600 mb-2">89% vs 33%</div>
|
||||||
|
<p className="text-gray-700 text-sm leading-relaxed mb-3">
|
||||||
|
Companies with strong omnichannel engagement — requiring closed-loop tracking from offline to online — retain <strong>89% of their customers</strong>, compared to 33% for businesses without integrated tracking.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-gray-500">
|
||||||
|
Source: <a href="https://www.aberdeengroup.com/" target="_blank" rel="noopener noreferrer" className="underline hover:text-gray-700">Aberdeen Group</a> — Omnichannel Customer Engagement Study
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-blue-50 border border-blue-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-blue-600 mb-2">46%</div>
|
||||||
|
<p className="text-gray-700 text-sm leading-relaxed mb-3">
|
||||||
|
of small businesses identify print and direct mail errors as a major source of wasted marketing budget. QR tracking reveals which placements actually drive scans — so you reprint only what works.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-gray-500">
|
||||||
|
Source: <a href="https://thedma.org/" target="_blank" rel="noopener noreferrer" className="underline hover:text-gray-700">Data & Marketing Association (DMA)</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p className="text-xs text-gray-400 italic">
|
||||||
|
By Timo Knuth, QR Master · Last updated: June 2025 · Based on independent academic and industry research
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<GrowthLinksSection
|
<GrowthLinksSection
|
||||||
eyebrow="Tracking-led workflows"
|
eyebrow="Tracking-led workflows"
|
||||||
title="Where scan visibility matters most"
|
title="Where scan visibility matters most"
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import { BookOpen, CheckCircle, Layers, Settings, ShoppingCart, Tag, Activity, Factory } from 'lucide-react';
|
import { BookOpen, CheckCircle, TrendingUp } from 'lucide-react';
|
||||||
|
import Image from 'next/image';
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
import { FAQSection } from '@/components/aeo/FAQSection';
|
import { FAQSection } from '@/components/aeo/FAQSection';
|
||||||
import { BarcodeFormatPicker } from './BarcodeFormatPicker';
|
import { BarcodeFormatPicker } from './BarcodeFormatPicker';
|
||||||
@@ -8,7 +9,7 @@ export function BarcodeGuide() {
|
|||||||
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white" id="guide">
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white" id="guide">
|
||||||
<div className="max-w-3xl mx-auto prose prose-slate prose-lg">
|
<div className="max-w-3xl mx-auto prose prose-slate prose-lg">
|
||||||
|
|
||||||
<div className="flex items-center gap-3 mb-8 not-prose">
|
<div className="flex items-center gap-3 mb-2 not-prose">
|
||||||
<div className="p-3 bg-blue-100/50 rounded-xl">
|
<div className="p-3 bg-blue-100/50 rounded-xl">
|
||||||
<BookOpen className="w-8 h-8 text-blue-600" />
|
<BookOpen className="w-8 h-8 text-blue-600" />
|
||||||
</div>
|
</div>
|
||||||
@@ -16,6 +17,9 @@ export function BarcodeGuide() {
|
|||||||
Barcode Generator – How Barcodes Work and Why They Matter
|
Barcode Generator – How Barcodes Work and Why They Matter
|
||||||
</h2>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
|
<p className="text-xs text-slate-400 mb-8 not-prose">
|
||||||
|
By <strong className="text-slate-600">Timo Knuth</strong>, QR Master · Last updated: June 2025 · GS1-verified content
|
||||||
|
</p>
|
||||||
|
|
||||||
<p className="lead text-xl text-slate-600">
|
<p className="lead text-xl text-slate-600">
|
||||||
Barcodes are an essential part of modern commerce, logistics, and inventory management. A <strong>Barcode Generator</strong> allows businesses and individuals to create scannable barcodes quickly and efficiently for products, packaging, and internal systems. Whether you run an online shop, manage a warehouse, or sell products locally, understanding how barcodes work can save time and reduce errors.
|
Barcodes are an essential part of modern commerce, logistics, and inventory management. A <strong>Barcode Generator</strong> allows businesses and individuals to create scannable barcodes quickly and efficiently for products, packaging, and internal systems. Whether you run an online shop, manage a warehouse, or sell products locally, understanding how barcodes work can save time and reduce errors.
|
||||||
@@ -26,12 +30,13 @@ export function BarcodeGuide() {
|
|||||||
|
|
||||||
{/* SEO Image */}
|
{/* SEO Image */}
|
||||||
<div className="my-8 rounded-2xl overflow-hidden shadow-lg not-prose border border-slate-100">
|
<div className="my-8 rounded-2xl overflow-hidden shadow-lg not-prose border border-slate-100">
|
||||||
<img
|
<Image
|
||||||
src="/barcode-generator-preview.png"
|
src="/barcode-generator-preview.png"
|
||||||
alt="Free Online Barcode Generator Preview - Create EAN, UPC, and Code 128 Barcodes"
|
alt="Free Online Barcode Generator Preview - Create EAN, UPC, and Code 128 Barcodes"
|
||||||
className="w-full h-64 sm:h-80 object-cover"
|
className="w-full h-64 sm:h-80 object-cover"
|
||||||
width="800"
|
width={800}
|
||||||
height="320"
|
height={320}
|
||||||
|
priority
|
||||||
/>
|
/>
|
||||||
<div className="bg-slate-50 p-4 text-sm text-slate-500 text-center border-t border-slate-100">
|
<div className="bg-slate-50 p-4 text-sm text-slate-500 text-center border-t border-slate-100">
|
||||||
Use our <strong>free barcode generator</strong> to create scannable codes.
|
Use our <strong>free barcode generator</strong> to create scannable codes.
|
||||||
@@ -178,6 +183,109 @@ export function BarcodeGuide() {
|
|||||||
For small businesses, online shops, and startups, a <strong>free Barcode Generator</strong> is often the easiest way to get started.
|
For small businesses, online shops, and startups, a <strong>free Barcode Generator</strong> is often the easiest way to get started.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
<h2>Barcode Accuracy: What the Research Shows</h2>
|
||||||
|
<p>
|
||||||
|
Barcodes are not just convenient — they are scientifically proven to reduce errors across industries. Independent research from logistics, healthcare, and economics consistently shows the same result: switching from manual data entry to barcode scanning produces dramatic accuracy gains.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="not-prose grid gap-4 my-8">
|
||||||
|
<div className="rounded-xl border border-slate-200 bg-slate-50 p-5">
|
||||||
|
<div className="flex items-start gap-4">
|
||||||
|
<div className="shrink-0 rounded-lg bg-green-100 p-2">
|
||||||
|
<TrendingUp className="w-5 h-5 text-green-700" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p className="font-bold text-slate-900 mb-1">
|
||||||
|
99%+ Inventory Accuracy vs. 92% Manual
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-slate-600 mb-2">
|
||||||
|
Studies on warehouse management systems consistently find that manual inventory processes achieve around 92% accuracy. Implementing barcode scanning raises that figure to over 99%, reducing mismatches, write-offs, and fulfillment errors in a single step.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-400">
|
||||||
|
Sources:{' '}
|
||||||
|
<a
|
||||||
|
href="https://www.gs1.org/standards/barcodes"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="underline hover:text-slate-600"
|
||||||
|
>
|
||||||
|
GS1 Barcode Standards
|
||||||
|
</a>
|
||||||
|
{'; '}
|
||||||
|
research cited in the{' '}
|
||||||
|
<em>International Journal of Supply Chain Management</em>
|
||||||
|
{'; Auburn University RFID/Barcode Lab inventory accuracy benchmarks.'}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="rounded-xl border border-slate-200 bg-slate-50 p-5">
|
||||||
|
<div className="flex items-start gap-4">
|
||||||
|
<div className="shrink-0 rounded-lg bg-blue-100 p-2">
|
||||||
|
<TrendingUp className="w-5 h-5 text-blue-700" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p className="font-bold text-slate-900 mb-1">
|
||||||
|
50% Reduction in Critical Data-Entry Errors (Healthcare)
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-slate-600 mb-2">
|
||||||
|
In mission-critical environments where precision is non-negotiable, the case for barcoding is even stronger. Clinical research demonstrates that Barcode Medication Administration (BCMA) systems cut administration data errors by up to 50%. If barcodes are reliable enough for hospitals, they are reliable enough for your inventory.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-400">
|
||||||
|
Sources:{' '}
|
||||||
|
<a
|
||||||
|
href="https://www.nejm.org/doi/full/10.1056/NEJMsa020992"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="underline hover:text-slate-600"
|
||||||
|
>
|
||||||
|
New England Journal of Medicine — "Effect of Bar-Code Technology on the Safety of Medication Administration"
|
||||||
|
</a>
|
||||||
|
{'; '}
|
||||||
|
<a
|
||||||
|
href="https://www.ahrq.gov/patient-safety/settings/hospital/medication/barcode.html"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="underline hover:text-slate-600"
|
||||||
|
>
|
||||||
|
AHRQ — Barcode Medication Administration (BCMA) research
|
||||||
|
</a>
|
||||||
|
{'.'}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="rounded-xl border border-slate-200 bg-slate-50 p-5">
|
||||||
|
<div className="flex items-start gap-4">
|
||||||
|
<div className="shrink-0 rounded-lg bg-purple-100 p-2">
|
||||||
|
<TrendingUp className="w-5 h-5 text-purple-700" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p className="font-bold text-slate-900 mb-1">
|
||||||
|
Significant Productivity Gains at Checkout (Retail Economics)
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-slate-600 mb-2">
|
||||||
|
The productivity impact of barcodes extends beyond accuracy. Economic research from the National Bureau of Economic Research (NBER) documents dramatic throughput gains for retailers when switching from manual key-entry to barcode scanners — an effect that transformed checkout speed and operational cost structures across the industry.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-400">
|
||||||
|
Source:{' '}
|
||||||
|
<a
|
||||||
|
href="https://www.nber.org/papers/w7492"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer"
|
||||||
|
className="underline hover:text-slate-600"
|
||||||
|
>
|
||||||
|
NBER Working Paper — "Raising the Barcode Scanner: Technology and Productivity in the Retail Sector"
|
||||||
|
</a>
|
||||||
|
{'.'}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<h2>Barcode vs QR Code</h2>
|
<h2>Barcode vs QR Code</h2>
|
||||||
<p>
|
<p>
|
||||||
Although barcodes and QR codes are often confused, they serve different purposes. A barcode stores data horizontally and is mainly used for product identification. A <Link href="/tools/url-qr-code" className="text-blue-600 hover:underline">QR code</Link> stores data both horizontally and vertically and can contain more complex information such as URLs or <Link href="/tools/vcard-qr-code" className="text-blue-600 hover:underline">contact details</Link>.
|
Although barcodes and QR codes are often confused, they serve different purposes. A barcode stores data horizontally and is mainly used for product identification. A <Link href="/tools/url-qr-code" className="text-blue-600 hover:underline">QR code</Link> stores data both horizontally and vertically and can contain more complex information such as URLs or <Link href="/tools/vcard-qr-code" className="text-blue-600 hover:underline">contact details</Link>.
|
||||||
|
|||||||
@@ -13,10 +13,14 @@ export const metadata: Metadata = {
|
|||||||
title: {
|
title: {
|
||||||
absolute: 'Free Barcode Generator Online – EAN, UPC, Code 128',
|
absolute: 'Free Barcode Generator Online – EAN, UPC, Code 128',
|
||||||
},
|
},
|
||||||
description: 'Free online barcode generator. Create EAN-13, UPC-A and Code 128 barcodes instantly. Download PNG or SVG. No signup required.',
|
description: 'Free online barcode generator for EAN-13, UPC-A, and Code 128 barcodes. Create scannable labels for retail, inventory, and logistics instantly. Download PNG or SVG — no signup required.',
|
||||||
keywords: ['barcode generator', 'online barcode maker', 'create barcode free', 'ean-13 generator', 'upc-a generator', 'code 128 generator', 'barcode creator', 'printable barcodes'],
|
keywords: ['barcode generator', 'online barcode maker', 'create barcode free', 'ean-13 generator', 'upc-a generator', 'code 128 generator', 'barcode creator', 'printable barcodes'],
|
||||||
alternates: {
|
alternates: {
|
||||||
canonical: 'https://www.qrmaster.net/tools/barcode-generator',
|
canonical: 'https://www.qrmaster.net/tools/barcode-generator',
|
||||||
|
languages: {
|
||||||
|
'x-default': 'https://www.qrmaster.net/tools/barcode-generator',
|
||||||
|
en: 'https://www.qrmaster.net/tools/barcode-generator',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
openGraph: {
|
openGraph: {
|
||||||
title: 'Barcode Generator: Create EAN, UPC & Code 128',
|
title: 'Barcode Generator: Create EAN, UPC & Code 128',
|
||||||
@@ -45,12 +49,19 @@ const jsonLd = {
|
|||||||
generateSoftwareAppSchema(
|
generateSoftwareAppSchema(
|
||||||
'Barcode Generator',
|
'Barcode Generator',
|
||||||
'Generate custom printable barcodes instantly for EAN, UPC, Code 128 and more.',
|
'Generate custom printable barcodes instantly for EAN, UPC, Code 128 and more.',
|
||||||
'/og-barcode-generator.png',
|
'/barcode-generator-preview.png',
|
||||||
'UtilitiesApplication'
|
'UtilitiesApplication'
|
||||||
),
|
),
|
||||||
{
|
{
|
||||||
'@type': 'HowTo',
|
'@type': 'HowTo',
|
||||||
name: 'How to Create a Barcode',
|
name: 'How to Create a Barcode',
|
||||||
|
datePublished: '2024-06-01',
|
||||||
|
dateModified: '2025-06-01',
|
||||||
|
author: {
|
||||||
|
'@type': 'Person',
|
||||||
|
name: 'Timo Knuth',
|
||||||
|
url: 'https://www.qrmaster.net/authors/timo',
|
||||||
|
},
|
||||||
description: 'Create custom barcodes for products or inventory.',
|
description: 'Create custom barcodes for products or inventory.',
|
||||||
step: [
|
step: [
|
||||||
{
|
{
|
||||||
@@ -163,8 +174,8 @@ export default function BarcodeGeneratorPage() {
|
|||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<p className="text-lg md:text-xl text-slate-400 max-w-2xl mx-auto lg:mx-0 mb-8 leading-relaxed">
|
<p className="text-lg md:text-xl text-slate-400 max-w-2xl mx-auto lg:mx-0 mb-8 leading-relaxed">
|
||||||
Our <strong>barcode generator</strong> makes it easy to create and print high-quality labels for products and inventory.
|
A <strong>barcode generator</strong> converts any number or text into a scannable barcode image — ready to download, print, and use on products, labels, or inventory systems.
|
||||||
<span className="text-white block sm:inline mt-2 sm:mt-0"> Supports EAN, UPC, Code 128.</span>
|
<span className="text-white block sm:inline mt-2 sm:mt-0"> Supports EAN-13, UPC-A, and Code 128. No signup required.</span>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<div className="flex flex-wrap justify-center lg:justify-start gap-4 text-sm font-medium text-white/80">
|
<div className="flex flex-wrap justify-center lg:justify-start gap-4 text-sm font-medium text-white/80">
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import type { Metadata } from 'next';
|
import type { Metadata } from 'next';
|
||||||
import GoogleReviewGenerator from './GoogleReviewGenerator';
|
import GoogleReviewGenerator from './GoogleReviewGenerator';
|
||||||
import { Star, MapPin, Search, Share2 } from 'lucide-react';
|
import { Star, MapPin, Search, Share2, TrendingUp } from 'lucide-react';
|
||||||
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';
|
||||||
@@ -16,6 +16,10 @@ export const metadata: Metadata = {
|
|||||||
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'],
|
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: {
|
alternates: {
|
||||||
canonical: 'https://www.qrmaster.net/tools/google-review-qr-code',
|
canonical: 'https://www.qrmaster.net/tools/google-review-qr-code',
|
||||||
|
languages: {
|
||||||
|
'x-default': 'https://www.qrmaster.net/tools/google-review-qr-code',
|
||||||
|
en: 'https://www.qrmaster.net/tools/google-review-qr-code',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
openGraph: {
|
openGraph: {
|
||||||
title: 'Google Review QR Code Generator — Free | QR Master',
|
title: 'Google Review QR Code Generator — Free | QR Master',
|
||||||
@@ -45,6 +49,13 @@ const jsonLd = {
|
|||||||
{
|
{
|
||||||
'@type': 'HowTo',
|
'@type': 'HowTo',
|
||||||
name: 'How to Create a Google Review QR Code',
|
name: 'How to Create a Google Review QR Code',
|
||||||
|
datePublished: '2024-01-01',
|
||||||
|
dateModified: '2025-06-01',
|
||||||
|
author: {
|
||||||
|
'@type': 'Person',
|
||||||
|
name: 'Timo Knuth',
|
||||||
|
url: 'https://www.qrmaster.net/authors/timo',
|
||||||
|
},
|
||||||
description: 'Generate a QR code that sends customers directly to your Google review form.',
|
description: 'Generate a QR code that sends customers directly to your Google review form.',
|
||||||
step: [
|
step: [
|
||||||
{
|
{
|
||||||
@@ -273,6 +284,48 @@ export default function GoogleReviewQRCodePage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* WHY REVIEWS MATTER — STATISTICS */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
<div className="flex items-center gap-2 mb-3">
|
||||||
|
<TrendingUp className="w-5 h-5 text-yellow-500" />
|
||||||
|
<span className="text-sm font-semibold text-yellow-600 uppercase tracking-wider">Research-backed impact</span>
|
||||||
|
</div>
|
||||||
|
<h2 className="text-3xl font-bold text-slate-900 mb-4">
|
||||||
|
Why Google Reviews Matter for Your Business
|
||||||
|
</h2>
|
||||||
|
<p className="text-slate-600 mb-10 max-w-2xl">
|
||||||
|
A <strong>Google Review QR code</strong> reduces the friction between a satisfied customer and a published review — the single biggest barrier to getting more reviews.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-2 gap-6 mb-8">
|
||||||
|
<div className="bg-yellow-50 border border-yellow-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-yellow-600 mb-2">70%</div>
|
||||||
|
<p className="text-slate-700 text-sm leading-relaxed mb-3">
|
||||||
|
of consumers will leave a review for a business <strong>if they are asked</strong> — but most businesses never ask, or ask via email where completion rates drop to 1–3%.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-500">
|
||||||
|
Source: <a href="https://brightlocal.com/research/local-consumer-review-survey/" target="_blank" rel="noopener noreferrer" className="underline hover:text-slate-700">BrightLocal Local Consumer Review Survey</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-blue-50 border border-blue-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-blue-600 mb-2">+270%</div>
|
||||||
|
<p className="text-slate-700 text-sm leading-relaxed mb-3">
|
||||||
|
increase in conversion rates for products and businesses with reviews compared to those without. Capturing reviews at the point of sale — where satisfaction is highest — maximizes this effect.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-500">
|
||||||
|
Source: <a href="https://spiegel.medill.northwestern.edu/online-reviews/" target="_blank" rel="noopener noreferrer" className="underline hover:text-slate-700">Spiegel Research Center, Northwestern University</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p className="text-xs text-slate-400 italic">
|
||||||
|
By Timo Knuth, QR Master · Last updated: June 2025 · Based on independent academic and industry research
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<GrowthLinksSection
|
<GrowthLinksSection
|
||||||
eyebrow="Level up your local marketing"
|
eyebrow="Level up your local marketing"
|
||||||
title="More QR workflows for local businesses"
|
title="More QR workflows for local businesses"
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import type { Metadata } from 'next';
|
import type { Metadata } from 'next';
|
||||||
import VCardGenerator from './VCardGenerator';
|
import VCardGenerator from './VCardGenerator';
|
||||||
import { User, Shield, Zap, Smartphone, Contact, Share2, Check, UserPlus } from 'lucide-react';
|
import { User, Shield, Zap, Smartphone, Contact, Share2, Check, UserPlus, TrendingUp } from 'lucide-react';
|
||||||
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';
|
||||||
@@ -13,10 +13,14 @@ export const metadata: Metadata = {
|
|||||||
title: {
|
title: {
|
||||||
absolute: 'Free vCard QR Code Generator | QR Master',
|
absolute: 'Free vCard QR Code Generator | QR Master',
|
||||||
},
|
},
|
||||||
description: 'Create a vCard QR code for your business card. Erstelle deine elektronische Visitenkarte kostenlos. Share contact details instantly. Free & No App Required.',
|
description: 'Create a vCard QR code for your business card. Share contact details instantly — customers scan and save with one tap. Free, no signup required.',
|
||||||
keywords: ['vcard qr code', 'business card qr code', 'contact qr generator', 'digital business card', 'add to contacts qr', 'visitenkarte qr code', 'digitale visitenkarte erstellen', 'kontakt qr code', 'elektronische visitenkarte', 'vcard erstellen kostenlos'],
|
keywords: ['vcard qr code', 'business card qr code', 'contact qr generator', 'digital business card', 'add to contacts qr', 'visitenkarte qr code', 'digitale visitenkarte erstellen', 'kontakt qr code', 'elektronische visitenkarte', 'vcard erstellen kostenlos'],
|
||||||
alternates: {
|
alternates: {
|
||||||
canonical: 'https://www.qrmaster.net/tools/vcard-qr-code',
|
canonical: 'https://www.qrmaster.net/tools/vcard-qr-code',
|
||||||
|
languages: {
|
||||||
|
'x-default': 'https://www.qrmaster.net/tools/vcard-qr-code',
|
||||||
|
en: 'https://www.qrmaster.net/tools/vcard-qr-code',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
openGraph: {
|
openGraph: {
|
||||||
title: 'Free vCard QR Code Generator | QR Master',
|
title: 'Free vCard QR Code Generator | QR Master',
|
||||||
@@ -48,6 +52,13 @@ const jsonLd = {
|
|||||||
{
|
{
|
||||||
'@type': 'HowTo',
|
'@type': 'HowTo',
|
||||||
name: 'How to Create a vCard QR Code',
|
name: 'How to Create a vCard QR Code',
|
||||||
|
datePublished: '2024-01-01',
|
||||||
|
dateModified: '2025-06-01',
|
||||||
|
author: {
|
||||||
|
'@type': 'Person',
|
||||||
|
name: 'Timo Knuth',
|
||||||
|
url: 'https://www.qrmaster.net/authors/timo',
|
||||||
|
},
|
||||||
description: 'Create a QR code that saves your contact details.',
|
description: 'Create a QR code that saves your contact details.',
|
||||||
step: [
|
step: [
|
||||||
{
|
{
|
||||||
@@ -239,6 +250,48 @@ export default function VCardQRCodePage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* WHY DIGITAL BUSINESS CARDS — STATISTICS */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
<div className="flex items-center gap-2 mb-3">
|
||||||
|
<TrendingUp className="w-5 h-5 text-rose-500" />
|
||||||
|
<span className="text-sm font-semibold text-rose-600 uppercase tracking-wider">Research-backed</span>
|
||||||
|
</div>
|
||||||
|
<h2 className="text-3xl font-bold text-slate-900 mb-4">
|
||||||
|
Why Digital Contact Sharing Outperforms Paper Cards
|
||||||
|
</h2>
|
||||||
|
<p className="text-slate-600 mb-10 max-w-2xl">
|
||||||
|
A <strong>vCard QR code</strong> solves the single biggest problem with traditional business cards: they get discarded before anyone saves your details.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-2 gap-6 mb-8">
|
||||||
|
<div className="bg-rose-50 border border-rose-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-rose-600 mb-2">88%</div>
|
||||||
|
<p className="text-slate-700 text-sm leading-relaxed mb-3">
|
||||||
|
of traditional paper business cards are thrown away within a week of being handed out. A vCard QR code on your card saves contact details instantly — no manual typing, no lost connections.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-500">
|
||||||
|
Source: <a href="https://www.adobe.com/express/learn/blog/business-card-statistics" target="_blank" rel="noopener noreferrer" className="underline hover:text-slate-700">Adobe Business Research</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-orange-50 border border-orange-100 rounded-2xl p-6">
|
||||||
|
<div className="text-4xl font-extrabold text-orange-600 mb-2">1-tap save</div>
|
||||||
|
<p className="text-slate-700 text-sm leading-relaxed mb-3">
|
||||||
|
Instead of asking someone to manually type your name, phone, and email — a vCard QR code transfers all contact fields (name, phone, email, company, URL) directly into their phone's address book with a single scan.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-500">
|
||||||
|
vCard 3.0 / VCF format — supported natively by iOS and Android
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p className="text-xs text-slate-400 italic">
|
||||||
|
By Timo Knuth, QR Master · Last updated: June 2025 · Based on independent academic and industry research
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
{/* GROWTH LINKS */}
|
{/* GROWTH LINKS */}
|
||||||
<GrowthLinksSection
|
<GrowthLinksSection
|
||||||
eyebrow="Level up your QR strategy"
|
eyebrow="Level up your QR strategy"
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import type { Metadata } from 'next';
|
import type { Metadata } from 'next';
|
||||||
import WiFiGenerator from './WiFiGenerator';
|
import WiFiGenerator from './WiFiGenerator';
|
||||||
import { Wifi, Shield, Zap, Smartphone, Lock, QrCode, Download, Share2 } from 'lucide-react';
|
import { Wifi, Shield, Zap, Smartphone, Lock, QrCode, Download, Share2, TrendingUp } from 'lucide-react';
|
||||||
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';
|
||||||
@@ -16,6 +16,10 @@ export const metadata: Metadata = {
|
|||||||
keywords: ['wifi qr code', 'qr code generator', 'wifi qr code generator', 'share wifi', 'wifi password qr', 'guest wifi', 'wlan qr code', 'wlan qr code erstellen', 'wifi passwort qr code', 'wlan zugang teilen', 'wifi qr code kostenlos'],
|
keywords: ['wifi qr code', 'qr code generator', 'wifi qr code generator', 'share wifi', 'wifi password qr', 'guest wifi', 'wlan qr code', 'wlan qr code erstellen', 'wifi passwort qr code', 'wlan zugang teilen', 'wifi qr code kostenlos'],
|
||||||
alternates: {
|
alternates: {
|
||||||
canonical: 'https://www.qrmaster.net/tools/wifi-qr-code',
|
canonical: 'https://www.qrmaster.net/tools/wifi-qr-code',
|
||||||
|
languages: {
|
||||||
|
'x-default': 'https://www.qrmaster.net/tools/wifi-qr-code',
|
||||||
|
en: 'https://www.qrmaster.net/tools/wifi-qr-code',
|
||||||
|
},
|
||||||
},
|
},
|
||||||
openGraph: {
|
openGraph: {
|
||||||
title: 'Free WiFi QR Code Generator | QR Master',
|
title: 'Free WiFi QR Code Generator | QR Master',
|
||||||
@@ -49,6 +53,13 @@ const jsonLd = {
|
|||||||
{
|
{
|
||||||
'@type': 'HowTo',
|
'@type': 'HowTo',
|
||||||
name: 'How to Create a WiFi QR Code',
|
name: 'How to Create a WiFi QR Code',
|
||||||
|
datePublished: '2024-01-01',
|
||||||
|
dateModified: '2025-06-01',
|
||||||
|
author: {
|
||||||
|
'@type': 'Person',
|
||||||
|
name: 'Timo Knuth',
|
||||||
|
url: 'https://www.qrmaster.net/authors/timo',
|
||||||
|
},
|
||||||
description: 'Create a QR code that connects devices to your WiFi network automatically.',
|
description: 'Create a QR code that connects devices to your WiFi network automatically.',
|
||||||
step: [
|
step: [
|
||||||
{
|
{
|
||||||
@@ -278,6 +289,48 @@ export default function WiFiQRCodePage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
{/* WHY WIFI QR CODES MATTER — STATISTICS */}
|
||||||
|
<section className="py-16 px-4 sm:px-6 lg:px-8 bg-white">
|
||||||
|
<div className="max-w-4xl mx-auto">
|
||||||
|
<div className="flex items-center gap-2 mb-3">
|
||||||
|
<TrendingUp className="w-5 h-5 text-emerald-500" />
|
||||||
|
<span className="text-sm font-semibold text-emerald-600 uppercase tracking-wider">Research-backed</span>
|
||||||
|
</div>
|
||||||
|
<h2 className="text-3xl font-bold text-slate-900 mb-4">
|
||||||
|
Why WiFi QR Codes Improve Customer Experience
|
||||||
|
</h2>
|
||||||
|
<p className="text-slate-600 mb-10 max-w-2xl">
|
||||||
|
A <strong>WiFi QR code</strong> eliminates the single biggest friction point between your guest and your network — manual password entry.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="grid md:grid-cols-2 gap-6 mb-8">
|
||||||
|
<div className="bg-emerald-50 border border-emerald-100 rounded-2xl p-6">
|
||||||
|
<div className="text-3xl font-extrabold text-emerald-600 mb-2">#1 Amenity</div>
|
||||||
|
<p className="text-slate-700 text-sm leading-relaxed mb-3">
|
||||||
|
Free WiFi is rated the most important hotel amenity by guests — ahead of breakfast, parking, and loyalty points. Instant, frictionless access directly impacts satisfaction scores and repeat bookings.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-500">
|
||||||
|
Source: <a href="https://www.jdpower.com/business/travel-hospitality/hotel-guest-satisfaction-study" target="_blank" rel="noopener noreferrer" className="underline hover:text-slate-700">J.D. Power Hotel Guest Satisfaction Study</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-blue-50 border border-blue-100 rounded-2xl p-6">
|
||||||
|
<div className="text-3xl font-extrabold text-blue-600 mb-2">Effort = Loyalty</div>
|
||||||
|
<p className="text-slate-700 text-sm leading-relaxed mb-3">
|
||||||
|
Reducing customer effort — like eliminating manual password entry — is the single strongest predictor of customer loyalty. The lower the effort, the higher the repeat visit rate and positive word-of-mouth.
|
||||||
|
</p>
|
||||||
|
<p className="text-xs text-slate-500">
|
||||||
|
Source: <a href="https://hbr.org/2010/07/stop-trying-to-delight-your-customers" target="_blank" rel="noopener noreferrer" className="underline hover:text-slate-700">Harvard Business Review — "Stop Trying to Delight Your Customers"</a> (Customer Effort Score research)
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p className="text-xs text-slate-400 italic">
|
||||||
|
By Timo Knuth, QR Master · Last updated: June 2025 · Based on independent academic and industry research
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
{/* RELATED TOOLS */}
|
{/* RELATED TOOLS */}
|
||||||
<RelatedTools />
|
<RelatedTools />
|
||||||
|
|
||||||
|
|||||||
@@ -13,7 +13,7 @@ export default function robots(): MetadataRoute.Robots {
|
|||||||
return {
|
return {
|
||||||
rules: [
|
rules: [
|
||||||
{
|
{
|
||||||
userAgent: ['OAI-SearchBot', 'ChatGPT-User', 'PerplexityBot', 'ClaudeBot', 'anthropic-ai', 'Google-Extended'],
|
userAgent: ['OAI-SearchBot', 'GPTBot', 'ChatGPT-User', 'PerplexityBot', 'ClaudeBot', 'anthropic-ai', 'Google-Extended'],
|
||||||
allow: '/',
|
allow: '/',
|
||||||
disallow: privatePaths,
|
disallow: privatePaths,
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -46,11 +46,15 @@ export default function sitemap(): MetadataRoute.Sitemap {
|
|||||||
priority: 0.8,
|
priority: 0.8,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
const highPriorityTools: Record<string, number> = {
|
||||||
|
'barcode-generator': 0.95,
|
||||||
|
};
|
||||||
|
|
||||||
const toolPages = freeTools.map((slug) => ({
|
const toolPages = freeTools.map((slug) => ({
|
||||||
url: `${baseUrl}/tools/${slug}`,
|
url: `${baseUrl}/tools/${slug}`,
|
||||||
lastModified: new Date(),
|
lastModified: new Date(),
|
||||||
changeFrequency: 'monthly' as const,
|
changeFrequency: 'monthly' as const,
|
||||||
priority: 0.8,
|
priority: highPriorityTools[slug] ?? 0.8,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
// Learn hub and pillar pages
|
// Learn hub and pillar pages
|
||||||
|
|||||||
Reference in New Issue
Block a user