CTA Components

Call-to-action components for use in blog posts and landing pages. Configure via frontmatter with bottomCTA and sidebarCTA fields.

Full-Width CTAs

Used at the bottom of blog posts. Set via bottomCTA: {id} in frontmatter.

bottomCTA: 1Type: default

Erkennen Sie, welche Konten florieren und welche abrutschen

Sehen Sie, welche Konten florieren, welche abrutschen und was sich geändert hat – mit klaren Produktnutzungssignalen.

Demo buchen Kostenlos testen

bottomCTA: 2Type: cards

Erkennen Sie gefährdete Kunden

Sehen Sie, welche Konten florieren, welche abrutschen und was sich geändert hat – mit klaren Produktnutzungssignalen.

Jetzt starten Demo buchen

Dokumentation

Erfahren Sie, wie Sie das Beste aus Accoil herausholen.

Kundenerfolgs-Leitfaden

Der vollständige Leitfaden für Kundenengagement.

bottomCTA: 13Type: accent

Bereit, Ihre Kunden besser zu verstehen?

Schließen Sie sich Teams an, die Accoil nutzen, um Risiken früh zu erkennen, Benutzer zum Erfolg zu führen und Expansionsmöglichkeiten zu finden.

Kostenlose Testversion starten Mit Vertrieb sprechen

Sidebar CTAs

Compact versions for the blog sidebar. Set via sidebarCTA: {id} in frontmatter. Only CTAs marked as sidebarCompatible will render.

sidebarCTA: 1

Erkennen Sie, welche Konten florieren und welche abrutschen

Sehen Sie, welche Konten florieren, welche abrutschen und was sich geändert hat – mit klaren Produktnutzungssignalen.

Demo buchen Kostenlos testen

sidebarCTA: 2(not compatible)

Not sidebar compatible

sidebarCTA: 13

Bereit, Ihre Kunden besser zu verstehen?

Schließen Sie sich Teams an, die Accoil nutzen, um Risiken früh zu erkennen, Benutzer zum Erfolg zu führen und Expansionsmöglichkeiten zu finden.

Kostenlose Testversion starten Mit Vertrieb sprechen

Usage in Blog Posts

---
title: "Your Blog Post"
description: "Post description"
date: "2025-01-15"
# ... other frontmatter

# CTA Options
bottomCTA: 13        # Accent-style CTA at bottom
sidebarCTA: 1        # Compact CTA in sidebar
hideTOC: false       # Show table of contents (default)
---

Your content here...

Adding New CTAs

To add a new CTA, update the registry and add translations:

// 1. Add to src/components/sections/shared/cta-registry.tsx
const ctaRegistry: Record<number, CTAConfig> = {
  1: { type: 'default', sidebarCompatible: true },
  2: { type: 'cards', sidebarCompatible: false },
  13: { type: 'accent', sidebarCompatible: true },
  // Add your new CTA:
  14: { type: 'default', sidebarCompatible: true },
};

// 2. Add translations via CLI:
npm run i18n -- set common.ctas.cta14.heading "Your heading" --locale=en
npm run i18n -- set common.ctas.cta14.description "Description" --locale=en
npm run i18n -- set common.ctas.cta14.primaryCta "Primary Button" --locale=en
npm run i18n -- set common.ctas.cta14.primaryUrl "/your-url" --locale=en
npm run i18n -- set common.ctas.cta14.secondaryCta "Secondary" --locale=en
npm run i18n -- set common.ctas.cta14.secondaryUrl "/other-url" --locale=en

// Repeat for other locales (es, de, fr)

Available Types

Type	Description	Sidebar Compatible
`default`	Simple CTA with heading, description, and buttons in a bordered card	Yes
`accent`	Full-width CTA with accent background color	Yes
`cards`	Two-column layout with linked resource cards	No