In CrafterCMS, how can I add ICE to an item in a repeating group?

content-management-system, crafter-cms, java

Solution

In CrafterCMS, if you'd like the features to be editable individually and not as a group, then they need to be defined as individual components.

Take a look at the Editorial Blueprint that comes with version 3.0, it has a list of features that render as components along with ICE tags: https://github.com/craftercms/studio/blob/master/src/main/webapp/repo-bootstrap/global/blueprints/website_editorial/templates/web/pages/home.ftl

Note the section:

<section <@studio.iceAttr iceGroup="features"/>>
    <header class="major">
        <h2>${contentModel.features_title}</h2>
    </header>
    <div class="features" <@studio.componentContainerAttr target="features" objectId=contentModel.objectId/>>
        <#if contentModel.features?? && contentModel.features.item??>
            <#list contentModel.features.item as feature>
                <@renderComponent component=feature />
            </#list>
        </#if>
    </div>
</section>

It essentially iterates over the list of components rendering them individually.

For more detail, you can read up on ICE in the docs: http://docs.craftercms.org/en/3.0/developers/in-context-editing.html

Problem

I have a repeating group of "Features", like this I'd like to be able to make an In Context Editing popup to edit only this single feature. My template's code is like this ``` <#import "/templates/system/common/cstudio-support.ftl" as studio/> <div class="container about_content center p-b-3 wow fadeInUp" data-wow-duration="700ms" <@studio.componentAttr path=contentModel.storeUrl /> > <div class="row"> <#list contentModel.features.item as feature> <div class="col-md-4" <@studio.iceAttr iceGroup="feature" path=contentModel.storeUrl label="Feature" /> > <div class="single_abt single_about m-y-3"> <i class="fa"> <img src="${feature.logo}" /> </i> <h3>${feature.title}</h3> <p>${feature.description!}</p> </div> </div> </#list> </div> </div> ```

Original source