Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

Can we create a layout to get the component looks like in the given image

Avatar

Level 2

Can we create a layout which holds 2 or 3 components with text components with different stylings. Please see the attachement and suggest me the apporoach. Here 5 items section would be a single component and severe weather is another component and rest of the payment section would be another component. I want to create a layout which holds all the 3 components abouve mentioned. Pleas suggest

1425302_pastedImage_0.png

1 Accepted Solution

Avatar

Correct answer by
Level 8

I believe this all can be done in one component or if you need separate components then you can always drag drop them to a parsys in the template/page component. Can you please explain the exact requirement and what issue are you facing ?

View solution in original post

5 Replies

Avatar

Correct answer by
Level 8

I believe this all can be done in one component or if you need separate components then you can always drag drop them to a parsys in the template/page component. Can you please explain the exact requirement and what issue are you facing ?

Avatar

Level 4

You can also include all the three components in a single component. Stylings wont cause any issue if they are handled properly.

Avatar

Community Advisor

Hi Nagalakshmi

      Get the mock HTMLs done for the component / page , this will make your life easy as far as the look and feel is concerned. AFAIU , this should be a dynamic content which will be pulling some notifications and displaying to the user , and it definitely is not something which is authored by the content editors. Gather your requirements , and write the logic to bring the information and don't worry about the rendering of the HTML, leave that job to the people who are best at doing that.

Thanks

Veena

Avatar

Level 10

Any front end component can look like this very easily via the use of JQuery. There are many JQuery plug-ins that can achieve this look. https://jqueryui.com/accordion/

Avatar

Level 10

Aslo the outer layout component can be a Layout container - as discussed in this article -- Creating an Adobe Experience Manager project using Lazybones

Or you can build your own custom GRID layout that can hold components too. See this article -- Creating a custom Touch UI Grid Component for Adobe Experience Manager