Changing section title colours...

nped / 2010-06-25 00:24:33   

Hello,

I'm struggling to work out how to give a few of my section title's different font colours... I've searched the forum for ideas but I'm not having much luck doing it. I just want to change the section title colours not their style or the exhibit titles / general text.

Could I write something like this:

#menu ul li.section-title-1 { text-decoration: none; color: #fff00; }
section-title-2 { text-decoration: none; color: #333300; }
section-title-3 { text-decoration: none; color: #ff660; }
section-title-4 { text-decoration: none; color: #003300; }
section-title-5 { text-decoration: none; color: #009999; }
font-weight:bold;
font-size: 18px;

Any tips would be much appreciated.

Thanks,

NX
www.designdetailtrail.com

Vaska A / 2010-06-25 02:56:02   

That won't work because those id's or classname's don't even exist.

nped / 2010-06-26 20:21:02   

Hello Vaska,

I know this doesn't work as I tried it... Could you suggest how I should write it?

Sorry to be a pain, but I thought it might help to show how I thought it might be written to get feedback.

Thanks,

NX

Vaska A / 2010-06-26 21:24:20   

Ok...around line 184 in a function called 'sectional' you will find this:

  1. if ($out[0]['disp'] == 1) $s .= "<li class='section-title'>" . $key . "</li>n";

Edit this up - I would add a an id to get what you want...like...

  1. $secid = $out[0]['secid'];
  2. if ($out[0]['disp'] == 1) $s .= "<li id='section-title-{$secid}' class='section-title'>" . $key . "</li>n";

And then, you can style this up...

  1. #menu ul li#section-title-1 { ... }
  2. #menu ul li#section-title-2 { ... }
  3. #menu ul li#section-title-3 { ... }

Something like that. ;)

Vaska A / 2010-06-26 21:25:05   

And, you may need to take a color off of .section-title if you have one...

nped / 2010-06-27 10:56:42   

Thanks Vaska,

Really appreciate your help.
Will give it a shot now!

NX

nped / 2010-06-27 11:23:29   

Hello again,

For some reason the style.css file I have been working with doesn't have the function called 'sectional' you mentioned. Can I just add it and the lines you said to edit or does it include other lines...?

Thanks,

NX

Vaska A / 2010-06-27 11:37:49   

Woops...not there...in /ndxz-studio/site/plugin/index.php

Evidenti / 2010-08-01 18:11:18   

Hi there!

first of all, many thanks for this powerful tool! is really useful for 'code-ignorants' just as me

i followed the steps in this thread so that i can customize my menu titles and get them in different colors... I've spent most of the evening trying to fix it and when i thought i got it right (styled the #menu ul li#section-title-1 { ... } for all my section titles) just two of my section titles get the styling in the right way... Whatsmore, now i have an extra 'n' shown following my section titles

this is my site:

http://www.evidenti.com/main

i re-wrote the code in the first step in lines 133 and 184 from my /ndxz-studio/site/plugin/index.php, don't know if i'm messing it all, but i can't see what am i doing wrong...

any help would be much much appreciated, thanks!

Evidenti / 2010-08-01 20:49:49   

Ok, here again

i was able to fix the color from the section titles (i got the section order instead of the real section number), but still have an issue with the letter 'N' that appears after the section titles...

i believe it has something to do with the /ndxz-studio/site/plugin/index.php, but it's beyond my 'illustrator' skills.. here's the code:

lines 129-136:

  1. $s = '';
  2.     
  3. ¬†¬†¬†¬†foreach($order as $key => $out)
  4.     {
  5. ¬†¬†¬†¬†¬†¬†¬†¬†$s .= "< ul >n";
  6.         
  7. ¬†¬†¬†¬†¬†¬†¬†¬†$secid = $out[0]['secid'];
  8. if ($out[0]['disp'] == 1) $s .= "< li id='section-title-{$secid}' class='section-title' >" . $key . "< /li >n";

lines 179-186:

  1. $s = '';
  2.     
  3. ¬†¬†¬†¬†foreach($order as $key => $out)
  4.     {
  5. ¬†¬†¬†¬†¬†¬†¬†¬†$s .= "< ul >n";
  6.         
  7. ¬†¬†¬†¬†¬†¬†¬†¬†$secid = $out[0]['secid'];
  8. if ($out[0]['disp'] == 1) $s .= "< li id='section-title-{$secid}' class='section-title' >" . $key . "< /li >n";

this is the only code i've hacked in the file... hope it helps, don't have a clue where that 'n' come from... thanks again

Evidenti / 2010-08-01 23:15:17   

Well, fixed issue... but strange:

i deleted the 'n' at the end of the closing "< /li>" thing and it worked....

what i don't get is.. are the 'n' on the code 'expendable'??

samuel_barnes / 2010-12-28 00:31:13   

I tried this this morning. It allowed me to change the colours of each individual section heading, but it seems to have messed up my display. Text that should appear in the exhibits is not visible. Removing the background colour from the menu shows that it is being placed flush left, underneath the index.

Any suggestions as to how I can remedy this?

samuel_barnes / 2010-12-28 00:39:01   

Sorry. Site:

http://samuelrbarnes.net/

marioguerson / 2011-02-04 15:17:00   

Hey, Samuel!
Where did you get the info on how to make the submenus "appear" from bellow each year?

nagiko / 2011-04-07 07:11:30   

In this tread you can find howo to change the title colors:
http://www.indexhibit.org/forum/thread/7869/

What i need now it's find how to change not the titles, All the
  • .

    Is it possible? anyone knows how?

    thanks!

  • nagiko / 2011-04-07 07:12:21   

    Sorry, i need to change all de < li>
    ...

    tarky / 2011-04-20 18:22:47   

    hey folks this looks really exciting!

    I have applied these changes to /ndxz-studio/site/plugin/index.php but there is no visible effect on the < li > elements of the menu in the source code here:

    view-source:http://mollyoakfield.com/

    anything I am missing?

    Thanks!

    gf / 2011-04-20 19:32:08   

    To nped,
    Hi,
    How did you manage to keep the color in white of your Exhibition name titles, once clicked on?
    Did you add any line in your css?
    Thanks.
    gf.

    Vaska A / 2011-04-21 05:33:40   

    Yes...edit the a:visited state in style.css.

    gf / 2011-04-21 12:45:28   

    Thanks,
    In fact what I'm trying to do, is once you have clicked on the link I want it to appear "line-through" or "crossout" and stay like that.
    Right now this is my style.css, I've tried every possibilities with the text line-through but I can't get it to work.

    a:link { text-decoration: none; }
    a:active { text-decoration: none; }
    a:visited { text-decoration: none; color: #666; }
    a:hover { text-decoration: line-through; }

    Example:
    Greg and Greg

    Website

    This thread has been closed, thank you.