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

[nagalaxmit28016]

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

[Hemant_arora · Accepted solution]

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 ?

[Teja_G]

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

[VeenaVikraman]

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

[smacdonald2008]

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/

[smacdonald2008]

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