# Component Configuration

**URL:** <https://community.bloomreach.com/t/component-configuration/3823>\
**Category:** Experience Manager (PaaS/OnPrem)\
**Created:** [May 3, 2023, 6:50pm UTC](https://community.bloomreach.com/t/component-configuration/3823 "2023-05-03T18:50:24Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![andorian](https://yyz1.discourse-cdn.com/flex027/user_avatar/community.bloomreach.com/andorian/32/1557_2.png) [@andorian](https://community.bloomreach.com/u/andorian)\
**Post date:** [May 3, 2023, 6:50pm UTC](https://community.bloomreach.com/t/component-configuration/3823/1 "2023-05-03T18:50:24Z")

</div>

Dear community,

I hope you are well.

Currently Im follow up the below documentation  
ref:

> **[Annotate Channel or Component Configuration Parameters with UI Directives -...](https://xmdocumentation.bloomreach.com/13/library/concepts/template-composer/annotate-channel-or-component-configuration.html)**
>
> The fast and flexible on-premise or PaaS headless CMS

so I creatte  
1.  
@FieldGroupList({  
@FieldGroup(titleKey = “address”, value = { “street”, “city” }),  
@FieldGroup(titleKey = “layout”, value = { “size” })  
})  
public interface MyComponentParamsInfo {

```
@Parameter(name = "street")
String getStreet();
@Parameter(name = "city")
String getCity();
@Parameter(name = "size", defaultValue="medium")
@DropDownList({"small", "medium", "large"})
String getSize();

```

}

1. I add  
definitions:  
config:  
/hippo:configuration/hippo:translations/hippo:hst/componentparameters/org:  
jcr:primaryType: hipposys:resourcebundles  
/example:  
jcr:primaryType: hipposys:resourcebundles  
/components:  
jcr:primaryType: hipposys:resourcebundles  
/MyComponentParamsInfo:  
jcr:primaryType: hipposys:resourcebundles  
/en:  
jcr:primaryType: hipposys:resourcebundle  
address: Address Information  
​ ​​​​​​ street: Street  
city: City  
layout: Layout Settings  
size: Size  
size#small: Small  
size#medium: Medium  
size#large: Large

so when i go to the cms channel editor and drag mycomponent, on the right side i fill in the properties, should i see that fill in values in the component???

 ![image](https://canada1.discourse-cdn.com/flex027/uploads/bloomreach1/original/2X/1/19e7904c12b1b471ec9af30f713877460d08adf6.png)

Aslo i create a ftl  
\<#-- @ftlvariable name=“mycomponent” type=“org.example.bloomreach.beans.MyComponent” →

\<#if mycomponent?has\_content\>

  

${mycomponent.street}

  
  

${mycomponent.city}

  

${mycomponent.size}

  

  
\<#elseif isPreview\>

No info has been select yet!

Thansk in advance

---

<div class="post-metadata">

**Author:** ![Nicholas\_Pavao](https://yyz1.discourse-cdn.com/flex027/user_avatar/community.bloomreach.com/nicholas_pavao/32/1370_2.png) [@Nicholas\_Pavao](https://community.bloomreach.com/u/Nicholas_Pavao)\
**Post date:** [May 3, 2023, 6:53pm UTC](https://community.bloomreach.com/t/component-configuration/3823/2 "2023-05-03T18:53:26Z")

</div>

Did you rebuild your jar files after making the Java changes?

---

<div class="post-metadata">

**Author:** ![andorian](https://yyz1.discourse-cdn.com/flex027/user_avatar/community.bloomreach.com/andorian/32/1557_2.png) [@andorian](https://community.bloomreach.com/u/andorian)\
**Post date:** [May 3, 2023, 6:54pm UTC](https://community.bloomreach.com/t/component-configuration/3823/3 "2023-05-03T18:54:39Z")

</div>

yes, if you mean mvn clean install, remove the storage and run cargo again

---

<div class="post-metadata">

**Author:** ![Nicholas\_Pavao](https://yyz1.discourse-cdn.com/flex027/user_avatar/community.bloomreach.com/nicholas_pavao/32/1370_2.png) [@Nicholas\_Pavao](https://community.bloomreach.com/u/Nicholas_Pavao)\
**Post date:** [May 3, 2023, 7:10pm UTC](https://community.bloomreach.com/t/component-configuration/3823/4 "2023-05-03T19:10:17Z")

</div>

Yes, that’s what I was referring to. It appears you have the properties showing up in the CMS and filled them in on the component. Your issue is retrieving it on the frontend. What happens when you simply try to render “mycomponent” in the Freemarker? Have you actually passed that variable to the frontend from the “org.example.bloomreach.beans.MyComponent” class?

---

<div class="post-metadata">

**Author:** ![machak](https://yyz1.discourse-cdn.com/flex027/user_avatar/community.bloomreach.com/machak/32/1298_2.png) [@machak](https://community.bloomreach.com/u/machak)\
**Post date:** [May 3, 2023, 7:31pm UTC](https://community.bloomreach.com/t/component-configuration/3823/5 "2023-05-03T19:31:12Z")

</div>

If you dropped component previously or configured it with a different class within catalog, you might need to delete it and add it again.  
Also check the log files if there are any errors  
Also, you can use mvn clean package instead of installing the artifacts…

---

<div class="post-metadata">

**Author:** ![andorian](https://yyz1.discourse-cdn.com/flex027/user_avatar/community.bloomreach.com/andorian/32/1557_2.png) [@andorian](https://community.bloomreach.com/u/andorian)\
**Post date:** [May 9, 2023, 7:20pm UTC](https://community.bloomreach.com/t/component-configuration/3823/6 "2023-05-09T19:20:49Z")

</div>

Dear Nicholas and Machak,

Thank you for your respond, so far I tried your two advice but sill I cannot see the properties filled in the respond.

Please find below my implementation:

##################################

cnd:

[bloomreach:mycomponent] \> bloomreach:basedocument, hippostd:relaxed, hippotranslation:translated  
orderable

##################################

catalog.yaml  
definitions:  
config:  
/hst:hst/hst:configurations/bloomreach/hst:catalog:  
jcr:primaryType: hst:catalog  
/bloomreach-catalog:  
jcr:primaryType: hst:containeritempackage  
/mycomponent:  
jcr:primaryType: hst:containeritemcomponent  
hst:componentclassname: org.example.bloomreach.components.page.MyComponentPage

```
      hst:iconpath: img/catalog/plugin/textandtitle/textandpicture-icon.png
      hst:label: My Component
      hst:template: components.mycomponent

```

##################################

MyComponent.java  
@Node(jcrType = MyComponent.JCR\_TYPE)  
public class MyComponent extends BaseDocument {

```
//private static final Logger LOG = LoggerFactory.getLogger(TextWithTitle.class);

```

public static final String JCR\_TYPE = “bloomreach:mycomponent”;

```
private static final String STREET = "bloomreach:street";
private static final String CITY = "bloomreach:city";
private static final String SIZE = "bloomreach:size";

public static String getJcrType() {
    return JCR_TYPE;
}

  public String getStreet() {
    return getSingleProperty(STREET, StringUtils.EMPTY);
}
public String getCity() { return getSingleProperty(CITY, StringUtils.EMPTY);}
public String getSize() { return getSingleProperty(SIZE, StringUtils.EMPTY);
}

```

}

##################################  
MyComponentPage.java

@ParametersInfo(type = MyComponentParamsInfo.class)  
public class MyComponentPage extends BaseHstComponent {  
private static final Logger LOG = LoggerFactory.getLogger(MyComponent.class);

```
 private static final String ATTR_MYCOMPONENT_DOCUMENT = "mycomponent";

@Override
public void doBeforeRender(HstRequest request, HstResponse response) throws HstComponentException {
    final MyComponentParamsInfo info = getComponentParametersInfo(request);
    final HippoBean siteContentBaseBean = request.getRequestContext().getSiteContentBaseBean();

    final HippoBean scope = request.getRequestContext().getSiteContentBaseBean().getBean(ATTR_MYCOMPONENT_DOCUMENT);

    try {
        final HstQuery hstQuery = HstQueryBuilder.create(scope).ofTypes(MyComponent.class).build();

        final HstQueryResult result = hstQuery.execute();
        request.setAttribute(ATTR_MYCOMPONENT_DOCUMENT, result.getHippoBeans());
    }catch (QueryException queryException) {
        LOG.warn("Exception occurred during creation or execution of HstQuery.", queryException);
    }

}

```

}

##################################

MyComponentParamsInfo.java

@FieldGroupList({  
@FieldGroup(titleKey = “address”, value = { “street”, “city” }),  
@FieldGroup(titleKey = “layout”, value = { “size” })  
})  
public interface MyComponentParamsInfo {  
@Parameter( name = “street”,  
displayName = “Street”,  
required = true)  
String getStreet();

```
@Parameter( name = "city",
            displayName = "City",
            required = false)
String getCity();

@Parameter(name = "size", defaultValue="medium")
@DropDownList({"small", "medium", "large"})
String getSize();

```

}

##################################

mycomponent.ftl

\<#-- @ftlvariable name=“mycomponent” type=“org.example.bloomreach.beans.MyComponent” →   
\<#if mycomponent?has\_content\>

  

${mycomponent.street}

  
  

${mycomponent.city}

  

${mycomponent.size}

  

  
\<#elseif isPreview\>

No info has been select yet!

##################################

template

definitions:  
config:  
/hst:hst/hst:configurations/bloomreach/hst:templates:  
/components.mycomponent:  
jcr:primaryType: hst:template  
hst:renderpath: webfile:/freemarker/bloomreach/catalog/mycomponent/mycomponent.ftl

##################################

cms

 ![image](https://canada1.discourse-cdn.com/flex027/uploads/bloomreach1/original/2X/2/2c052506cc9776afd9aa84676bef3faabb115dc0.png)

##################################

localhost  
Does not show the fullfill property

 ![image](https://canada1.discourse-cdn.com/flex027/uploads/bloomreach1/original/2X/c/cc3a36dafbf265c253c80bf86b55e50307181378.png)

Thanks in advance

---

<div class="post-metadata">

**Author:** ![andorian](https://yyz1.discourse-cdn.com/flex027/user_avatar/community.bloomreach.com/andorian/32/1557_2.png) [@andorian](https://community.bloomreach.com/u/andorian)\
**Post date:** [May 11, 2023, 8:42am UTC](https://community.bloomreach.com/t/component-configuration/3823/7 "2023-05-11T08:42:58Z")

</div>

Dear community,

is it any update on this,

Thanks in advance