CommunityRecherche & Datenanalysegithub.com

croct-tech/agent-skills

Verbindet Croct mit Drittanbieterplattformen oder hilft bei der Migration von anderen Personalisierungs- und Experimentiertools. Deckt Storyblok, Sanity, Strapi, Shopify, VTEX, Google Tag Manager, Microsoft Clarity, HubSpot, Firmendatenanbieter und Migrationen von Mutiny und Ninetailed ab.

Was ist agent-skills?

Dieses Skillbündel bietet eine zentrale Anlaufstelle für alle Integrationen und Migrationen, die auf dem Croct SDK aufbauen. Es unterstützt Entwickler dabei, Croct mit gängigen Plattformen wie Storyblok (Optimize App, @croct/plug-storyblok), Sanity, Strapi, Shopify (Hydrogen Storefront Events, Custom Pixel für Checkout und Bestellungen), VTEX (Store Framework, Ereignisweiterleitung), Google Tag Manager (Data Layer), Microsoft Clarity (Session-Tagging), HubSpot (Formular-Tracking) sowie Firmendatenanbietern wie 6sense, Demandbase, Clearbit Reveal und ZoomInfo WebSights zu verbinden. Zudem enthält es detaillierte Migrationsleitfäden von Mutiny und Ninetailed. Jede Integration ist als eigenständige Referenzdatei dokumentiert, sodass der Entwickler nur die für seine Plattform relevanten Schritte befolgen muss. Das Skill stellt sicher, dass CMS-Inhalte stets als Fallback dienen, Croct-Komponenten dem CMS-Schema entsprechen und Ziele vor der Veröffentlichung von Experimenten erfasst werden. Es enthält klare Regeln für die Verwendung von CDN-Integrationsskripten, die über `cdn.croct.io/plug-integration` geladen werden, und eine Schritt-für-Schritt-Anleitung zur Umsetzung.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/croct-tech/agent-skills/tree/HEAD/skills/croct-integrate-platforms

Installed? Explore more Recherche & Datenanalyse skills: affaan-m/uspto-database, affaan-m/scholar-evaluation, affaan-m/literature-review · View all 6 →

Original anzeigen→Alle Skills durchsuchen

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

OpenAIChatGPTClaudeClaudeGeminiGeminiGrokGrokPerplexityPerplexityDeepSeekDeepSeek

Dokumentation

Croct-Plattformintegrationen und Migrationen

Jede Integration hier baut auf einem funktionierenden Croct SDK auf. Sie speisen entweder Daten ein (Ereignisse, Profilattribute), senden Croct-Daten aus (Clarity) oder rendern Slot-Inhalte innerhalb des Inhalts einer Plattform (CMS, HubSpot-Formular-ID). Migrationen ersetzen die Flags oder Erlebnisse eines anderen Tools durch Slots.

Integration auswählen

Plattform / ZielWas die Integration machtInstallationsmethodeReferenz
StoryblokOptimize App verknüpft Blöcke mit Slots; SDK tauscht verknüpfte Blöcke beim Abrufen von Storys aus (JS, PHP)Storyblok App + croct init oder @croct/plug-storyblok / croct/plug-storyblokstoryblok.md
SanitySlot-Abruf mit Sanity-Inhalt als fallback; kein Croct-Paketcroct init + fetchContentheadless-cms.md
StrapiOrdnet Dynamic-Zonen-Komponenten über einen Mapping-Slot Slots zucroct init + fetchContentheadless-cms.md
Shopify HydrogenAutomatische Storefront-Ereignisse, Kundenidentifikation; SDK-Nutzung befindet sich im Skill croct-integrate-sdkcroct init (Hydrogen SDK)ecommerce.md
Shopify Checkout / Bestellungen (Liquid oder Hydrogen)Benutzerdefinierter Pixel verfolgt checkoutStarted, orderPlaced sowie benutzerdefinierte EreignisseStorefront-Plugin + Shopify Custom Pixelecommerce.md
Shopify Liquid-ThemeJavaScript SDK für Inhalte; GTM-Integration für Ereignisse; Pixel für CheckoutScript-Tagsecommerce.md
VTEX Store Framework (VTEX IO)Leitet Store-Ereignisse als Ziele und E-Commerce-Ereignisse weiter; reichert Profile anvtex.js-Script oder GTMecommerce.md
Google Tag Manager / GA4 Data LayerLeitet empfohlene Data-Layer-Ereignisse als Ziele und E-Commerce-Ereignisse weitergoogle-tag-manager.js-Script oder GTManalytics-and-crm.md
Microsoft ClarityMarkiert Clarity-Sitzungen mit Croct-Erlebnissen, Zielgruppen, Experimentvariantenclarity.js-Script oder GTManalytics-and-crm.md
HubSpot-FormulareEinreichungsziele, Profilanreicherung, Formular-ID aus einem Slot für TestsCode um den HubSpot-Embed herumanalytics-and-crm.md
6sense, DemandbaseSchreibt umfangreiche firmographics-Attribute in das ProfilCroct-Script oder GTMfirmographics.md
Clearbit Reveal, ZoomInfo WebSightsSchreibt Unternehmensattribute durch von Ihnen hinzugefügten Code in das ProfilGTM Custom HTMLfirmographics.md
Migration von Mutiny, NinetailedKonzeptzuordnung und schrittweise Ersetzung durch Slots, Zielgruppen, Experimentecroct init + Slots pro Bereichmigrations.md

