mobile view of wp website WordPress
- SOLVED
Hi we recently purchased and built a wordpress website for our company. We used the Styx theme which was responsive but we didn't like the way the responsive aspect looked on mobile so we asked the creator how to remove this he told us but this then made the website too big for mobile and tablet (portrait view) and you have to scroll horizontally to read content which we don't want the user to have to do. Our current website fits to screen and we were looking for code to be able to do the same with this new website.
Our current website it www.29studios.com and the new website is on a test area under www.styx.29studios.com if you can have a look.
Can anyone help supply a bit of code that could make the new site fit full screen on a mobile and tablet without having to scroll.
Answers (2)
Reinaldo Ferro answers:
remove the tag
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
And remove the mediaquery in you (root)/wp-content/themes/styx/css/grid.css
Reinaldo Ferro comments:
And remote the mediaquery in you (root)/wp-content/themes/styx/css/grid.css
lynne29studios comments:
thanks for this - I'm not coded minded so could you tell me where the "tag" of code would be <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
Also the creator of the wordpress theme had told me to remove all the content on the grid.css file and this is what has made it to the current size.
Appreciate your help.
Reinaldo Ferro comments:
Hello!
this tag <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
is usually located in the header.php of the theme.
You can edit the file grid.css and delete all its contents, as said by the author of the theme, or alternatively you can simply remove the link from the header.php file that points to grid.css, like this:
<link rel='stylesheet' id='grid_css-css' href='<?php bloginfo('template_url'); ?>/css/grid.css' type='text/css' media='all' />
Please, copy and paste the header.php file here if you have any doubt.
lynne29studios comments:
you are a star!!! thank you so much that worked a treat!
Daniel Yoen answers:
Put this code to your .htaccess file
RewriteEngine On
RewriteCond %{REQUEST_URI} !^/m/.*$
RewriteCond %{HTTP_ACCEPT} "text/vnd.wap.wml|application/vnd.wap.xhtml+xml" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "acs|alav|alca|amoi|audi|aste|avan|benq|bird|blac|blaz|brew|cell|cldc|cmd-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "dang|doco|eric|hipt|inno|ipaq|java|jigs|kddi|keji|leno|lg-c|lg-d|lg-g|lge-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "maui|maxo|midp|mits|mmef|mobi|mot-|moto|mwbp|nec-|newt|noki|opwv" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "palm|pana|pant|pdxg|phil|play|pluc|port|prox|qtek|qwap|sage|sams|sany" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "sch-|sec-|send|seri|sgh-|shar|sie-|siem|smal|smar|sony|sph-|symb|t-mo" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "teli|tim-|tosh|tsm-|upg1|upsi|vk-v|voda|w3cs|wap-|wapa|wapi" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "wapp|wapr|webc|winw|winw|xda|xda-" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "up.browser|up.link|windowssce|iemobile|mini|mmp" [NC,OR]
RewriteCond %{HTTP_USER_AGENT} "symbian|midp|wap|phone|pocket|mobile|pda|psp" [NC]
#------------- The line below excludes the iPad
RewriteCond %{HTTP_USER_AGENT} !^.*iPad.*$
#-------------
RewriteCond %{HTTP_USER_AGENT} !macintosh [NC] #*SEE NOTE BELOW
RewriteRule ^(.*)$ /m/ [L,R=302]
hope this help :)
lynne29studios comments:
Hi thanks for this - I am not coded minded but have looked throughthe file system and don't seem to have a .htaccess file- any ideas?
appreciate your help!
Daniel Yoen comments:
.htaccess file located in your website root folder maybe /public_html
if not exist, you should make your own, then, put in website root folder
hope this help :)