WordPress.org

Ready to get started?Download WordPress

Forums

Customizr
Change feature article's title font color (7 posts)

  1. Seen Chew
    Member
    Posted 1 year ago #

    I want to change the color of the feature article's title to red. My site is http://seenees.co.nf
    I want the words "Sheila", "Ching", and "Daughter" to be in red. I tried to put this in the custom CSS but it's not working but I have zero knowledge in coding and just started on WordPress 2 days ago so I'm just trying to use my common sense based on what I've read.

    .entry-title {
    font-size: 0px;
    font-color: red;
    }

    I don't want the page title to show up in the actual page (hence font size is zero) but I do want it to show on the Frontpage (which it is) but I want to change it's font colour.

    Can someone teach me how please?

  2. Tara
    Member
    Posted 1 year ago #

    Try using - for example - a tool like Firefox with the Firebug add-on for this kind of CSS work. http://getfirebug.com/ . Help info on Firebug https://getfirebug.com/faq/
    Also, check this plugin: http://wordpress.org/plugins/custom-css-manager-plugin/

  3. ElectricFeet
    Member
    Posted 1 year ago #

    A great intro to firebug is this video. It shows you how to inspect an element on your site and how to play with firebug realtime to see what things would look like if you made them permanent.

    I also really like her CSS intro videos. Here's her first. You can see the others on her channel. She takes things at just the right pace for a complete beginner (which I was a month ago).

    To remove the headings on the pages, you shouldn't set the font size to 0px, because this doesn't really do what you intend: it leaves all the vertical margins, padding etc. So yes, the text is invisible, but (in this case) it leaves a lot of vertical space hanging around that you don't need. Better would be to use:

    .page .entry-title {
    display: none;
    }

    That deletes the entry title on the pages. If you want to delete it from posts, use:

    .post .entry-title {
    display: none;
    }

    The CSS you need for your front page is:

    .marketing h2 {
        color: red;
        font-weight: normal;
    }

    You can either put it in a child theme (which 2createawebsite also covers) or in the Custom CSS section of Customiz'it!

    The .marketing singles out the specific fontpage featured titles, rather than all the h2s. So you should see the red only only on the front page.

    Good luck!

  4. Archimedesign
    Member
    Posted 1 year ago #

    Edit: ElectricFeet was faster and his solution is better with the use of .marketing .

    h2 {
    	color: red;
    }

    or if you want to play with the font size too it's:

    h2 {
    	font-size: 20pt;
    	color: red;
    }

    Note, this will change all h2 text on your website.

    Just check your pages in case the text is changed anywhere else.
    Thanks for your inspiring work with colours!

  5. Seen Chew
    Member
    Posted 1 year ago #

    Thanks ElectricFeet - it worked and thanks also for the tips about removing the headings in my pages and explaining a bit about firebug.

    @Archimedesign - thank you for the help and your compliment is very much appreciated. I like to experiment with unconventional colour combination and it's always nice when someone appreciates it :)

    @Tara - I will check it out. Cheers!

  6. Kellogges
    Member
    Posted 1 week ago #

    I have this same problem but I've tried all the suggestions here and my titles aren't changing can anyone help my website is

    http://www.bluemooncafesheffield.co.uk

    I want to change feature page titles and page titles to white. Also remove the icon but again tried lots of different bits of code and nothing is working.

    This is what I have in my custom css at moment if that helps

    .navbar .navbar-inner {
    -webkit-box-shadow: 0px 0px 0px;

    -moz-box-shadow: 0px 0px 0px;
    box-shadow: 0px 0px 0px;
    background:none
    }

    .navbar .nav > li > a, .navbar .nav > li > a:first-letter {
    color: black;
    text-shadow: none;
    }
    .brand.span3 {
    display: block;
    float: none;
    margin: auto !important;
    }
    }
    /* Center tagline */
    .span7.inside.site-description {
    float: left;
    margin-left: 15%;
    margin-top: -30px;
    display: block;
    }

    /*Slider size*/
    .carousel .item {
    line-height: 250px;
    overflow: hidden;
    min-height: 500px;

    .round-div {
    border-color: #000000; /* Change #000000 to background-color */
    }

    .page .entry-title {
    display: none;
    }

    h2 {
    color: white;
    }
    .breadcrumbs {
    display: none;
    }

  7. rdellconsulting
    Member
    Posted 1 week ago #

    @kelogges, please start a new thread. Not considered good practice to append to old posts.

    Use the 'code' button to surround your css.

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic

Tags

No tags yet.