I am using megashop theme inside WordPress and I want answers to some questions:
How do I change a setting only in "less than desktop size" view? and not in desktop view.
Like the meta slider which on desktop view is fine but is overlapping the search bar in a resized version.
Cart, compare icons on products(ecommerce site) not centered.
And text suddenly showing on mobile view beneath an icon.
I believe, that you can fix all these things via custom CSS (if it's available in your theme). Also, you can use media query for "less than desktop size":
#media screen and (min-width: your-width)
Related
I have a blog to build and I am using the "ample blog theme" in WordPress. The website should be non responsive. The mobile version should look the same as the desktop version. I have removed . It did not work. I have replaced the "content="width=device-width" to "content=width=1024". It did not work. I have replaced the media queries in the bootstrap.min.css to 200px. That did not work. I am asking what else to try. The theme I am using is "Ample Blog". I was told by the theme support to remove the bootstrap CSS, but when I did everything become stacked in desktop mode.
Check the source code in the browser to see if the device width meta is being reinserted by a plugin via javascript or php method.
If yes, try disabling individual third party plugins and check each time.
Another option is to set the main wrapper width to an absolute width and use !important example
.mainwrapper {width: 1200px !important; min-width: 1200px !important;}
I am editing the home page of my website with the help of Elementor. On the home page, there is a headline in the left column and an image to==in the right column. The website is appearing correct on the desktop.
Dekstop view. Please see the image
But when I open the website on mobile, Tthe image should appear above the headline. But it is appearing beside the headline. Therefore the website looks ugly.
mobile view. Please see the image
I am using Astra Free Theme I am using the following plugins: A3 lazy load, wp asset cleanup, swift performance, Akismet, Elementor, essential addons for Elementor, GDPR consent, Ninja forms, Lite speed cache, user profile picture, My WordPress version is 5.6.1 My PHP version is 7.4
javascript
you should change the column width for text and the picture to 100%
if the picture went below the text.
in that case, select the whole section, then go to the "advanced" tab, in the responsive tab, select reverse columns for tablet and mobile.
let me know if there was any problem with that.
I have a WordPress website, I want to show one of its pages in desktop view even on mobile devices. So my question is how to force desktop view for specific pages on a mobile device (WordPress)
You could try to change the meta tags as discussed here: SO: How to force desktop view on mobile devices - Bootstrap?
To change the meta tags for specific pages, you can create a custom page template, or maybe use a plugin (for example: Meta tag manager)
Maybe you can also force things with custom CSS for that page, by giving the content container (ex. .entry-content) some rule like: min-width: 1024px;?
I use performag theme from ThriveTheme and I have problem with the menu for cellphone.
It's a very big menu with a lot of sub-menus. ( It's not mine and I can't change it)
Performag theme use "#media only screen and (max-width: 768px)". But this theme open all sub-menu when you click on the hamburger menu, so if you want the last link in my menu, you have to scroll a lot.
So I changed the file css. Now it's "ok" but I have a trouble when I scroll. I can't scroll until the end.
http://dev.test.babylonradio.com/ You can look on my website with the inspector.
Thank you in advance.
Seems like this is an css issue. Try to use media query for mobile views.
https://www.w3schools.com/cssref/css3_pr_mediaquery.asp
I have a few questions on how to adjust the top toolbar in WordPress when logged in. Firstly, how do I edit the site name section that has the drop down to take you back to dashboard when you are viewing site? Secondly, How do I edit the mobile versions of the toolbars?
Figured out what I was trying to accomplish, the remove_node function at http://codex.wordpress.org/remove_node
This allows me to select the navigations I don't want and remove them from the toolbar.
1) Dashboard->Settings->Site Title
2) You can find your admin bar CSS by visiting the following link: http://your.wordpress-site.com/wp-includes/css/admin-bar.css. Replace "your.wordpress-site.com" with the domain and path to your Wordpress installation to view the CSS.
The following Media queries are used for mobile display:
#media screen and (max-width: 782px){
...
}
#media screen and (max-width: 600px){
...
}
If you want to adjust how this displays in your theme, DO NOT overwrite the file in wp-includes. Just override the styles with your own by using more specific selectors in either style.css or a separate stylesheet.