BoldMinded Docs
  • Overview
  • Advanced Categories
    • Docs
      • Installation
      • Requirements
      • Setup & Configuration
        • Hidden Config Options
        • Multi-Site Manager
      • Template Tags
      • FAQs
  • Ansel
    • Docs
      • Installation
      • Upgrading
      • Requirements
      • Settings
      • Usage
        • Channel:Form
      • Troubleshooting
      • Template Tags
    • FAQs
  • Bloqs
    • Docs
      • Why Bloqs?
      • Features
        • Add Bloq Menu
        • Nesting
        • Cloning
        • Drafts
        • Bloq Usage
        • Deprecated Bloqs
        • Caching
        • Profiling
        • Bloq Components
        • Bloq Groups
      • Installation
      • Requirements & Compatibility
      • Setup & Configuration
        • Hidden Config Options
      • Creating Bloqs
      • Template Tags
        • Twig/Blade
        • Examples
      • Context Variables
      • Add-on Developers
    • FAQs
  • Carson
    • Docs
      • Installation
      • Requirements
      • Fields
        • Omni
          • Hidden Config
        • Assistant
        • SEO
      • Troubleshooting
  • Custom System Messages
    • Docs
      • Installation
      • Requirements
      • Variables
      • Template Tags
  • DataGrab
    • Docs
      • Installation & Upgrading
      • Requirements
      • Troubleshooting
      • Configuring Imports
      • Running Imports
      • Automatic Imports
        • Importing with cron
        • Importing with cron (Deprecated)
      • Endpoints
      • Configuration Options
        • Config File Options
        • Increasing PHP memory limit
      • Import Types
        • CSV
          • Importing into Grid or Matrix field
        • JSON
          • Example file
        • WordPress
        • XML
          • Example file
        • Creating your own import type
      • Assigning Authors
      • Field Types
        • Assets
        • Ansel
        • Bloqs
        • Calendar
        • Channel Images
        • Date
        • File
        • File Grid
        • Fluid
        • Grid
        • Low Events
        • Relationships
        • Simple Grids & Tables
        • Tag & Tagger
        • Matrix (Deprecated)
        • Creating your own fieldtype
      • Publisher
      • Version 5.0
      • Version 6.0
    • FAQs
  • Feature Flags
    • Docs
      • Installation & Upgrading
      • Requirements
      • Configuration
      • Template Tags
      • A/B Testing
    • FAQs
  • Fluidity
    • Docs
      • Installation & Upgrading
      • Requirements
      • Configuration
      • Demos
    • FAQs
  • Logit
    • Docs
      • Installation
      • Requirements
      • Configuration
    • FAQs
  • Publisher
    • Docs
      • Installation
      • Requirements
      • Issues & Tips
      • Languages
      • Template Tags
        • Forms
        • Email Notification Templates
        • Channel:Form
        • Twig
      • URL Translations
      • Auto Translations
      • Diffs
      • Drafts
      • Categories
      • Phrases
      • Persistence
      • Performance
      • Add-ons
        • First Party
        • Third Party
      • Hidden Config
      • Extending Publisher
    • FAQs
  • Reading Time PRo
    • Docs
      • Installation
      • Requirements
      • Configuration
      • Template Tags
  • Reel
    • Docs
      • Installation
      • Requirements
      • Settings
      • Field Tags
    • FAQs
  • Simple Grids & Tables
    • Docs
      • Installation
      • Requirements
      • Template Tags
      • CSV File Imports
      • Field Settings
      • GraphQL
      • Advanced Configuration (deprecated)
    • FAQs
  • Sitemap
    • Docs
      • Installation
      • Requirements
      • Configuration & Usage
    • FAQs
  • Snaptcha
    • Docs
      • Installation
      • Requirements
      • Configuration
      • Template Tags
      • Developers
    • FAQs
  • Speedy
    • Docs
      • Installation & Updating
      • Requirements
      • Configuration
      • Template Tags
      • Static Caching
        • Real World Example
      • Frontedit Support
      • Control Panel
      • Migrating from CE Cache
      • Diagnostics
      • CLI Commands
      • Cloudflare Support (Reverse Proxy Purging)
    • FAQs
  • Trek (unreleased)
    • Docs
      • Configuration
    • FAQs
  • Queue
    • Docs
Powered by GitBook
On this page

Was this helpful?

  1. Bloqs
  2. Docs
  3. Template Tags

Twig/Blade

The following is a basic example of how to render a Bloqs field with nested bloqs using Twig. If you're using Blade, the concepts are identical, just slightly different syntax for Blade.

Note the include statements are passing an array of possible template names to include in the brackets. If the first template file is not found, it will skip it and attempt to render the next one. For example, if you have a bloq named "summary" and you want that bloq to render entirely different HTML, just create a template named _bloq_summary.html All other bloqs will render in the _bloq.html template. These template names are completely arbitrary and you can choose any names you want. In this example I have a coilpack.group folder with the _bloq.html.twig and _atom.html.twig templates inside.

{# entry.html.twig #}

{% for entry in exp.channel.entries.parameters(
    {'channel': 'pages', 'entry_id': '4'}
) %}
    <h1>{{ entry.title }}</h1>

    {% for bloq in entry.bloqs %}
        {% include [
            ('ee::coilpack._bloq_' ~ bloq.getDefinition().getShortName()),
            'ee::coilpack._bloq'
        ] with {
            'bloq': bloq
        } %}
    {% endfor %}

{% else %}
    <span>No blog entries</span>
{% endfor %}
{# _bloq.html.twig #}

{% set bloqName = bloq.getDefinition().getShortName() %}
{% set isComponent = bloq.getDefinition().isComponent() %}

<div class="{% if isComponent %}component{% else %}basic{% endif %}">
    {% for atom in bloq.getAtoms() %}
        {% include [
            ('ee::coilpack._atom_' ~ atom.getDefinition().getShortName()),
            'ee::coilpack._atom'
        ] with {
            'atom': atom
        } %}
    {% endfor %}

    {% for child in bloq.getChildren() %}
        {% include [
            ('ee::coilpack._bloq_' ~ child.getDefinition().getShortName()),
            'ee::coilpack._bloq'
        ] with {
            'bloq': child
        } %}
    {% endfor %}
</div>
{# _atom.html.twig #}

{# If your atom contains HTML, use the raw modifier, e.g. {{ atom | raw }} #}
{{ atom }}

If in this scenario there was an atom with the short name of content_with_image, and a template file named _atom_content_with_image.html.twig existed, it would be loaded instead of the _atom.html.twig template.

Twig is extremly flexible and there are probably a number of ways to approach building out a Bloqs field. This is a basic example of how to use an include to render a deeply nested Bloqs field.

Once you have a bloq variable you can access it's atoms and atom values directly via the dot notation:

{% for entry in exp.channel.entries.parameters(
    {'channel': 'pages', 'entry_id': '4'}
) %}
    <h1>{{ entry.title }}</h1>

    {% for bloq in entry.bloqs %}
        {{ bloq.heading }}
        {{ bloq.summary }}
    {% endfor %}
{% endfor %}

Relationships

Accessing relationship field data in Twig or Blade is the same as accessing any other array.

{% for entry in exp.channel.entries.parameters(
    {'channel': 'pages', 'entry_id': '4'}
) %}
    <h1>{{ entry.title }}</h1>

    {% for bloq in entry.bloqs %}
        {% for relationship in bloq.relationship_field %}
            {{ relationship.title %}
        {% endfor %}
    {% endfor %}
{% endfor %}

Last updated 4 days ago

Was this helpful?