Jump to content

Archived

This topic is now archived and is closed to further replies.

micstepl

Individual Hero Nav Style (by groups of pages)

Recommended Posts

micstepl+    15
micstepl

Is there a possibility to create custom CSS ...

  • that adds different style options
  • to different menues on a site (on fdiffernt sites)
  • ... which bypasses the General setting scheme

 

Reason for that is, that I want to have some sort of different color coding on different pages (eg. Text color).

Using this class to than enter the new class into the respektive sections "Custom Styling Classes".

 

br

,Michael

Share this post


Link to post
Share on other sites
Guest   
Guest

micstepl,

 

Yes it is possible, but there is no built-in feature in Hero Nav to accomplish that if that's what you're asking?  The Hero Nav styles are global and apply to all instances of the section and you can't simply change one of the styling options for it on one page.

You would need to create those styles yourself and apply them on the pages you want to change.

To do that, you could use the unique page-id class that is added to the body, or you could use a more sophisticated tool like my Page{LESS} extension.

 

Hope that helps!

Share this post


Link to post
Share on other sites
micstepl+    15
micstepl

micstepl,

 

Yes it is possible, but there is no built-in feature in Hero Nav to accomplish that if that's what you're asking?  The Hero Nav styles are global and apply to all instances of the section and you can't simply change one of the styling options for it on one page.

You would need to create those styles yourself and apply them on the pages you want to change.

To do that, you could use the unique page-id class that is added to the body, or you could use a more sophisticated tool like my Page{LESS} extension.

 

Hope that helps!

 

not really :(

 

WORKING

I tried to  to change style with code below, which works when inserting in the custom code field. It overrides than the global settings, but un all NAV´s.

 

NOT WORKING

If I wrap code bist in custom classes and insert the classes than in the Section it doees not work.

 

pls help

tax in advance

,Michael

 

 

 

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
 
.section-hero-nav .hero-nav .hero-nav-ul.separated > li {
border-right: 1px solid #afafaf;
}
 
.section-hero-nav .hero-nav .hero-nav-ul > li > a {
color: #0099ff;
}
 
.section-hero-nav .hero-nav {
background-color: #afafaf;
shadow: silver 0 -6px 6px;
border-bottom: 1px solid #afafaf;
}
 
.hero-nav-collapse-btn {
padding: 4px 8px;
font-size: 1.0em;
}
 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 
 
eg. 
 
 
.MyOwnClass {.section-hero-nav .hero-nav .hero-nav-ul > li > a {
color: #0099ff;
}
}
 

Share this post


Link to post
Share on other sites
Guest   
Guest

micstepl,

 

Sorry to hear you're having trouble styling Hero Nav the way you want Michael.  I can offer some suggestions but custom coding like this is really outside the scope of this forum.

 

 

You can achieve different styles on different pages by nesting your styles in the class for the specific page you want to style.

 

You could try something like this, using the following LESS as an example:

// assuming page id is 50
body.page-id-50 {
	.section-hero-nav .hero-nav .hero-nav-ul.separated > li {
	border-right: 1px solid #afafaf;
	}
	 
	.section-hero-nav .hero-nav .hero-nav-ul > li > a {
	color: #0099ff;
	}
	 
	.section-hero-nav .hero-nav {
	background-color: #afafaf;
	shadow: silver 0 -6px 6px;
	border-bottom: 1px solid #afafaf;
	}
	 
	.hero-nav-collapse-btn {
	padding: 4px 8px;
	font-size: 1.0em;
	}
}

// assuming page id is 52
body.page-id-50 {
	.section-hero-nav .hero-nav {
		background-color: @gray;
	}
}

Simply inspect the body tag on the page you want to customize to see the relevant page-id-X class to use.

 

Like I mentioned before, this is what my PageLESS extension is designed for - custom styles for individual pages/posts.  No need to fuss with these classes.  You can define your own custom styles for any page/post using LESS/CSS.

 

Good luck!

Share this post


Link to post
Share on other sites
micstepl+    15
micstepl

micstepl,

 

Sorry to hear you're having trouble styling Hero Nav the way you want Michael.  I can offer some suggestions but custom coding like this is really outside the scope of this forum.

 

 

You can achieve different styles on different pages by nesting your styles in the class for the specific page you want to style.

 

You could try something like this, using the following LESS as an example:

// assuming page id is 50
body.page-id-50 {
	.section-hero-nav .hero-nav .hero-nav-ul.separated > li {
	border-right: 1px solid #afafaf;
	}
	 
	.section-hero-nav .hero-nav .hero-nav-ul > li > a {
	color: #0099ff;
	}
	 
	.section-hero-nav .hero-nav {
	background-color: #afafaf;
	shadow: silver 0 -6px 6px;
	border-bottom: 1px solid #afafaf;
	}
	 
	.hero-nav-collapse-btn {
	padding: 4px 8px;
	font-size: 1.0em;
	}
}

// assuming page id is 52
body.page-id-50 {
	.section-hero-nav .hero-nav {
		background-color: @gray;
	}
}

Simply inspect the body tag on the page you want to customize to see the relevant page-id-X class to use.

 

Like I mentioned before, this is what my PageLESS extension is designed for - custom styles for individual pages/posts.  No need to fuss with these classes.  You can define your own custom styles for any page/post using LESS/CSS.

 

Good luck!

 

 

Thanks SOOOOOO much :) I really appreciate your tip - it worked!#

 

