Is there a way to check for device type or screen size in liquid?

Is there a way to check for device type or screen size in liquid?

thejameshampton
Shopify Partner
3 0 0

I have a video I am playing on my Shopify Store and it changes depending on mobile or desktop. Instead of loading both, and displaying one video or the other, I want to write some liquid code that says hey this is a mobile device, let me throw in this video or hey, this is a desktop device, let me throw in this video. Is this possible with liquid or must I JavaScript it?

Note: I am well aware that you can do this in CSS or in JavaScript but I want the server to handle this instead of the client.

Replies 4 (4)

suyash1
Shopify Partner
9792 1214 1554

@thejameshampton - you can upload videos to youtube and code it in the required way, that is the way for server to handle it.

 

If you upload video to your shopify then you can upload max 20mb video

To build shopify pages use pagefly | Contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30. | Support me
thejameshampton
Shopify Partner
3 0 0

You didn't even read the question

mrsaxman29
Excursionist
18 1 2

You can't do this server-side to my knowledge.  From Chat GPT:

"you might need to consider server-side device detection, which can identify the device type (desktop or mobile) based on the user agent string of the incoming request. However, Shopify doesn't natively support server-side device detection."

I was trying to get 2nd thumbnail photo to not load on mobile only when I got this response. 

 

Check out my store Hither Lane at www.shophitherlane.com

conversionist
Shopify Partner
90 8 9

So there's no answer to this simple  question

Maybe there's a better way but I do it with JavaScript

let isMobile = window.innerWidth <= 768;



Building 100 Shopify apps for that BMW M5 dream

Follow the journey at https://www.youtube.com/@conversinist
https://
conversionist.online/
Buy me a coffee