I am using magento 1.9, I have created mobile theme successfully and apply it to mobile device working fine but it is not working on web browser resize.
How can I apply this theme to browser resize.
asked Feb 21, 2017 at 16:45
Add a comment
|
2 Answers
If you are using a responsive design, then it should look at the width of the browser window and render a mobile, tablet or desktop view based on browser width.
However, it sounds like you've created a mobile-only theme for your Magento 1.9 site. A mobile-only theme can have some advantages, as it's usually very stripped down design and images and can make for a faster page load time. Plus, you don't have to rebuild the entire site with a responsive theme.
But note: a mobile design will not detect browser width changes.
In this case (using a mobile design), you'll want to have the site use the device type (i.e. iOS) to render the mobile site.
You'll do this in the System --> Configuration --> General --> Design --> Themes section:
I hope this helps!
It sounds like you want to change the theme on a browser resize, I don't think this is possible as you would need to refresh the page to reload all the theme's templates/dynamic code.
Based off your comment it sounds like your theme isn't responsive.
To make a theme responsive you need to build it that way, if your theme isn't responsive you will need to rebuild it.
If your theme is responsive then there isn't anything Magento needs to do, the CSS/JS from the theme will handle it.
How to change theme for mobile
To load a different theme for mobile you need to login to the admin and navigate to system > config > design and add the user agents of the devices you want to change theme for. For example this will target mobile user-agents and change the theme if they match my expression.
The expressions used here are:
Desktop:
iPad|Silk|Kindle|Xoom|SCH-I800|GT-P5210|Android Tablet|Tablet|SM-T520|hudl|HT7S3|ME173X|JSS15Q|Nexus 7|Nexus 8|Nexus 9|Nexus 10
Mobile:
iPhone|iPod|BlackBerry|BB10|Pre|Palm|Googlebot-Mobile|mobi|Safari Mobile|Windows Mobile|Android|Opera Mini|mobile
Note that this won't change the theme on resize as it's based off user agent and not browser width. I don't think it's possible to change the whole theme on resize as it will need to fully reload templates/PHP/JS/CSS etc.
answered Feb 21, 2017 at 17:32
-
Yes you are right, but my question is there any way to apply mobile theme for browser small size Commented Feb 21, 2017 at 17:52
-
If you want a different theme for mobiles that is the opposite of responsive, I've updated my answer to include an explanation on how to do this. Commented Feb 21, 2017 at 18:00
-
Yes that i have done. in system config, but i want to know is there any way i can apply my mobile theme for specific browser height width Commented Feb 21, 2017 at 18:03
-
I'm not aware of any way to do that, there would be performance problems and I'm not sure how possible it would be as Magento would need to changes templates and dynamic content on the fly. This would require a refresh at which point you might as well just use the user-agents. Commented Feb 22, 2017 at 10:06