How to re-order (or hide) "Votes" and "My Votes" top menu list items?

How can I reorder the Votes and My Votes items in the header? On my site currently (“Votes” is renamed to “Top-Voted” " and he default “Top” is now “Active” because I found it confusing to have both.):

I’d like Top-Voted and My Votes to go between Active and Bookmarks, but:

3 Likes

you remove all of them from the box, and add them in the order you want it.

2 Likes

Ah, I see from the title someone made when splitting this into a new thread that my question isn’t clear.

I know how to reorder top menu items in general. And I get that there’s a trick to it (“remove and re-add”) which isn’t obvious. But I know that trick. That’s not my problem.

My problem is: when the Voting plugin is enabled, new items, “Votes” and “My Votes”, appear in the menu list. If I try to add those to the “top menu” setting (as in the picture above), I find I can’t. The error message “You specified the invalid choice votes” appears.

Is there a different name I should use? Or is there a different way?

1 Like

For what it’s worth, I think I want the order

Latest | Active | Top-Voted | Bookmarks

… I’m not convinced I want “My Votes” to show up at all (we’re using this in a “vote up everything you like!” fashion rather than “weight a handful of favorites” way).

2 Likes

I re-ordered your navbar items as described here

Feel free to change the order as you prefer. You will find a new theme component on your site based on the items that are visible now.

5 Likes

When there are unconventional buttons that do not appear in the “top menu” setting, just change the order with the CSS since the navbar element uses the flex property. See this example:

/*In this specific case the Voting plugin is enabled only in a category 
so we will modify the navbar only in that category. Change {your-category-slug} 
with the slug of the target category*/

.category-{your-category-slug} #navigation-bar {
  /*Latest*/
  :nth-child(1) { 
    order: 1;
  }
  /*Unread*/
  :nth-child(2) {
    order: 2;
  }
  /*New*/
  :nth-child(3) {
    order: 3;
  }
  /*Top Voted*/
  :nth-child(4) {
    order: 5;
  }
  /*My Votes*/
  :nth-child(5) {
    order: 6;
  }
  /*Active*/
  :nth-child(6) {
    order: 4;
  }
  /*Bookmark*/
  :nth-child(7) {
    order: 7;
  }
}
8 Likes

Thanks @Dax! Does the “nth-child” value in the CSS depend on the order in the top-menu setting, or are those values fixed somewhere? Like, if I remove “Active” (aka “Top”) from the list in the setting, will I need to update the CSS as well?

And, what if (as I was musing above), I want to hide “My Votes”?

5 Likes

Yes.

Nod Yes GIF by Captain Obvious

Just add display: none; to your CSS, e.g.:

/*My Votes*/
#navigation-bar :nth-child(5) { order: 6; display: none;}

7 Likes