Disable Mobile view

[massakid]

Hello , How can I disable the mobile version of the site? I wish all mobile devices open the website just like the pc version instead of the mobile. I tried to force the desktop view on some android phones and it do not change to the desktop version thought.
Thanks

[satori]

Hey Massaki,

since Kanso in responsive, i.e. adapts to the smaller screens via CSS rules, there’s not way to request a desktop website as long as the screen width is still small. To disable the mobile layouts completely, you’d need to remove everything from line 430 and down in the theme’s “responsive.css” file – I’ve prepared one for you, please download this archive, unzip it, and upload the resulting file into the theme folder. Better still, I would advise to implement this via a child theme (more information here) – this way the changes will stay even if you decide to update the theme in the future.

Sincerely,
Andrii / Satori Stuido

[massakid]

Hello , sorry for taking so long I’m customizing the website slowly so I tried to remove all lines after 430. But I still get the mobile version on the smartPhones. Any ideas?

[satori]

Hey Massaki,

I can see from the code that you still have the original “responsive.css” on your website – could you please try using the one I’ve linked to in the previous post (unzip the archive and upload the contained file via ftp into the theme folder /wp-content/themes/Kanso/, replacing the existing file). Thanks!

Sincerely,
Andrii / Satori Studio

[massakid]

Hello, So I did that , but nothing changed on mobile view so I put the original one back again, I just change the code again. so you can check it. I want the same desktop version on the mobile as well, it changes too much when go mobile on the normal theme. Thank you very much

[satori]

Hey Massaki,

you can try removing everything below line 253 in the “responsive.css” file, starting with the one that says:

@media only screen and (max-width: 1030px) and (min-width: 767px) {

apart from that, there are no small-screen specific CSS rules in the theme, so the elements will behave according to their floats and positions – note that on smaller screen sizes this might not be what is expected (which is exactly why the theme has specific small-screen CSS rules).

Sincerely,
Andrii / Satori Studio

[massakid]

Hello, I tried to delete those lines as well. I’m looking for a way to make the mobile view the same view of the desktop version, so it’s not possible ? the problem with the mobile view is that my background images get cutted, as well as the google map window.

[satori]

Hey Massaki,

The background images in Kanso have an automatic “background-size: cover” CSS rule, which forces the images to always occupy the available space fully, thus inevitable cropping them in most cases; however, it ensures that there are no blank spaces and strange background behaviour on various screen sizes. If you need your images to display full width on any screen size (although I would not recommend having important information in the form of backgrounds), you can add a “background-size: contain” CSS rules for the particular backgrounds for smaller screens, e.g.:

@media only screen and (max-width: 767px) {
#page-holder-12 {
background-size: contain !important;
}
}

the Google map on the front page seems to have been added via a third-party plugin, thus this part of the issue should be solved through the plugin itself.

Sincerely,
Andrii / Satori Studio

[Author]

Posts