WordPress.org

Ready to get started?Download WordPress

Forums

The Events Calendar
[resolved] styling 'events' in navigation bar problem (14 posts)

  1. charlesdunworth
    Member
    Posted 12 months ago #

    WP version 3.6, events calendar 3.03, thematic child theme

    I'm trying to style my navigation bar to indicate which page a user is on. I've done it by applying style to .sf-menu .current_page_item in the css.

    However the style won't apply to the page generated by the events calendar plugin (the slug for which I have as 'events'). I notice when I inspect using firebug that the .current_page_item is not being applied to the <li> class.

    Any idea how this could be solved or any css workaround for the problem. I'm not an experienced php programmer but I would give any suggestions a go. A css workaround would be fine. Does this post even make sense to anyone? Has anyone solved this problem?

    http://wordpress.org/plugins/the-events-calendar/

  2. Barry Hughes
    Member
    Plugin Author

    Posted 11 months ago #

    Hi Charles,

    Have you tried applying a rule against .current-menu-item instead and can you share a link to your site?

    Thanks!

  3. charlesdunworth
    Member
    Posted 11 months ago #

    Thank you very much for replying Barry.

    The style as applied is already covering both those bases, in the css I have...

    .sf-menu .current-menu-item,
    .sf-menu .current-menu-parent,
    .sf-menu .current-menu-ancestor,
    .sf-menu .current-post-ancestor,
    .sf-menu .current_page_item,
    .sf-menu .current_page_ancestor,
    .sf-menu .current_page_parent {
    
    	background: #fff;
    }

    it styles all the other links bar the events page fine. I can't link to the site because as yet it is only being developed locally.

    When I look at the html whilst I am on, say, the gallery page, it appears thus...

    <ul class="sf-menu sf-js-enabled">
    <li>
    <li class="page_item page-item-92">
    <li class="page_item page-item-22">
    <li class="page_item page-item-11 current_page_item">
       <a href="http://localhost/barsite/gallery/">Gallery</a>
    </li>
    <li class="page_item page-item-8">
    <li class="page_item page-item-24">
    <li class="page_item page-item-13">
    </ul>

    ...but when I am on the events page that current_page_item does not appear in the class...

    <ul class="sf-menu sf-js-enabled">
    <li>
    <li class="page_item page-item-92">
      <a href="http://localhost/barsite/events/">Events</a>
    </li>
    <li class="page_item page-item-22">
    <li class="page_item page-item-11">
    <li class="page_item page-item-8">
    <li class="page_item page-item-24">
    <li class="page_item page-item-13">
    </ul>

    There is really nothing there I can hook onto is there? I'm sort of guessing that without seeing the site you are going to struggle to take this issue any further but I've replied anyway just in case.

    Big thanks for your time

  4. Barry Hughes
    Member
    Plugin Author

    Posted 11 months ago #

    For whatever reason it would appear not. Yet with most themes there is no problem (try this with Twenty Twelve or Twenty Thirteen for instance). Perhaps there's something unusual in the way your theme/parent theme generates the menus?

  5. sdk
    Member
    Posted 10 months ago #

    I'm having the same issue... the page that is set as the main events page isn't applying current_page_item - there's nothing to grab onto...

    http://thecartelstudio.com/classes-gatherings/

  6. Barry Hughes
    Member
    Plugin Author

    Posted 10 months ago #

    Does this only happen with your theme? Or are you using some sort of menu plugin?

  7. sdk
    Member
    Posted 10 months ago #

    no menu plugin...

  8. Barry Hughes
    Member
    Plugin Author

    Posted 10 months ago #

    OK, and so is it specific to your theme as best you can tell?

  9. sdk
    Member
    Posted 10 months ago #

    negative. i've just tested it with WordPress 2013 default theme and still doesn't have current_page_item

    class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1552"

  10. Barry Hughes
    Member
    Plugin Author

    Posted 10 months ago #

    Strange, for me (although I don't see that exact class) the Events item is correctly highlighted both with Twenty Twelve and Twenty Thirteen and the containing list item has the class .current-menu-item applied.

    Something different is clearly happening in your case, I'm not sure at this point what that would be. I know you tried taking things back to a default theme, but did you also disable all other plugins?

  11. sdk
    Member
    Posted 9 months ago #

    I didn't disable other plugins... I'll try that next. thx.

  12. Barry Hughes
    Member
    Plugin Author

    Posted 9 months ago #

    Great!

  13. phonecalls
    Member
    Posted 5 months ago #

    I realize this is a few months old, but I thought this might be helpful for anyone else experiencing this problem.

    My Settings

    • My Events URL slug for The Events Calendar was set to calendar.
    • I also had a WordPress Page titled "Calendar" with the slug calendar.
    • I use WordPress' default Menus manager to create and display my Primary Navigation. In my menu structure, I added the WordPress Page "Calendar."

    My Expectation

    • When a user goes to The Events Calendar's main page and event subpages, the "Calendar" link in the primary navigation highlights to signify active page/section.

    The Problem

    • The "Calendar" link never highlighted. WordPress failed to add an active class (.current_page_item) to the "Calendar" menu item when I was on The Event Calendar's main page.
    • This was true regardless of the theme I was using.

    The Fix

    • Delete the WordPress Page titled "Calendar" with the slug calendar.
    • Delete the WordPress Page "Calendar" from the menu structure.
    • Add a link with The Events Calendar's main page URL (<home_url>/calendar in my case) to the menu structure.

    From here, WordPress should start adding the active class to The Event Calendar's main page and event subpages.

  14. leahkoerper
    Modern Tribe Support Rep
    Plugin Author

    Posted 5 months ago #

    Thanks phonecalls!

Reply

You must log in to post.

About this Plugin

About this Topic

Tags

No tags yet.