YOOtheme Pro is here! The best WordPress and Joomla theme. Learn more

Disable the responsive layout

Learn how to turn off the viewport meta tag and edit the breakpoints to disable the responsive layout.

1. Viewport meta tag

Check the Disable the viewport meta tag checkbox in your Settings -> Responsive menu of the theme settings. This will set the default width of the mobile layout to 980px and the site will look the same as on desktops.

2. Breakpoints

The next step is to give the breakpoints minimal and maximal values to prevent the responsive behavior of the layout. To do so, open the customizer and set the Mini, Small, Medium and Large breakpoints to 0px. The Xlarge breakpoint needs to be set as high as possible, like 9999px. This will make it impossible for the browser to respond to the breakpoints.

3. Less

You need to add the following css code to the /less/theme.less file.

.uk-container {
    max-width: none;
    width: @utility-container-max-width;
}

NOTE Check out the Customization chapter to learn how to override files.

Documentation on Github

Help us out! If you are feeling that our documentation has errors or can be improved, fork it at Github and send us a pull request. Any contribution is much appreciated. Thank you!