How to disable mobile and tablet modes

Latest Reply from Alice at 2016-02-12 07:36:48
By default we don't provide possibility to disable mobile and tablet modes of a theme. But if you would like to do it you can use the following instruction:

1) open file inc/library.php in text editor, find function headtext(), find and remove there following code:
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/mobile.css" type="text/css" media="screen and (min-width:240px) and (max-width:639px)" />
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/tablet.css" type="text/css" media="screen and (min-width:640px) and (max-width:1023px)" />

find string
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/wide.css" type="text/css" media="screen and (min-width:1024px)" />

and replace it with
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/wide.css" type="text/css" media="screen, projection" />


2)open file style.css and remove all code starting from strings

/* -==========================- TABLET -==========================- */
@media only screen and (min-width:640px) and (max-width:1023px) {


3)delete the following string:

@media only screen and (min-width:1024px) {


and one closing curly brace before the line:

/* WooCommerce */


4) And in conclusion you have to find width of the .contaner class in the style.css file. The same width should be for "html" element. I mean you have to find the code (e.g.):

html {background:url(images/back.png) repeat fixed transparent;

and replace it with:

html {
background:url(images/back.png) repeat fixed transparent;
min-width: 1000px /*just for example*/
}


That is all. After you have done you will see the same looking website on desktop, tablets and mobile devices.
hello dear support. sorry but my english is not so good.
yesterday i bought the "sport press" theme on your page.
now we have a problem with the mobile function.
when the theme is not activated it is running on my iphone. later i activate the theme and it doesn't running. what can i do????

please help me!!!!
Please contact us via support@smthemes.com to solve it.
Hello, I followed the previous code on the hotelbook theme and has mostly worked. Nevertheless, the right side of the theme looks cut off on the mobile site, as if the design is incomplete. Where could I have gone wrong in the codes?
Hello,

I follow this tutorial and on my iphone, the menu don't work. Why?

the site: http://mathieuderoy70.com/wp/


Thanks
I have noticed the same issue, you can resize down if the page is loaded at a large resolution, but if you load it directly on a smaller resolution, the menu bar doesn't work
hi
i have this site http://xn--5dbfhkabawhh6a0b0bmlfp.net/
and i want to disable the mobile and tablet modes
is this tutorial works?
I am unclear on step 3... I deleted the indicated code as I best understood your instructions, but my pages lost the correct formatting on all devices...

I am using the Jellybean theme -- perhaps you could paste what the ENTIRE code on the style.css sheet would be with the edited code?
Thanks!
Dear Support,

I still have some issues concerning the background of my website www.meierzajac.com. When I followed the steps indicated above, the mobile version got deactivated but now the background picture with the skyscrapers is missing if you access the site with a mobile device. Also I couldn't execute the last step since the styles.css in my case is empty. I'm using the template immovables 2.0.

Thanks!
Is it possible to remove Tablet but leave mobile, in other words force tablets to act as if it were mobile?
Hi!
To enable the mobile mode on tablet devices you should use the following instrucion:

1) delete the following string in the file library.php:
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/tablet.css" type="text/css" media="screen and (min-width:640px) and (max-width:1023px)" />


and replace the string:
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/mobile.css" type="text/css" media="screen and (min-width:240px) and (max-width:639px)" />


with:
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/mobile.css" type="text/css" media="screen and (min-width:240px) and (max-width:1023px)" />



2) replace the following string in the file style.css :
/*	-==========================- MOBILE -==========================-  */
@media only screen and (min-width:240px) and (max-width:639px) {


with:
/*	-==========================- MOBILE -==========================-  */
@media only screen and (min-width:240px) and (max-width:1023px) {



and delete the code from the string:
/*	-==========================- TABLET -==========================-  */

up to this line:
/*	-==========================- MOBILE -==========================-  */
Thank you very much that did the trick
Hi! In the theme "firetive" no file top.php. What to do?
I did everything as you described to the theme firetive, but still did not change the result.
Dave - sorry but I need some assistance I followed your instructions to the "T" to remove the table view but something very strange is occuring with my site.

On my phone & Tablet (Nexus 5 and Nexus 7) when I go to the site with www.... before the address it works fine but if you type in just claycountypodiatry.com without the www it just gives me a blank screen, If I turn off the theme and go back to Wordpress default theme it works properly any thoughts?
Sorry but it does it on a PC as well (see post above)
I have since removed those changes and reverted back to theme's orignal libraby.php and style.css in order for my site to properly function.
Any updates on why this didn't work (removing Tablet only?)
Hi!
To enable PC mode on tablet devices you should use the following instrucion:

1) delete the following string in the file library.php:
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/tablet.css" type="text/css" media="screen and (min-width:640px) and (max-width:1023px)" />

and replace the line:
<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/wide.css" type="text/css" media="screen and (min-width:1024px)" />


with:

<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/wide.css" type="text/css" media="screen and (min-width:640px)" />



2) replace the following string in the file style.css :
/*	-==========================- DESKTOP -==========================-  */
@media only screen and (min-width:1024px) {


with:
/*	-==========================- DESKTOP -==========================-  */
@media only screen and (min-width:640px) {



3) delete the code from the string:
/*	-==========================- TABLET -==========================-  */

up to this line:
/*	-==========================- MOBILE -==========================-  */

Hi,

I have tried to remove the tablet mode and use the mobile mode up to 1024px wide and PC mode above that. As JBG says above, this does not work. Although the screen updates correctly, I get a white screen when I try to edit a post.

Please assist


Jesper
123
and how to make what would be the width of the page, and the background image (html {
background: url (images / back.png) repeat fixed transparent;
min-width: 1000px / * just for example * /
}) Specifies the width of the screen resolution automatically, mobile phone or tablet? after switching off the mobile version of the site, it is necessary to narrow the hands of the site on your mobile phone!

I set the width of the image is automatically html {
background: url (images / back.png) repeat fixed transparent;
min-width: auto; / * just for example * /} - background image and adjusts the screen width of the page there is no way to do that would be determined by the width of the page automatically?
Hi!

There are several css files: style.css located in the directory of the theme and the others inside /css folder. Inspecting the page you will be able to find the line and the file you have to edit.
We used css @media rule, e.g. :
@media only screen and (min-width:1024px) {

and more to create the responsive web design for the theme.
We don't provide such kind of services as editing themes for individual users.
Hello, As many people, my menu doesn't work on mobile phones and tablets.
website: lavieenvert.be

help me quickly please
Hi!

Problems that people have are completely different as well as yours. It depends on many things: plugins, theme modification. In your case the reason for the problem is the renamed ".menu-topmenu-container" class for top menu. Perhaps, one of your plugins change it. Just replace the code:
<script>
jQuery(document).ready(function(){
jQuery('.menu-topmenu-container li').each(function() {
jQuery('<option />', {
'value':jQuery(this).find('a').attr('href'),
'text':jQuery(this).find('a').html()
}).appendTo(jQuery('#mobile-sec-menu'));
});
});
</script>

with:
<script>
jQuery(document).ready(function(){
jQuery('.menu-emenu-container li').each(function() {
jQuery('<option />', {
'value':jQuery(this).find('a').attr('href'),
'text':jQuery(this).find('a').html()
}).appendTo(jQuery('#mobile-sec-menu'));
});
});
</script>

and this should fix your problem with the top menu. That's all!
Sorry, I forgotten to add that this code is located inside the functions.php file of the theme.

Leave a reply

Add codeAdd image