Zum Inhalt springen

Pakete & Preise · Action · 5 Props

Paket-Cards

Pricing-/Paket-Cards mit Features, Resultat-Zeile und CTA.

Pakete & Preise Action 5 Props

recipes/packageCards.ts

← Alle Recipes

Editor-Schema

Felder, die der Gourmonia-Editor anzeigt. Power-User in TypeScript-Pages können zusätzliche Recipe-Props nutzen, die hier nicht aufgeführt sind.

FeldTypPflicht
colsunion
gapenum (sm | md | lg)
itemsobject[]
featuresLabelstring
resultLabelstring

Default-Props

Wert beim Einfügen ins Editor-Canvas.

JSON

{
  "cols": 3,
  "gap": "md",
  "featuresLabel": "Inkludiert",
  "resultLabel": "Resultat",
  "items": [
    {
      "title": "Basis",
      "description": "Für den Einstieg.",
      "features": [
        "Feature A",
        "Feature B"
      ],
      "cta": {
        "label": "Anfragen",
        "href": "/kontakt"
      }
    },
    {
      "title": "Standard",
      "focus": "Beliebt",
      "description": "Für die meisten.",
      "features": [
        "Feature A",
        "Feature B",
        "Feature C"
      ],
      "cta": {
        "label": "Anfragen",
        "href": "/kontakt"
      }
    },
    {
      "title": "Premium",
      "description": "Für Anspruchsvolle.",
      "features": [
        "Feature A",
        "Feature B",
        "Feature C",
        "Feature D"
      ],
      "cta": {
        "label": "Anfragen",
        "href": "/kontakt"
      }
    }
  ]
}

Live-Preview

Basis

Für den Einstieg.

Inkludiert

Feature A
Feature B

Beliebt

Standard

Für die meisten.

Inkludiert

Feature A
Feature B
Feature C

Premium

Für Anspruchsvolle.

Inkludiert

Feature A
Feature B
Feature C
Feature D

Tags

packages pricing offers tiers