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.
Related
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 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)
I have 2 pages for my site. One a forum, another is my homepage. I have the homepage all setup, but the forum will require a bit of modification to the nav bar. I have the nav bar from the homepage mirrored to the forum so that the styles match nicely, but I made the forum wider because the forum needs more space for content and tables. I have tried numerous times to do this, to no avail.
Since the forum is not a static page, I have put the homepage on JSBin instead. They both use the same exact nav bar. This is Bootstrap 3, by the way.
Here is what I want it to look like (sorry for not embedding in post, need 10 rep): http://i.imgur.com/dlXaOZ8.png
Here is the JSBin: http://jsbin.com/fexowifica/1/
I just need to know how to make that extend out wider like seen in the image, but it won't actually be applied to the homepage nav bar, it will be applied to the forum nav bar that is seen in the image.
Thanks!
just update your css
CSS
#media screen and (min-width:768px){
.container{
width:100%;
}
I am creating a custom theme, made all the static html/css and now I am converting it to PHP for wp.
I don't know what I changed, but now whenever I make a change and reload, I cannot scroll down. There are no posts, this is not a blog, but the whole front page doesn't fit on the screen.
I turned on debugging and got a few errors I expected from plugins, but those plugins were active before when scroll was working. I am not using any javascript or jquery.
There is no scroll bar, and scrolling does not work (safari/chrome/firefox) but on my wife's PC in chrome it does work.
No ideas, please help!!
Figured it out
At the top of my stylesheet under html and body styles, I had
img { max-width: 100%; overflow: hidden; }
That line works ok with a static site, just not the php generated wp site.
Is there any module/plugin to show thumbnails only in homepage?
In my article page I'll upload many images but i want to show a different image when this article will be shown in homepage.
You can do it with a CSS class applied to the thumbnail e.g. on a Front page or a Category Blog listing which shows the text before a "Read More..." link we show a small thumb.
On an actual article page though the only the main image is visible as the CSS hides the thumbnail on article pages. Obviously depending on your Joomla! you will have to use the appropriate selectors, I've included an example from a site we have in development.
The CSS for the Featured/Blog pages:
div.featured .blogthumb, div.blog .blogthumb, #tinymce .blogthumb {
display: block;
}
The CSS above includes the #tinymce id, so that the thumbnail is still visible in the editor after applying the .blogthumb class to the image.
While the CSS for the rest of the site looks like this:
.blogthumb {
display: none;
}
As mentioned before this CSS is specific to the template we're using - you will have to investigate the equivalent ID's or classes for your template.