Blocks und Presets

Blocks definieren

{
  "name": "FAQ",
  "max_blocks": 20,
  "settings": [
    { "type": "text", "id": "heading", "label": "Überschrift", "default": "Häufige Fragen" }
  ],
  "blocks": [
    {
      "type": "item",
      "name": "FAQ-Eintrag",
      "settings": [
        { "type": "text",     "id": "question", "label": "Frage" },
        { "type": "richtext", "id": "answer",   "label": "Antwort" }
      ]
    },
    {
      "type": "cta",
      "name": "Button",
      "limit": 1,
      "settings": [
        { "type": "text", "id": "label", "label": "Text", "default": "Kontakt aufnehmen" },
        { "type": "link", "id": "link",  "label": "Link" }
      ]
    }
  ]
}

Blocks rendern

{% if section.blocks.size == 0 %}
  <p class="placeholder">Noch keine Einträge – füge Blocks im Editor hinzu.</p>
{% else %}
  {% for block in section.blocks %}
    {% if block.type == 'item' %}
    <details class="faq__item" id="faq-{{ block.id }}">
      <summary>{{ block.settings.question }}</summary>
      <div class="faq__answer">{{ block.settings.answer }}</div>
    </details>
    {% endif %}
  {% endfor %}
{% endif %}

Verfügbar sind block.id, block.type und block.settings.<id> sowie die Schleifen-Variablen forloop.index, forloop.first, forloop.last usw.

Einzelnen Block herausgreifen

{% assign cta = section.blocks | where: "type", "cta" | first %}
{% if cta %}
  <a href="{{ cta.settings.link | link_href }}" class="btn" {{ cta.editor_attributes }}>
    {{ cta.settings.label }}
  </a>
{% endif %}

Bei gefilterten Blocks und eigenen Schleifen brauchst du {{ block.editor_attributes }} am Container, damit die Felder im Editor inline bearbeitbar bleiben.

Presets

Ohne Preset legt der Editor eine Section mit leeren Einstellungen an. Definiere mindestens ein Preset mit sinnvollen Inhalten – das erste wird automatisch gewählt, bei mehreren erscheint eine Auswahl.

"presets": [
  {
    "name": "FAQ",
    "settings": { "heading": "Häufige Fragen" },
    "blocks": [
      { "type": "item", "settings": { "question": "Wie lange dauert ein Projekt?", "answer": "<p>In der Regel vier bis sechs Wochen.</p>" } },
      { "type": "item", "settings": { "question": "Was kostet eine Website?", "answer": "<p>Das hängt vom Umfang ab.</p>" } }
    ]
  }
]