Lesen Sie nur die Referenz für die jeweilige Plattform. Wenn die Plattform nicht aufgeführt ist, gibt es in der Dokumentation keine dedizierte Integration: Teilen Sie dies mit und prüfen Sie https://docs.croct.com/llms.txt, bevor Sie improvisieren.

Plattformübergreifende Regeln

  1. SDK zuerst. Jede Integration erfordert das Croct SDK auf der Seite oder dem Server. Integrationsskripte tun ohne es nichts. Richten Sie es mit croct init ein oder konsultieren Sie das Skill croct-integrate-sdk.
  2. Bevorzugen Sie croct init für Storyblok, Sanity, Strapi, Hydrogen und Migrationen. Es erkennt den Stack und verdrahtet das SDK (und für Storyblok JS umschließt es storyblokInit mit withCroct). Verwenden Sie die manuellen Schritte nur, wenn der Benutzer danach fragt oder die CLI es nicht verdrahten kann (z. B. PHP Storyblok ohne unterstütztes Framework).
  3. CMS-Inhalt ist immer der Fallback. Übergeben Sie den vorhandenen CMS- oder hartcodierten Inhalt als fallback, sodass fehlgeschlagene oder langsame Anfragen die aktuelle Seite rendern. Fragen Sie für Sanity, Strapi und Ninetailed den Benutzer, wo der Standard-Inhalt leben soll (Croct, empfohlen oder das CMS über metadata.contentSource === 'slot'). Siehe headless-cms.md.
  4. Croct-Komponenten spiegeln das CMS-Schema mit denselben Attributnamen wider, sodass Slot-Inhalt und CMS-Inhalt in derselben Rendering-Komponente austauschbar sind.
  5. Ziele erfassen, bevor ein Erlebnis oder Experiment veröffentlicht wird, sonst zeigen frühe Daten Expositionen ohne Conversions.
  6. Firmendaten sind beim ersten Seitenaufruf nicht verfügbar. Gestalten Sie account-basierte Erlebnisse so, dass sie bei späteren Seitenaufrufen aktiviert werden; verwenden Sie für den ersten Eindruck Kampagnen, Referrer oder Standort.
  7. Benutzerdefinierte Attribute in CQL lassen das custom.-Präfix weg: custom.firmographics.profile.industry ist user's firmographics's profile's industry. Profile erlauben maximal 10 benutzerdefinierte Attribute. Für alles, was über diese Beispiele hinausgeht, siehe das Skill croct-cql.
  8. Storyblok-Besonderheiten: Optimize erfordert den Scale-Plan und die Zustimmung des Storyblok-Anbieters (über den Croct-Support). Tabellen- und Referenzfelder können nicht personalisiert werden.

CDN-Integrationsskripte

Alle werden von https://cdn.croct.io/plug-integration/ geladen:

ScriptWoLadezeitpunkt
google-tag-manager.js<head> oder <body> oder GTMBeliebig; spielt den Data Layer erneut ab
clarity.js<head> oder <body> oder GTMBeliebig; wartet auf Clarity
vtex.js<head> oder <body> oder GTMSo früh wie möglich; frühere Ereignisse gehen verloren
6sense.js, demandbase.js<head> oder <body> oder GTMWartet darauf, dass der Anbieter den Besucher identifiziert
shopify-pixel.jsLiquid layout/theme.liquid vor </head>, mit deferBeliebig; registriert sich beim SDK, wenn es lädt
shopify-pixel-tracker.jsInnerhalb des Shopify Custom Pixels importiertn/a

GTM-Tag-Rezept (an den Benutzer weitergeben)

