Forum Replies Created
-
AuthorPosts
-
Ziggur
ParticipantI can confirm what Mealtog said: Metro Plus theme, background tile functionality not working, Brian Dempsey's fix works.
This fix led me to a solution for another problem. I wanted to make the background image responsive, in that it's never going to seen on a small scree, e.g.: a phone, so why make them download all that extra image weight? So instead of putting it at the end of my CSS I put it in the responsive section, using a min-width statement, as follows:
@media only screen and (min-width: 800px) {body {
background: url(http://YOURDOMAIN.com/wp-content/uploads/2013/10/IMAGENAME.png) repeat #766856;
}}
Haven't tested it across too many devices yet, but 800px seems to reliably give me a tiled image background for an iPad in landscape mode on up, and a flat color in portrait mode on down. Obviously use your own URL for the image, and your own hex code for the fallback color.
Brian M
Ziggur
ParticipantHi Susan! Well it took me a while, but I got there. What follows is not for you so much as for others who, like me, may be trying to figure this out from zero.
1st: Cool tip on how to assign unique classes to menu items. So easy once you know, right?
2nd: Because I'm an amateur, not a pro, it took me a lot of trial and error and then finally reading and trial and error (but that's how we learn), to figure out that I needed to identify the parent or superset class (for lack of a better term) as well, in the CSS, for the new subclass I had created, with "." separators for each. So after giving my individual menu item a custom class name of, say, Fred, I couldn't just call ".Fred" in the style sheet, I had to call ".menu-item.Fred"
3rd: Once I got there, making it visible or invisible, based on screen size, was easy. But, I also determined that once what I was calling was a subset of the class "menu-item" that I could do the same thing with the existing, unique (WP-assigned) menu item ID#, as with the new, unique class of "Fred". So, in my case at least,
.menu-item.Fred
and
.menu-item.menu-item-123both did the same thing, allowing me to effectively add or remove just that one menu from the primary nav, based on the screen size (making it responsive).
I wouldn't have gotten there without your help. Thanks again!
Brian
Ziggur
ParticipantHi Susan - thanks for jumping in!
I've done that with other mobile-specific page content using DIVs to create custom classes for custom content. But I don't know how, or where, to create a unique, custom class for a specific menu item in the navigation. I've tried using the .menu-item-ID# in the responsive section of the CSS but that didn't seem to work. Any tips on how to give one menu item its own CSS class?
Brian
Ziggur
ParticipantFor what it's worth, I found these two methods/tutorials. The second one seemed to work best for me, although as best as I can tell it pretty much kills the ability to use the Header-Right widget area and have it appear as an overlay over the header image on mobile. FYI I'm using this on the Metro Plus theme.
-
AuthorPosts