Content rendering

Learn how to fetch and render content for your slots.

This guide provides practical examples of how to use the Symfony SDK to fetch and render a Slot in your application.

Basic usage

Let’s say you have a slot called home-hero for the hero section of your homepage.

Inject the Plug service into your controller and call fetchContent with the slot ID. It returns a FetchResponse with the resolved content:

src/Controller/HomeController.php
12345678910111213141516171819
<?php
namespace App\Controller;
use Croct\Plug\Plug;use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;use Symfony\Component\HttpFoundation\Response;use Symfony\Component\Routing\Attribute\Route;
final class HomeController extends AbstractController{    #[Route('/', name: 'home')]    public function index(Plug $croct): Response    {        $hero = $croct->fetchContent('home-hero')->getContent();
        return $this->render('home/index.html.twig', ['hero' => $hero]);    }}

The actual structure of the content depends on the schema of the slot, but here is an example:

Content response
123456789101112
{"title": "The best personalization platform for developers","subtitle": "Best-in-class developer experience and enterprise-grade reliability.","image": {  "url": "https://cdn.croct.io/devs.png",  "alt": "A screenshot of an editor showing a code snippet."},"button": {  "label": "See docs",  "url": "https://docs.croct.com"}}

You can then render the content in your Twig template, which escapes output automatically:

templates/home/index.html.twig
<section class="hero">    <h1>{{ hero.title }}</h1>    <p class="subtitle">{{ hero.subtitle }}</p>    <img src="{{ hero.image.url }}" alt="{{ hero.image.alt }}">    <a href="{{ hero.button.url }}">{{ hero.button.label }}</a></section>

Typing

The PHPStan and Psalm plugins shipped with the SDK infer the exact shape of every slot, so fetchContent is typed with no manual annotations:

$content = $croct->fetchContent('home-banner')->getContent();$title = $content['title']; // string

The CLI writes these definitions to a slots.stub file whenever you add or update slots, and the plugins load it automatically.

Fault tolerance

You should always provide a fallback content to make your application resilient to unexpected errors, downtime, and network failures.

Pass a fallback through the withFallback option, and the SDK returns it whenever the content cannot be fetched:

use Croct\Plug\FetchOptions;
$options = FetchOptions::defaults()->withFallback([    'title' => 'Welcome to Croct!',    'subtitle' => 'The easiest way to personalize your application.',]);$hero = $croct->fetchContent('home-hero', $options)->getContent();

Without a fallback, a failed request throws a CroctException, which you can catch to handle the error yourself.

Version control

You can lock a specific slot version to keep the content structure aligned with your application’s expectations. This gives your team the freedom to evolve the structure over time without the risk of breaking things.

Specify the version by passing a versioned ID in the form <id>@<version>. For example, passing home-hero@2 fetches the content for the home-hero slot in version 2. Not specifying a version is the same as passing home-hero@latest, which loads the latest content:

$content = $croct->fetchContent('home-hero@2')->getContent();

For more information, see Slot versioning.

Localization

The bundle detects the visitor locale from the request automatically, so content is returned in the matching locale out of the box.

To request a specific locale instead, use the withPreferredLocale option:

use Croct\Plug\FetchOptions;
$options = FetchOptions::defaults()->withPreferredLocale('en-ca');$hero = $croct->fetchContent('home-hero', $options)->getContent();

By default, if the content is not available in the preferred locale, it is returned in the default locale of your workspace.

Context variables

Sometimes you need to provide additional information to personalize or segment your users.

For example, if you are working on a SaaS application, you may want to personalize the content based on the subscription plan, quota usage, features, or any other application-specific information. You can achieve this by passing any relevant information through the withAttribute option:

use Croct\Plug\FetchOptions;
$options = FetchOptions::defaults()->withAttribute('plan', 'premium');$content = $croct->fetchContent('upgrade-banner', $options)->getContent();

These values are then accessible as custom attributes in the context variable:

context's plan is "premium"

Keep in mind that the context has some constraints on the number of attributes and levels of nesting. For more information, see the withAttribute documentation.

Caching

The bundle marks personalized responses as private automatically, so they are never stored in a shared cache. If you run a CDN or reverse proxy in front of your application, see Caching for guidance.