Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

Retrieving the user-agent for Tablet

v1101
Level 5
Level 5

Hello Community - We are detecting the user-agent(Desktop/Mobile/Tablet) using WCMUsePojo and based on the user-agent, we are showing the appropriate content in HTL. It is working only for Mobile but when we use "Tablet", it is not working. Can you let me how to retrieve it for tablet?

 

public void activate() throws Exception {

setMobile(getRequest().getHeader("User-Agent").indexOf("Mobile") != -1 ? Boolean.TRUE: Boolean.FALSE);

}

 

1 Accepted Solution
Vijayalakshmi_S
Correct answer by
Community Advisor
Community Advisor

Hi @v1101

Unlike Mobile, there is no generic name for Tablets in User-Agent Header. For iPad, you can make use of the string "iPad"

Below site has the list of all possible User-Agent values for Tablet. If you have specific list of supported devices, you can write condition accordingly

As an alternative, there are several other options available for device specific logic.

Could you please brief about your component functionality.

View solution in original post

0 Replies
Vijayalakshmi_S
Correct answer by
Community Advisor
Community Advisor

Hi @v1101

Unlike Mobile, there is no generic name for Tablets in User-Agent Header. For iPad, you can make use of the string "iPad"

Below site has the list of all possible User-Agent values for Tablet. If you have specific list of supported devices, you can write condition accordingly

As an alternative, there are several other options available for device specific logic.

Could you please brief about your component functionality.

View solution in original post

v1101
Level 5
Level 5
@Vijayalakshmi_S - Thanks for your expedited response. We have an image component. In that component, authors will upload the image for desktop only. Based on the user-agent, i.e for Tablet & Mobile, we need to apply the renditions (Adding path at the suffix for the selected image URL) and based on the user-agent, will show the appropriate image for Tablet and Mobile devices.
Vijayalakshmi_S
Community Advisor
Community Advisor

Hi @v1101,

Thanks for the details.

You can make use of Core Image component which is an Adaptive Image component that offers responsive features with lazy loading. 

In the design dialog of the component, we have an option to mention all possible width and component will then load the respective width based on the size of the window.

More about this in below docs

If you can't switch component, another option is to use JS to handle device specific image path(src)

Frame the HTL with actual image path -> Amend the src based on the device in JS. Something like below can be tried.

  • Get the image src value - $("img").attr("src");
  • Frame mobile and tablet path using the value above 
  • Target specific device using - $(window).width() 
  • Amend the image src value with respective device path - $(img).attr("src", mobileSrc/tabletSrc)
v1101
Level 5
Level 5
@Vijayalakshmi_S - Thank you so much for your imputs. will try this option (JS)
Vijayalakshmi_S
Community Advisor
Community Advisor
No worries. Update this thread in case of any issues.