Für jedes oben als „über GTM“ angebotene Skript: Tags > Neu; benennen (z. B. „Data-Layer-Ereignisse an Croct senden“); Tag-Typ Benutzerdefiniertes HTML; den `<script src=

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

croct-tech/agent-skills

>- Use when writing, reading, reviewing, or debugging Croct's Contextual Query Language (CQL): audience criteria, `croct.evaluate()` / `useEvaluation` / `<Personalization query>` / Next.js `cql` tag queries, Evaluation API `query` bodies (`/client/web/evaluate`, `/external/web/evaluate`), and dynamic content values (`"type": "dynamic"`, `"expression"`). Covers context variables (user, session, page, location, campaign, cart, device, browser, context, now/today), data types and conversions, accessors and selectors (`'s`, `property X of`, `[1st]`, `[*]`, `[...]`), tests (`is`, `matches`, `is like`, `contains either`, `is between`, `is defined`, `is returning`), quantifiers (`some ... satisfies`), macros, modifiers, event expressions (`user has viewed a page`, `user has abandoned a cart`, `user has completed goal`), audience estimation, and recipes. Triggers: "write an audience", "target mobile users in New York", "CQL syntax error", "audience never matches", "unavailable estimate".

croct-tech/agent-skills

>- Use when installing or using a Croct SDK in application code: rendering slot content, evaluating CQL queries, server or client fetching, prerendering, identifying users, app ID / API key env vars, testing, or debugging. Covers JavaScript (`@croct/plug`, `croct.fetch`, `croct.evaluate`), React (`@croct/plug-react`, `<CroctProvider>`, `useContent`, `<Slot>`, `useEvaluation`, `useCroct`), Next.js (`@croct/plug-next`, `fetchContent`, `cql`, middleware/proxy, `NEXT_PUBLIC_CROCT_APP_ID`, `CROCT_API_KEY`), Vue (`@croct/plug-vue`), Nuxt (`@croct/plug-nuxt`), Shopify Hydrogen (`@croct/plug-hydrogen`), PHP (`croct/plug-php`), Laravel, Symfony, and Drupal. Triggers: slot IDs like `home-hero@1`, `SlotContent`, "Croct is not plugged in", "initial content is required for server-side rendering", "Did you forget to configure Croct's middleware?", CORS errors.

croct-tech/agent-skills

>- Use when designing or changing Croct content models: regular vs union components, what becomes a component, slot, structure, or primitive attribute; writing component schema JSON (`structure`, `union`, `reference`, `text`, `number`, `boolean`, `list`, `@croct/file`, `@croct/richText` rich text, `format`, `choices`, `optional`, `private`, `position`); writing content definition JSON (`static`/`dynamic` values, `nullable`, `default`, `{{placeholder}}` paths); slot default, localized, experience, experiment, or content group content; schema limit errors (30 attributes, 6 nesting levels, 10 union members, complexity score 50); component versioning and breaking changes (`home-hero@2`); refactoring (duplicate and modify, duplicate and replace, flatten and merge); Markdown in text attributes with `@croct/md-lite`. Phrasings: "model content for a hero", "add an attribute to the banner component", "support variations", "component is too complex", "localize the hero", "translations", `preferredLocale`.

croct-tech/agent-skills

>- Use when planning or implementing personalization or A/B testing with Croct: creating an experience (audience, slots, content, priority, scheduling, drafts), adding an experiment (A/B/n, primary goal ID, traffic allocation, variants, cross-device consistency), wiring the code it needs (slots, `croct.track('goalCompleted', {goalId})`, `orderPlaced`, `leadGenerated`, `userSignedUp`), server-side feature-flag experiments, redirect experiments, personalization recipes (UTM campaigns, ABM, search terms, location, free shipping, interests, blog readers, leads, customers, organic intent, HubSpot forms), or reading the experience, experiment, application, or workspace dashboards (probability to be best, potential loss, "Experiment in progress", "Recommended winner", "No clear winner", "Track your goal"). Phrasings: "personalize the hero for LinkedIn visitors", "A/B test this CTA", "which variant won?", "why does my experiment show no conversions?".

Verwandte Skills

affaan-m/uspto-database

USPTO patent and trademark data workflow for official record lookup, PatentSearch queries, TSDR checks, assignment data, and reproducible IP research logs.

community

affaan-m/scholar-evaluation

Structured scholarly-work evaluation for papers, proposals, literature reviews, methods sections, evidence quality, citation support, and research-writing feedback.

community

affaan-m/literature-review

Systematic literature-review workflow for academic, biomedical, technical, and scientific topics, including search planning, source screening, synthesis, citation checks, and evidence logging.

community

affaan-m/everything-claude-code

The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.

community

forrestchang/andrej-karpathy-skills

Agent skill repository discovered by 10x-chat research.

community

langgenius/backend-code-review

Review backend code for quality, security, maintainability, and best practices based on established checklist rules. Use when the user requests a review, analysis, or improvement of backend files (e.g., `.py`) under the `api/` directory. Do NOT use for frontend files (e.g., `.tsx`, `.ts`, `.js`). Supports pending-change review, code snippets review, and file-focused review.

community
← More Recherche & Datenanalyse skills