Grow your CSS skills. Land your dream job.

Current Navigational Highlighting

  • # March 9, 2013 at 10:34 am

    How did you set up your blog at `/blog`?

    # March 9, 2013 at 2:10 pm

    I created a new page, named it “Blog,” and set the permalink to: http://www.happynakedpeople.co/blog/. Then I went to Settings > Reading under administrator and set my home page to a static page called /home/ and my blog was set to /blog/. Also, I should mention that /forums/ is also not creating an unique body class. But those are the only two pages that are doing so. Every other page seems to work fine.

    # March 9, 2013 at 7:27 pm

    I take that back. “Forums” is producing an unique body class, here:

    So, I am able to target the forums by using a class of bbPress, but “Blog” is most definitely completely blank. Hrm.

    Edit: Also, while everyone is still figuring out that problem, I have another problem with my menu. When you select a single “child” from the drop-down menu, it highlights the “parent” and other “child” at the same time. I need it to only highlight the selected “child” and “parent,” but not the other “child.” Did that make any sense?

    # March 10, 2013 at 11:19 pm

    Help?

    # March 11, 2013 at 3:09 pm

    I’ve managed to replicate what you’ve done on my local setup with Starkers and the issue is with the creation of Blog page and setting it up as static for your posts.

    I’m getting blank body class also.

    I would just use one of the conditional statements and output custom class for `blog` that you can target.

    # March 11, 2013 at 3:12 pm

    Also check out this Bug from Starkers https://github.com/viewportindustries/starkers/issues/16

    # March 11, 2013 at 6:31 pm

    I finally caved and decided to put my blog posts on my home page (although, I am still going to spice things up a bit more than my previous attempts). I am glad that you were able to replicate it and found the bug report. I was really starting to think I had done something horribly wrong with my code.

    Now, onward to the next problem with my menu. When I select “Feel Good Candy” or “Leaflet,” it highlights the entire ul chain. It also highlights “Projects,” but I actually want that to happen so that people know they are within “Projects” when viewing the “Feel Good Candy” or “Leaflet” page. Any suggestions?

    And I have run into a third minor problem. In “Forums,” I have a separate forum for each project. Welp, because my menu items and forum URLs end with the same characters (either /feelgoodcandy/ or /leaflet/), it highlights the accompanying menu item. So, you end up with “Forums” and “Projects” highlighted. Now, I know I could just change the name of the forum, but is there a savvier way to get around this?

    @AlenAbdula, thank you for your wonderful help thus far!

    # March 15, 2013 at 5:13 pm

    Okay, my menu, code-wise, is one of the only things I do not know how to do. I really need some advice on how to control the highlighting in the ul chain. You can see for yourself what is happening, here. If you select either Feel Good Candy or Leaflet, it highlights Projects, Feel Good Candy, and Leaflet. If you are following along, one of those does not belong, depending on what you’ve clicked. Again, any suggestions would be greatly appreciated as I know very little about this highlighting issue.

    # March 15, 2013 at 7:49 pm

    Why are you making this so difficult for your self?

    Just generate the menu via WordPress.

    Then include it in your template:
    `< ?php wp_nav_menu(); ?>`

    [This will get generated. (CodePen, with more info)](http://codepen.io/anon/pen/LbKxt)

    You might also need to [add theme support for menus](http://codex.wordpress.org/Function_Reference/add_theme_support), and [you can add multiple menus too](http://codex.wordpress.org/Function_Reference/register_nav_menus).

    # March 15, 2013 at 9:49 pm

    I would need to add theme support for menus. A fresh download of Starkers v4.0 does not provide such things. I am just afraid of how I would go about styling the menu once it has been generated in WordPress. I don’t really know that much about menus. I mean, I understand that there are uls (un-ordered lists) and lis (lists), but I guess it is time to learn the in’s and out’s of menu-making. But as with anything WordPress, I am sure it is not as horrible as I imagine it to be. I feel like a pest on these boards for the most part, so I try to keep my nagging to a minimum. But if I do it the way you have mentioned, I am sure I am going to have questions.

    # March 15, 2013 at 10:29 pm

    You already have functionality built in. All you have to do is generate the menu, look at the code, figure out what elements/classes/ids are there and just apply current functionality to appropriate elements.

    Don’t worry about asking questions! It’s the reason this place exists.

    It’s always hard before it’s easy. Don’t get frustrated.

    # March 16, 2013 at 2:27 pm

    Okay, I added add_theme_support( 'menus' ); to functions.php and I now have the ability to make a menu. I made a menu, but then I look under Theme Locations and it says:

    > Your theme supports 0 menus. Select which menu appears in each location.

    The only option is to hit Save, which does nothing. So, I went into codex and found this:

    > If your current theme does not support custom menus, you will need to add your new menu via the Custom Menu widget in the Appearance Widgets Screen.

    And that finally lead me here, which seems to be pushing the fact that widgets should be used in a sidebar. But I don’t want a sidebar, I want a menu. Help?

    Edit #1: Okay, I found a thing called register_nav_menu and it says it automatically registers custom menu support for the theme, therefore I do not need to call add_theme_support( 'menus' );. So, I added that to functions.php and Theme Locations now says, “Your theme supports 1 menu. Select which menu you would like to use.” I selected the menu I had created and hit “Save.” I reload my website and I do not see it anywhere. I think I am missing a crucial step. Hrm.

    Edit #2: Okay, so I did some further looking in codex and I saw this: “Use wp_nav_menu() to display your custom menu.” Which lead me here. I can not seem to figure out how to give it a theme location. When I go under Parameters > $theme_location, I see this: “The location in the theme to be used–must be registered with register_nav_menu() in order to be selectable by the user.” So, there is something I must select (other than the menu), right? ‘Cause I am not seeing that option. Here is a screen capture of my wp-admin when dealing with menus.

    Edit #3: Okay, I was having a derpy moment. I didn’t remember seeing you say to include the wp_nav_menu code. So, I have added the code to an ul that is inside of a div using all of the names I used previously. And it looks pretty good. It is all the way to the right for some reason, but all my styles are working and I am using the wp_nav_menu. Also, I added .current-menu-item { color: #FFFEF2; } and it does not seem to be doing the highlighting. I checked to see if “current-menu-item” was indeed being called in the class of the menu items and it is. So, I have made it this far. I need you, @AlenAbdula, to give me the final push!

    # March 18, 2013 at 4:17 pm

    @mintertweed I’ll go over your reply soon and respond in detail. Been busy today.

    If you switch to default theme, create the menu, then switch back to Starks theme, menu should be there. That’s how I did it in my local example.

Viewing 13 posts - 31 through 43 (of 43 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".