Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

Experience fragment Localization issue

Avatar

Level 3

I am working on a project where experience fragments and pages are being translated. I am using an experience fragment in a page, when I got into a the language copy (translated ja_jp page) it not pulling the translated experience fragment. It's due to the folder structure of experience fragment which I can't change now. Is there any way to make translated experience fragment to show up in the page? 

When I copy the experience fragment at "content/experience-fragments/alexac/ja_jp/myef/master" to "content/experience-fragments/alexac/jp/ja_jp/myef/master". I can see the translated fragment in the page as expected. But unfortunately I can't move the content now.

 

Translated page path (example only): https://tester.com/content/alexac/jp/ja_jp/products/mypage.html

Experience fragment path: 

 

Localization documentation I was referring to:

https://experienceleague.adobe.com/docs/experience-manager-core-components/using/components/experien...

 

I would appreciate any advice from the community.

1 Accepted Solution

Avatar

Correct answer by
Level 3

I ended up creating a custom model class. As we have the path for Experience fragment in JCR of the page I modified the path as my custom requirement. Updated the experience-fragment's htl code used my model.

Just updated data-sly-resource@path value. 

Default Experience fragment code below for reference:

<!--/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ~ Copyright 2021 Adobe
  ~
  ~ Licensed under the Apache License, Version 2.0 (the "License");
  ~ you may not use this file except in compliance with the License.
  ~ You may obtain a copy of the License at
  ~
  ~     http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
<div data-sly-use.fragment="com.adobe.cq.wcm.core.components.models.ExperienceFragment"
     data-sly-use.template="core/wcm/components/commons/v1/templates.html"
     data-sly-test=${fragment.configured}
     data-sly-set.selector="content.${request.requestPathInfo.selectorString}"
     data-sly-resource="${@path=fragment.localizedFragmentVariationPath, selectors=selector, wcmmode='disabled'}"
     id="${fragment.id}"
     class="cmp-experiencefragment cmp-experiencefragment--${fragment.name}">
</div>
<sly data-sly-call="${template.placeholder @ isEmpty=!fragment.configured, classAppend='cmp-dd-experiencefragment'}"></sly>

 

View solution in original post

2 Replies

Avatar

Community Advisor

Hi,

 

You can write custom class which implements ExperienceFragment and in initModel() update the XF path as per your requirement.

Avatar

Correct answer by
Level 3

I ended up creating a custom model class. As we have the path for Experience fragment in JCR of the page I modified the path as my custom requirement. Updated the experience-fragment's htl code used my model.

Just updated data-sly-resource@path value. 

Default Experience fragment code below for reference:

<!--/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ~ Copyright 2021 Adobe
  ~
  ~ Licensed under the Apache License, Version 2.0 (the "License");
  ~ you may not use this file except in compliance with the License.
  ~ You may obtain a copy of the License at
  ~
  ~     http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/-->
<div data-sly-use.fragment="com.adobe.cq.wcm.core.components.models.ExperienceFragment"
     data-sly-use.template="core/wcm/components/commons/v1/templates.html"
     data-sly-test=${fragment.configured}
     data-sly-set.selector="content.${request.requestPathInfo.selectorString}"
     data-sly-resource="${@path=fragment.localizedFragmentVariationPath, selectors=selector, wcmmode='disabled'}"
     id="${fragment.id}"
     class="cmp-experiencefragment cmp-experiencefragment--${fragment.name}">
</div>
<sly data-sly-call="${template.placeholder @ isEmpty=!fragment.configured, classAppend='cmp-dd-experiencefragment'}"></sly>