Styling Menu in a single exhibit.

jesshami / 2009-11-22 21:51:45   

Hi,

I'm trying to edit the styling of my menu for a single exhibit within a section. I've seen the other posts that single out the sections, but I can't figure out how to grab just one exhibit.

This is the site and I want to make the menu background black on the "clients" exhibit without affecting everything else in the about section.

Any help would be much appreciated. Thanks!

Vaska A / 2009-11-22 21:58:03   

We've posted this solution around here a few times before...I'm trying to remember exactly...but you might give a search on this if it doesn't work.

  1. body#section_id_1 #menu { backgound: #000; }

Something like that...

jesshami / 2009-11-22 22:17:05   

Sorry that's what I was trying to say. I've seen those posts and implemented that styling. But that styles everything within the section.

I'm trying to style one individual exhibit,not the whole section. (only "clients" not "contact" and "profile")

Vaska A / 2009-11-22 22:23:50   

Ah yeah...I posted that somewhere too (or, I should say, somebody posted that - I don't know if it was me)...you need to add a little markup to the template to get the body#id more specific (with the page id).

I'd try to find...but I'm really too sleepy right now...can only point to things.

;)

jesshami / 2009-11-22 22:28:29   

Cool thanks I'll keep searching too, wasn't having much luck before but knowing its out there somewhere helps.

jesshami / 2009-11-22 23:45:18   

I couldn't find the past posts, but I did figure out how to do it. If anyone is curious change the index to:

  1. <body id='section_id_<%title%>'>

and then the css can be

  1. body#section_id_Profile #menu {background-color:#00ffcc; }

...or whatever just plug the name of the exhibit you are trying to target where it says "profile".

Vaska A / 2009-11-22 23:46:49   

Bingo...I'll add this thread to the Useful Threads stuff...

pilunique / 2010-04-21 13:05:48   

I would like to change only the font colour my home (main) site... unfortunately I don't get it... can you help me?
where exactly do I have to change the index?
and where and what exactly do I have to write into the css?

Thank you!

a very grateful "dummy" :-)

myWebpage

bin / 2010-04-21 15:52:40   

hi pilunique, how did you mange to link your sectin title directly to pages? I posted this questions in different threads, but haven't got any solutions yet.

what i meant is for example, when you click "home", or "agenda", it links to your content page directly, not via a sub-menu. What did you do get this link working? thanks.

Bin

arsondpi / 2010-04-21 19:28:55   

Please do not double post things. Read the forum rules. Thanks.

pilunique / 2010-04-22 11:08:54   

via preferences I just switched off the "display section titel". so what you see is only a single exhibit. not very elegant. but it works.

I would like to have this effect with a drop down menue. but I don't now how that works...
anybody out there who knows how???

bin / 2010-04-22 19:42:54   

thanks pilunique, it's fixed now :)

I am not sure if it works with drop down menu, but i had same problem with expand menu, and it's fixed by the suggestion from Aarsondi, see thisthread
is that what you meant?

wessmanner / 2010-10-16 22:07:40   

Hi, I am also trying to change the menu background color for my specific exhibits. I did as said above:
1.

and then the css can be

1. body#section_id_Profile #menu {background-color:#00ffcc; }

however this doesn't seem to work for exhibitions that have multi-word titles. Any help?

Thanks!

wessmanner / 2010-10-24 20:25:19   

Vaska? Anyone?

lemathieu A / 2010-10-25 07:38:42   

And your site is ?
Forum rules please…

wessmanner / 2010-11-17 06:56:46   

oh i'm sorry. my site is www.ericawessmann.com

wessmanner / 2010-11-17 06:57:26   

help would be great.
i can get it to work for exhibits with only single word titles

arsondpi / 2010-11-17 09:56:34   

...not sure what you mean. It works fine from my end...

wessmanner / 2010-11-17 14:51:26   

Oh. So basically I am trying to get it so when you go to a specific section the background color of the menu on the left will change.
I think when you just looked I had it on a theme where it kind of worked (the color changed for the Section, rather than the exhibit).
I just changed the theme to what I have been trying out.
In the exhibit 'nickname' the menu color changes,

(I wrote in my style sheet:)

body#section_id_NickName #menu {background-color:#00ffcc; }

(and in my css:)

but I can get it to work for other exhibits with multiple word titles.

Here's the link again:
www.ericawessmann.com

arsondpi / 2010-11-17 22:16:51   

...so you want the menu to change colour when the cursor hover over it (a different colour for each exhibit)?

wessmanner / 2010-11-18 00:16:37   

No when you are in the exhibit.
I want to be able to define the menu color specifically for each exhibit.
I have basically figured it out accept for the hurdle of exhibits which have multiple-word titles

arsondpi / 2010-11-18 00:31:00   

Oh... Now I understand.

Then I suggest you replace the opening body tag of your index.php, with

  1. <body class='page_style_<%id%>'>

This will translate to

  1. <body class='page_style_XX'>

where XX is the id number of your exhibit in your database.
To find this number click an exhibit, view the source code of the page and check the number in the body tag.
Then add in your style.css

  1. .page_style_XX #menu { background-color: red; }

For example to get the menu in your main/home page red add in your css:

  1. .page_style_1 #menu { background-color: red; }

wessmanner / 2010-11-19 05:18:42   

Wow! you got it! this is perfect and exactly what I have been trying to do. Thank you.

For anyone who is trying to style menu color specific to an exhibit, use this thread. It's perfect

christophercain / 2011-03-19 02:28:27   

Many thanks for the run down, works perfectly

hrvojeb / 2011-04-07 16:40:28   

What if I absolutely positioned two images which I want to be visible only on homepage?

See it here: mirelab.com

  1. In index I put this code:
  2. <body class='page_style_<%id%>'>
  3. <div id='andjeo'><img src='http://www.mirelab.com/andjeo.png'></div>
  4. <div id='lesh'><img src='http://www.mirelab.com/lesh.png'></div>
  1. and in CSS this code:
  2. #andjeo {
  3.     text-align: right;
  4. }
  5. #lesh {
  6.     text-align: right;
  7.     position: absolute; 
  8.     bottom: 0px; 
  9.     right: 0px;
  10.     z-index: 1;
  11. }
  12. .page_style_XX #andjeo {visibility: hidden; }
  13. .page_style_XX #lesh {visibility: hidden; }
  14. .page_style_1 #andjeo {visibility: visible; }
  15. .page_style_1 #lesh {visibility: visible; }

It is not working, meaning images are always visible.

hrvojeb / 2011-04-07 16:42:33   

Of course, I'd appreciate any help I can get.
Thanks.

hrvojeb / 2011-04-07 16:42:49   

Of course, I'd appreciate any help I can get.
Thanks.

hrvojeb / 2011-04-07 16:43:30   

Of course, I'd appreciate any help I can get.
Thanks.

hrvojeb / 2011-04-07 16:45:03   

Oh, sorry for this. Got some strange behavior from my browser.

Vaska A / 2011-04-07 16:49:08   

hrvojeb...

i wonder if it would be better to post a new thread for this? and, link to some images or pages that can illustrate what you want to do exactly? i don't quite understand...

;)

hrvojeb / 2011-04-07 17:00:45   

OK. I will.

Teodorik / 2011-09-02 06:41:17   
  1. Hello,
  2. I dont know if it good but I discovered if I write 
  3. <body class='section-<%section_id%> section_id_<%title%>'>
  4. I can use both of them (styling section with styling a page separately).. 
  5. very useful for me.. what do you think? I dont know if some one wrote this before .) 
Teodorik / 2011-09-02 06:41:55   

Sorry for code post!

This thread has been closed, thank you.