X-Cart forums

[Dr. Bogger]

Hello,

I am looking to edit the default skin, to change the look on mobile devices only.

Is there a way I can detect if the browser being used is desktop or mobile?

Example:

PHP Code:

if (Mobile Browser) {
Do this
} else {
Do this
} 


[Dr. Bogger]

Can I use this inside a template file?

PHP Code:

if (\XLite\Core\Request::isMobileDevice()) 


[elmirage001]

Use CSS media queries
https://developers.google.com/web/fundamentals/layouts/rwd-fundamentals/use-media-queries?hl=en
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries

Good luck!

Paul

[Dr. Bogger]

Is it possible to move/remove <div> sections using CSS?
If so, using what code?

[elmirage001]

Sorry, I missed that you were using x-cart 5...

I don't have any experience with xc5...

[tony_sologubov]

Originally Posted by Dr. Bogger

Can I use this inside a template file?

PHP Code:

if (\XLite\Core\Request::isMobileDevice()) 


Yes, this is correct code.

Is it possible to move/remove <div> sections using CSS?
If so, using what code?

Well, if CSS code can accomplish what you need, then you can do this. In order to register CSS code for mobile skin, you can use the condition mentioned earlier (if (\XLite\Core\Request::isMobileDevice())) in the method described here:
http://kb.x-cart.com/display/XDD/Adding+CSS+and+JS+files

[Dr. Bogger]

I'm not using mobile skin. I just want to modify the default responsive skin to look better on mobile devices.

I will even share the mods that I do if somebody is willing to help point me in the right direction.

[Dr. Bogger]

Originally Posted by tony_sologubov

Yes, this is correct code.

Also, I tried using that code inside the template files, and it didn't work. It just displayed the code on the screen.

[tony_sologubov]

Originally Posted by Dr. Bogger

Also, I tried using that code inside the template files, and it didn't work. It just displayed the code on the screen.

OK. Could you please explain what you are trying to achieve then? I need a bit more details in order to help.

Tony.

[Dr. Bogger]

Originally Posted by tony_sologubov

OK. Could you please explain what you are trying to achieve then? I need a bit more details in order to help.

Tony.

I need to edit the files:

- skins/default/en/checkout/steps/shipping/parts/subsection.shipping.tpl
- skins/default/en/checkout/steps/shipping/parts/subsection.payment.tpl

But I need the changes I make to only display on mobile devices.

I wish there was a "mobile override" skin area, kinda like "custom skin", but one that only works if being viewed from a mobile device.