Different Component for same section for Desktop and Mobile | Community
Skip to main content
P
peterw13024062
Level 2
January 9, 2018
Question

Different Component for same section for Desktop and Mobile

  • January 9, 2018
  • 2 replies
  • 2062 views

Hello AEM community,

Our frontend team has created Responsive pages for Desktop, Mobile and Tablet and now as an AEM developer we have a requirement to create components where one of requirement is to display a section on page  and that section should be displayed as: 

- paragraph on Desktop page

-  accordion on mobile

- and in Tabular format on Tablet

I am really looking for a solution as how this can be achieved in AEM.

Please note:  Content will be same for this section on desktop ,mobile and tablet and any content change for one device should be reflected for other two.

Thank you so much in advance.

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

2 replies

smacdonald2008
smacdonald2008
Level 10
January 9, 2018

Response Layout renders HTML based on the device.

Responsive Layout

Components are added to the page during edit mode. Response Layout does not let you change components (added during Edit mode) based on the device.

I am looking to see if such a requirement has been addressed by internal AEM people.

smacdonald2008
smacdonald2008
Level 10
January 9, 2018

We got a reply from an AEM Expert:

AEM’s Responsive Grid + Template Editor allows you to show/hide components based on the viewport size; so they could achieve this by placing 3 components and only showing the appropriate per viewport.

Alternatively, to have a single component, they would need to implement a custom component that displays different views based on the viewport using CSS media selectors (I’d imagine).

Terms & ConditionsAccessibility statement

Loading footer...