Expand my Community achievements bar.

SOLVED

How to do this in AEM

Avatar

Level 2

 Hello All, I am new to AEM development 


I want to implement some components in AEM as shown in the video and snapshot 

smitakagwade_0-1629098383235.png

This component should be reused on other page as well ,


https://www.awesomescreenshot.com/video/4856958?key=8b79f087e528303d996b1400c2d00a47

 

Can anyone please help me how can I acheive this 
Thank you.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @smitakagwade 

 

You can build one component which can be used to generate the individual tiles and each of the tile can be authored as a separate experience fragment.

Let's say you build one component called "tile".

Create XF1 -> author "tile" with one content.

Create XF2 -> author "tile" with another content.

so on...

 

Build a container component which can be multifield driven (the above XF paths will be configured) and can pull multiple tiles and show it based on the filter(which can be driven using JS). This container can be authored on separate XF i.e., with Service XF, Industry XF and technology XF.

 

Now build one Tab component and configure the above XFs i.e., Service Tab with Service XF, Industry Tab with Industry XF and Technology Tab with Technology XF. If it can grow more in future then make it as a multifield.

 

Thanks!

View solution in original post

3 Replies

Avatar

Correct answer by
Community Advisor

Hi @smitakagwade 

 

You can build one component which can be used to generate the individual tiles and each of the tile can be authored as a separate experience fragment.

Let's say you build one component called "tile".

Create XF1 -> author "tile" with one content.

Create XF2 -> author "tile" with another content.

so on...

 

Build a container component which can be multifield driven (the above XF paths will be configured) and can pull multiple tiles and show it based on the filter(which can be driven using JS). This container can be authored on separate XF i.e., with Service XF, Industry XF and technology XF.

 

Now build one Tab component and configure the above XFs i.e., Service Tab with Service XF, Industry Tab with Industry XF and Technology Tab with Technology XF. If it can grow more in future then make it as a multifield.

 

Thanks!

Avatar

Level 2

Hello @Asutosh_Jena_ ,

Thank you so much for your quick reply.
You said I need to build components  that meas
 I need to build custom components for this or I can use available component?

Avatar

Community Advisor

Hi @smitakagwade 

There are few OOTB components available as part of the Core Component group.

https://www.aemcomponents.dev/

 

You can refer those and see if you can reuse anything and if it cannot be used then you need to build the custom component.

 

Thanks!