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

[thejameshampton]

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.

[suyash1]

@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

[thejameshampton]

You didn't even read the question

[mrsaxman29]

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. 

[conversionist]

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;

[rm-philmells]

If you're doing media queries in Javascript you should really be making use of the matchMedia method. This allows you to manage media queries like CSS and also attach events to changes.

https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia 

There isn't a good way to do this in Liquid though, really they should have added this information to the request object but good luck with that. You can only handle things with media queries in either CSS or JS. It's possible in Hydrogen but this is a whole different ball game...

[conversionist]

Ohh thank you

[gabocles]

Hi there!
I was checking the same and I encountered the following: https://community.shopify.com/c/shopify-design/is-there-a-way-to-check-for-device-type-or-screen-siz...

Hope that helps!