I can only recommend you as a developer for your pragmatic, competent support!

 

br

,Michael

Share this post


Link to post
Share on other sites

  • Similar Content

    • vikzee
      By vikzee+
      Hero Nav 1.3
      DMS 2.1.9.3
      Wordpress 4.2.2
      I just downloaded the latest version of Hero Nav from my Pagelines account but when I try to upload it to the plugins page it gives me this error:
      The package could not be installed. No valid plugins were found.
      Plugin install failed.
      So I unzipped the package and find that all it contains is a README file.
      Can you send me the latest version (vikzee (@AT@) yahoo.co.uk) in it's entirety or re-load it to the Pagelines site so people who've paid for it can get the latest version?
      Thanks! 
    • AppLEaDaY
      By AppLEaDaY
      Hello.
       
      I did not personally install what I'm trying to fix. I'm working on a preexisting installation of WordPress and Pagelines.
      But when I arrived the problem was already there: just upon posts displaying in the hero nav main menu I get a "Home" link not working,
      due to a anchor completely missing the href attribute.
       
      I made some tests and I noticed what follows.
      The same problem occurs with every plain link I add that hero menu (not with pages), I mean with links showed as CUSTOM Curiously enough I found in a sublevel a link of that kind, it has somehow back in the past inserted by someone else, no me: it works just like it is supposed to do No problem of that kind in a fixed navigation bar (I tried to enable it) I underscore the mentioned problem occurs only when displaying posts, not with pages.
       
      Any clues? Since I'm afraid it may take a too long time to fix this specific problem, I also ask: could you possibly point to what I am supposed to read in order to do without the hero nav bar and use some other navigation bar in the same place of the template?
       
      Thanks in advance
       
       
      Andrea
    • limelight
      By limelight+
      Hello, I'm having a strange issue with the background of my Hero Nav drop-down being "see through". Can anyone direct me on how to make this solid black instead??  Thank you! 
       
      Site URL: http://multicolores.org/ And there is a drop-down menu when you hover over 'About'.
       
       
    • ScribbleGD
      By ScribbleGD+
      Hi there,
       
      Whenever I make changes to the formatting options in the Hero Nav section of Site Settings such as font base colour it doesn't appear to change the look of my nav bar,
       
      Any reason as to why this is happening? Screenshot attached.
       
      Thanks.
       
      URL - staging.scribblegraphicdesign.com.au
       
      Tim
       
    • webmktco
      By webmktco+
      Evan,
       
      I've had issues with making edits to the Hero Nav settings for a while now.  I've been able to work around the issue, but I thought I'd bring this to your attention.
       
      Do you know why this is happening and how to fix it?
       
      Here's the debug info: http://josephfoxdds.myddsdev.com/?pldebug=1

      WP: 4.0
      DMS: 2.1.1
×