WordPress.org

Forums

The Support Forums will be in read-only mode for a scheduled maintenance window on 01 September 2016 14:00 UTC - 20:00 UTC. More information.

Multi-color Website Title (11 posts)

  1. Maltese Historic Pipe Organs
    Member
    Posted 2 years ago #

    I would like help with creating a multi-color title for my website. I have downloaded WP Title 2 v3.6 (as was suggested in one post) and don't know how to proceed.

    my site: mhpo.info
    title: Maltese Historic Pipe Organs

    I'd like to make the title look like this:
    Mal = white
    tese = red
    Historic = Green
    Pipe Organs = Gold

    Furthermore, is there any reference in order to know which code is for which color?

    Regards
    Mark

  2. Andrew Nevins
    Forum moderator
    Posted 2 years ago #

  3. Maltese Historic Pipe Organs
    Member
    Posted 2 years ago #

    Wow.... thanks for that link. Bookmarked! ;-)

    Now.... how to insert the codes into WordPress.... :-/

  4. Maltese Historic Pipe Organs
    Member
    Posted 2 years ago #

    What code should I insert and where?

    Does this make any sense?
    <span>Mal</span>
    span { color: #FFFFFF; }
    <span>tese</span>
    span { color: #FF0000; }
    <span>Historic</span>
    span { color: #00CC00; }
    <span>Pipe Organs</span>
    span { color: #B88A00; }

  5. Andrew Nevins
    Forum moderator
    Posted 2 years ago #

    span:first-child {
     color: #fff;
    }
    
    span:nth-of-type(2) {
     color: #FF0000;
    }
    
    span:nth-of-type(3) {
     color: #00CC00;
    }
    
    span:last-child {
     color: #B88A00;
    }
  6. Maltese Historic Pipe Organs
    Member
    Posted 2 years ago #

    So if I understand this correctly:
    span:Mal {
    color: #FFFFFF;
    }
    span:tese {
    color: #FF0000;
    }
    span:Historic {
    color: #00CC00;
    }
    span:Pipe Organs {
    color: #B88A00;
    }

    Now where should this go?

    Sorry to ask so many questions. I've been trying to unravel the mysteries of such coding only since a couple days, literally!

  7. Andrew Nevins
    Forum moderator
    Posted 2 years ago #

    nth-of-type, first-child and last-child are all part of CSS:

    nth-of-type:
    http://www.w3schools.com/cssref/sel_nth-of-type.asp

    first-child:
    http://www.w3schools.com/cssref/sel_firstchild.asp

    last-child:
    http://www.w3schools.com/cssref/sel_last-child.asp

  8. Andrew Nevins
    Forum moderator
    Posted 2 years ago #

    Now where should this go?

    Install this Custom CSS Manager plugin http://wordpress.org/plugins/custom-css-manager-plugin

    Then use its "CSS Code" section of the dashboard to hold your CSS modifications.

  9. Maltese Historic Pipe Organs
    Member
    Posted 2 years ago #

    Now I am completely lost! I still cannot understand the meaning of all these children! Though the links may be excellent references, one has to understand what it all means. It's like looking at an electronic circuit. Unless one knows what the symbols represent, one won't be getting very far!

  10. Andrew Nevins
    Forum moderator
    Posted 2 years ago #

    You may need the support of a CSS forum, like http://csscreator.com/

  11. Maltese Historic Pipe Organs
    Member
    Posted 2 years ago #

    Thanks. Your help was much appreciated.

Topic Closed

This topic has been closed to new replies.

About this Topic