Jump to content


Photo
- - - - -

Blog On Navbar Is Highlighted When Another Navbar Item Is Selected

navbar blog page Event Calendar plugin Simple CSS Lite

  • Please log in to reply
9 replies to this topic

#1 dgosine

dgosine

    Advanced Member

  • Members
  • 32 posts
  • Framework Version:2.3.4
  • Country: Country Flag

Posted 10 November 2012 - 10:20 AM

Hello,
I am having this strange problem with the Navbar. I am using the Event Calendar plugin (By modern tribe) and Simple CSS Lite plugin. I did disabled all the other plugin's and switched to the Twenty Eleven theme to confirm that the event calendar was not causing this problem.

When the "upcoming events" or "Calendar" is selected it will also highlight the "blog" in the navbar, this does not happen when the other pages are selected. At first i was just using pages as the menu, thought i might have to create a menu to solve the problem, confirmed that did not work. I am guessing that this is cause there is some kind of walker filter on pagelines themes, but this is just a guess. If i select "Blog" it will not highlight the "Calendar" or "Upcoming events" .

The link of the site is

Please Login or Register to see this Hidden Content



Thank you

#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 10 November 2012 - 06:42 PM

Dave, I suspect that there's a CSS conflict somewhere. Did you add any custom CSS code? If so, was that validated?

In Firebug, I see lots of customizations that appear to include many classes. This is what's causing the red background:

Please Login or Register to see this Hidden Content


I suspect that the reason is more likely the concept that the Blog is a special page and falls under one of the other elements cited above, where the event calendar is an equal.

You may be able to resolve this by adding a unique class to the Blog link in Appearance > Menus. Let me know what CSS you currently have added and if you've validated it.

#3 dgosine

dgosine

    Advanced Member

  • Members
  • 32 posts
  • Framework Version:2.3.4
  • Country: Country Flag

Posted 12 November 2012 - 02:31 AM

Hello,

I have only added the following CSS code in my " pagelines-customize" plugin.

.widget-title {
font-size:24px;
}

#morefoot .widget-title {
color:#F5E6A7;
font-size:20px;
text-align:center;
background-color:#000000;
}

p {
text-align: justify;
}

.pprow {
margin-top:-75px!Important;
}

/*.content .content-pad {
padding: 15px 15px 15px;
}
#site #page, #site #dynamic-content {
min-height: 300px;
}*/

.section-carousel .thecarousel {
background-color: #FFFFFF;
background-image: -moz-linear-gradient(center top , #FFFFFF, #FFFFFF);
background-repeat: repeat-x;
border: 1px solid #FFFFFF;
box-shadow: 1px 1px 0 #FFFFFF inset;
display: none;
overflow: hidden;
padding: 15px 67px;
position: relative;
}

I am wondering if Simple CSS Lite could be the cause of all the custom CSS code? Also, i am confused on what you mean by this "You may be able to resolve this by adding a unique class to the Blog link in Appearance Menus." I have entered in CSS Classes (optional) for Calendar, Upcoming Events, and Blog. It did not change anything. Could I have missed something?

Dave

#4 Danny

Danny

    Is Awesome!

  • Moderators
  • 16342 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 12 November 2012 - 08:03 AM

This issue is related to the Simple CSS lite plugin and this line in the CSS code:

#page .main-nav li.current_page_parent a,

Are any of these pages a child page of the other, or a parent page ?

If so, this is the cause of the issue. If no page is a parent or child page, then I recommend you contact the author of the simple lite plugin and inform them of the issue.

#5 dgosine

dgosine

    Advanced Member

  • Members
  • 32 posts
  • Framework Version:2.3.4
  • Country: Country Flag

Posted 13 November 2012 - 03:47 AM

Hello,
The "Calendar" and "upcoming events" would be child pages off of the "schedule page". This is what i am guessing as i can not change the page attributes of the "Calendar" and "upcoming events". The "Schedule" is set as no parent.
Dave


#6 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 13 November 2012 - 05:15 AM

You could try to use css to mask this effect on those pages only. I'm not sure if the below would work but try it. Replace x with the page id for the calendar page.

Please Login or Register to see this Hidden Content



#7 dgosine

dgosine

    Advanced Member

  • Members
  • 32 posts
  • Framework Version:2.3.4
  • Country: Country Flag

Posted 13 November 2012 - 02:40 PM

James,
I have entered in that code, but it did not seem to do anything.
Dave

#8 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 13 November 2012 - 02:54 PM

The easiest way to do it would be to make those two items NOT be a child of the other item, then the CSS won't apply. Deselect "schedule" as the parent of those 2 pages and you should be okay.

#9 dgosine

dgosine

    Advanced Member

  • Members
  • 32 posts
  • Framework Version:2.3.4
  • Country: Country Flag

Posted 14 November 2012 - 12:54 PM

Dear Jenny,
If i gave you a login, do you think you can check it for me? As the event calendar pages do not show up. The act like a special page.
Dave.

#10 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 14 November 2012 - 05:58 PM

Working with him privately to help.





Also tagged with one or more of these keywords: navbar, blog page, Event Calendar plugin, Simple CSS Lite