Is it possible to customize the content fragment input UI in AEM? | Community
Skip to main content
Level 4
September 15, 2022

Is it possible to customize the content fragment input UI in AEM?

  • September 15, 2022
  • 1 reply
  • 870 views

Hi Team, I would want to customize a JSON editor to a custom UI input component. I want to have a custom UI to facilitate adding json data (in form of tables). I have written the same component in React and wanted to know if we can actually customize or extend JSON editor UI to improve user experience?

Above is the screenshot what I want to show to the content authors to input JSON data.

 

Current JSON input of AEM looks like this:


 
Updating Media

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

1 reply

SantoshSai
Community Advisor
Community Advisor
September 15, 2022

Hi @spidey1405 ,

Yes that it possible by implementing/registering widget through Javascript/Jsp Script. One good example you may have a look at here: https://www.youtube.com/watch?v=H_paM5naWpg

Hope that helps!

Regards,

Santosh

Santosh Sai
Level 4
September 16, 2022

Hi Santosh, thanks for your response. So the widgets can only be created using jsps right? Also if we want to load this to AEM we need to do `mvn clean install -PautoInstallSinglePackage` right? And would this then automatically appear in my content fragment models? I don't see any details for those.

 

Additionally when I clone the repository and try to deploy this to my local aem instance, I get this:

 

```

ERROR] package in.shabhushan.catalog.services
[ERROR] ^
[ERROR] Groovy:Internal groovy compiler error.
[ERROR]
[ERROR] /Users/ssahil1/Downloads/utils/2022/sep/aem-local/aem-local/custom-content-fragment/core/src/main/java/in/shabhushan/catalog/services/impl/SolrCrawlerServiceImpl.groovy:[1,1] 719. ERROR in /Users/ssahil1/Downloads/utils/2022/sep/aem-local/aem-local/custom-content-fragment/core/src/main/java/in/shabhushan/catalog/services/impl/SolrCrawlerServiceImpl.groovy (at line 1)
[ERROR] package in.shabhushan.catalog.services.impl
[ERROR] ^
[ERROR] Groovy:Internal groovy compiler error.
[ERROR]
[ERROR] /Users/ssahil1/Downloads/utils/2022/sep/aem-local/aem-local/custom-content-fragment/core/src/main/java/in/shabhushan/catalog/signin/SignInUtil.groovy:[14,7] 720. ERROR in /Users/ssahil1/Downloads/utils/2022/sep/aem-local/aem-local/custom-content-fragment/core/src/main/java/in/shabhushan/catalog/signin/SignInUtil.groovy (at line 14)
[ERROR] class SignInUtil extends WCMUsePojo{
[ERROR] ^^^^^^^^^^
[ERROR] The hierarchy of the type SignInUtil is inconsistent
[ERROR]
[ERROR] /Users/ssahil1/Downloads/utils/2022/sep/aem-local/aem-local/custom-content-fragment/core/src/main/java/in/shabhushan/catalog/services/SampleConfigurationFactory.groovy:[1,1] 721. ERROR in /Users/ssahil1/Downloads/utils/2022/sep/aem-local/aem-local/custom-content-fragment/core/src/main/java/in/shabhushan/catalog/services/SampleConfigurationFactory.groovy (at line 1)
[ERROR] package in.shabhushan.catalog.services
[ERROR] ^
[ERROR] Groovy:Internal groovy compiler error.
[ERROR]
[ERROR] /Users/ssahil1/Downloads/utils/2022/sep/aem-local/aem-local/custom-content-fragment/core/src/main/java/in/shabhushan/catalog/signin/constants/SigninConstants.groovy:[9,7] 722. ERROR in /Users/ssahil1/Downloads/utils/2022/sep/aem-local/aem-local/custom-content-fragment/core/src/main/java/in/shabhushan/catalog/signin/constants/SigninConstants.groovy (at line 9)
[ERROR] class SigninConstants extends WCMUsePojo {
[ERROR] ^^^^^^^^^^^^^^^
[ERROR] The hierarchy of the type SigninConstants is inconsistent
[ERROR]
[ERROR] Found 722 errors and 0 warnings.
[ERROR] -> [Help 1]
[ERROR]
[ERROR] To see the full stack trace of the errors, re-run Maven with the -e switch.
[ERROR] Re-run Maven using the -X switch to enable full debug logging.
[ERROR]
[ERROR] For more information about the errors and possible solutions, please read the following articles:
[ERROR] [Help 1] http://cwiki.apache.org/confluence/display/MAVEN/MojoFailureException
[ERROR]

```

 

I am using AEM 6.5, kindly let me know how can I sort this?