I try to create a modular theme with repeater fields and groups. So i create a block.yaml with my group of fields:

carousel:
  name: Carousel
  description: Carousel
  icon: icon-file-image-o
  fields:
    section_carouselimage:
      label: Image
      type: mediafinder
      mode: image
    section_carouseltitle:
      label: Title
      type: text
    section_carouselsubtitle:
      label: Subtitle
      type: textarea
      size: small

services1:
  name: Services1
  description: Title with Description
  icon: icon-cog
  fields:
    section_services1icon:
      label: Icon
      type: text
    section_services1title:
      label: Title
      type: text
    section_services1subtitle:
      label: Subtitle
      type: textarea
      size: small

, i also create a repeater on layout tha calls this group of fields:

<!-- repeater definition -->
{repeater name="sections" groups="themes/mytheme/meta/blocks.yaml" tab="Blocks" prompt="Add new item" }
    {variable name="_dummy" type="text"}{/variable}
{/repeater}

Everything is working fine and i can render all my fields. Now if i add a group with a repeater in block.yaml like this:

carousel2:
  name: Carousel2
  description: Carousel2
  icon: icon-file-image-o
  fields:
    section_carousel2:
       type: repeater
       prompt: Add new subitem
       form:
          fields:
            section_carouselimage2:
              label: Image2
              type: mediafinder
              mode: image
            section_carouseltitle2:
              label: Title2
              type: text
            section_carouselsubtitle2:
              label: Subtitle2
              type: textarea
              size: small

is working fine on my backend and i can save my fields in index.htm as you can see:

[viewBag]
title = "Home"
url = "/"
layout = "static"
is_hidden = 0
navigation_hidden = 0
sections[0][section_carousel2][1][section_carouselimage2] = "/carousel/bg-1.jpg"
sections[0][section_carousel2][1][section_carouseltitle2] = "Carousel2 Title"
sections[0][section_carousel2][1][section_carouselsubtitle2] = "Carousel2 Subitle"
sections[0][section_carousel2][2][section_carouselimage2] = "/carousel/bg-2.jpg"
sections[0][section_carousel2][2][section_carouseltitle2] = "Carousel2 Title2"
sections[0][section_carousel2][2][section_carouselsubtitle2] = "Carousel2 Subtitle2"
sections[0][_group] = "carousel2"
==

The problem is that i can't find a way to render those fields from repeater. How can i render section_carouselimage2 in my partial for example? What loop to use to render the field from repeater? I really need help here, thanks!

Last updated 7 years ago

This is my index.htm on static-pages folder inside content:

[viewBag]
title = "Home"
url = "/"
layout = "default"
is_hidden = 0
navigation_hidden = 0
sections[2][section_simple][1][section_title] = "Title"
sections[2][section_simple][1][section_teaser] = "Teaser"
sections[2][section_simple][2][section_title] = "Title"
sections[2][section_simple][2][section_teaser] = "Teaser"
sections[2][_group] = "simple"
==

How can i render "section_title" and "section teaser" and show them on my page?

I guess it should be your layout who should render those fields ?

Has this been solved yet? I am struggling with the same issue.

Hi,

i don't know if it can help you but i have done a similar thing for my website

In my page-layout i have declared a variable like this :

{variable name="sections" type="repeater" prompt="Add another section" tab="Sections" placement="secondary" groups="$/autor/plugin/repeater_fields.yaml"}{/variable}

then i have filled my repeater_fields.yaml with all components i need to play with

title:
    name: Titre
    description: Champs texte
    icon: icon-header
    fields:
        title:
            label: Titre principal
            type: text

subtitle:
    name: Sous-titre
    description: Champs texte
    icon: icon-italic
    fields:
        subtitle:
            label: "Sous-titre (phrase d'accroche)"
            type: text

content:
    name: Contenu textuel
    description: Textarea
    icon: icon-paragraph
    fields:
        text_area:
            label: "Contenu"
            type: richeditor
            toolbarButtons: bold|italic|underline|strikeThrough|subscript|superscript|fontFamily|fontSize|color|emoticons|inlineStyle|paragraphStyle|paragraphFormat|align|formatOL|formatUL|outdent|indent|quote|insertHR|insertLink|insertTable|undo|redo|clearFormatting|selectAll|html|fullscreen
            size: huge
            span: full
        text_area_position:
            label: "Position du contenu sur la page"
            type: radio
            span: left
            default: none
            options:
                none: [Aucune, Le contenu prendra toute la largeur de la page.]
                left: [Aligné à gauche, Le contenu sera placé à gauche des autres éléments.]
                right: [Aligné à droite, Le contenu sera placé à droite des autres éléments.]
        text_area_image:
            label: "Affiche une image liée"
            commentAbove: "Si vous souhaitez ajouté une image à ce contenu, merci de l'ajouter ici"
            type: mediafinder
            mode: image
            span: right
            imageWidth: 40%

....

and in my page-layout i use a foreach with conditions to display content by their _group ID like this

{% for section in sections %}
                        {% if section._group == "title" %}
                            <h2 class="section__title">{{section.title}}</h2>
                        {% endif %}
                        {% if section._group == "subtitle" %}
                            <h3 class="section__subtitle dark clear bg-white text-libre">{{section.subtitle}}</h3>     
                        {% endif %}
                        {% if section._group == "content" %}
                            <div class="section__content" >
                                <div class="section__content__paragraph  {%if section.text_area_position != "none"%}flc-{{section.text_area_position}}{%endif%}">{{section.text_area|raw}}</div>
                                {%if section.text_area_image != "" %}<img class="section__content__image" src="{{ section.text_area_image|media }}" />{%endif%}

                            </div>
                        {% endif %}
....
{%endfor%}

and all is displayed like i want (with a little bit of CSS of course :p )

hope it can help you

cya

Last updated 6 years ago