HTML5 on Mobile not responsive – doesn't fit mobile screen

Home Forums Support HTML5 on Mobile not responsive – doesn't fit mobile screen

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #7365
    Tia WTia Williams
    Participant

    Hi,

    The html5 version on mobile is not working correctly. On your site it looks fine, on mine it isn’t responsive. It looks like there is some difference in how the plugin is working and stylesheets not being applied. Right now on mobile it is not usable.

    Can you take a look? I am sending an email with the URL.

    #7371
    Sean PSean P
    Keymaster

    Hi Tia,

    You may need to adjust your Viewport tag.

    The HTML5 / Mobile customizer can go responsive but it’s honestly better not to so that people can have the 2 column layout.

    You can also force your page width to 950px with CSS something like this:

    <style>
    body.mystyle-customize {
      min-width: 950px;
    }
    </style>

    You can still make the page collapse responsively as well, with some development work if that’s what you want, but the UX is worse having to scroll down and up all the time to see what’s happening. That’s why we typically force the page open to 950px (the width of the landscape HTML5 customizer for 2 col layout) on most of our sites.

    If some phones do not zoom / fit the page to the screen, it may be because the Meta Viewport tag on your site is probably trying to set to device width, with initial-scale 1. Really, to force a page open with proper zoom from all phones to fit to screen you usually want the viewport meta tag to be content=”width=950″

    Unfortunately, the Viewport tag is outside of the scope of what our plugin does on page, so the plugin will not modify it for you. You’d need to do some development work to force the viewport tag to values that fit the app (JQuery for example can take care of the viewport tag on page ready and on window resize events).

    #7430
    Tia WTia Williams
    Participant

    This didn’t work for me. I sent an email asking for a quote to get you guys to try to resolve this for me about a week ago but haven’t gotten a response. Can you email me back please about this?

    #7437
    Sean PSean P
    Keymaster

    Hi Tia,

    Fixing website design issues is outside of the scope of what our WP plugin does. The page layout is actually entirely in your Theme and not in our plugin. So, typically you’d want to get your Theme author or developer to fix that for you, but we do offer dev services by the hour for Standard License customers and up.

    If you yourself are not able to handle basic CSS and HTML we would definitely not recommend going it alone with our Developer License. The Developers Licenses are intended for Developers only, and this code fix you’re looking for is very common for a competent developer. The idea here is that for a fully competent developer that needs no technical support for anything beyond of our out-of-the-box features, we can make the price very cheap. On this lowest level of pricing we can’t afford to do WordPress contracting, but we do have another License you can use where we can take on work requests like that.

    If you would like us to jump in and help you with your wordpress child theme overrides, you can upgrade to a Standard License where we can do custom developer services for you.

    To upgrade, just go to your My Account page and use the upgrade button next to your subscription to upgrade to Standard and then we can open new work orders for you to take care of your custom web development needs.

    You can also reach out directly to our Sales dept by emailing Miguel, or using our Get a Quote Form here:

    Need A Quote Or Demo?

    Thanks,

    – Sean

    #7519
    Tia WTia Williams
    Participant

    To be clear, this is the css file where we attempted to add the width. The problem still exists. We can add scrollbars with an iframe, but that doesn’t make sense. This is the correct css file where the width should be set correct?

    plugins/mystyle-custom-product-designer/assets/css/frontend.css

    We also tried the default wordpress theme and the issue still exists. This is why I asked for help. Making the css entry should be a simple thing but in this instance the css isn’t being applied and its not a theme issue because the default wordpress theme shows the same problem.

    So what am I missing?

    #7521
    Sean PSean P
    Keymaster

    Hi Tia,

    Do not edit plugin files like the CSS file you noted. If you do that, and you update the plugin, your version would be overwritten by the update. That’s why you never mess with core wordpress or plugin code or files in general.

    One place you can put CSS is in your child theme CSS file. But you may have inheritance issues depending on your theme and CSS code.

    The easier place to put the example code is directly in the /customize page. Go to your page list, edit the “Customize”, go to the code view (Text tab) and paste it at the bottom of the page beneath any MyStyle shortcodes that may be in there. Do not remove the shortcodes. Here’s the example code again that you can paste directly into the page:

    <style>
    body.mystyle-customize {
      min-width: 950px;
    }
    </style>
    
    #7524
    Sean PSean P
    Keymaster

    Hi Tia,

    If you still need help I’d recommend speaking with Miguel who can hook our dev team up with you to fix your site beyond the customizer itself (responsive issues, CSS issues, SEO, whatever).

    This form will go directly to Miguel:

    Need A Quote Or Demo?

    Thanks,

    – Sean

    #7795

    Hi Tia,

    If you still need help I’d be happy to get you a quote on your potential custom dev work.

    You can schedule a call with me here or you can email me at: miguel@mystyleplatform.com

    Thanks,

    – Miguel B. Hart

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘HTML5 on Mobile not responsive – doesn't fit mobile screen’ is closed to new replies.

Personalization and Customization Platform