• Resolved Mr Robville

    (@mr-robville)


    Now that I have the template running as it should, I’m trying to change the color scheme to my liking.

    I’ve managed to edit almost the entire site’s color scheme except a few bits that I’m unable to find in the style.css file:
    https://i102.photobucket.com/albums/m104/mrr_03/mrr_03082/Colors.jpg

    The white text marked in red are the bits I want to change to black.
    All heading colors are set to black and there is no color code of #ffffff to be found within the style.css file. Yet these bits still remain white.

    There is also a black box around the “see all” button. I want to remove this as well and just keep the text itself instead.

    Does anyone know which file this color information belongs to?

    One other small question,
    My news page still says “Blog” above the news posts:
    https://i102.photobucket.com/albums/m104/mrr_03/mrr_03082/blog.jpg
    I want to get rid of that or change it to something else but alike the white colors I’ve been unable to find which file this information belongs to.

Viewing 8 replies - 1 through 8 (of 8 total)
  • It is impossible to tell you where to find the CSS that sets the color of a specific element just by looking at a picture. I don’t suppose you can post a link to your site? Otherwise, I would suggest using a web debugging tool like Firebug or Chrome Developer Tools to examine your site. You should be able to find the CSS rules that you need to override.

    Thread Starter Mr Robville

    (@mr-robville)

    Sure! Here’s the link:
    https://www.futurity-game.com/wordpress/
    Let me know if you need any more information.

    This rule will change all of the text that you want from white to black:

    .sf-menu a,
    .sf-menu > li > a:hover,
    .sf-menu > li.sfHover > a,
    .sf-menu > li.current_page_item > a,
    .header-title h3,
    .post-meta,
    .post-meta .comments-link,
    .popular_posts li h4 a {
       color: #000;
    }

    To change the See All button (actually all buttons):

    .button {
       background: transparent;
       color: #000;
    }

    However, it looks like you already have some custom CSS with this rule:

    .button {background:#000000}

    So maybe you can change it there.

    You can get rid of the word Blog with this CSS:

    .blog .header-title {
       display: none;
    }

    Except you’ll probably want to add some spacing before the first post entry:

    .blog .posts-wrap {
       margin-top: 10px;
    }

    Thread Starter Mr Robville

    (@mr-robville)

    Thanks a lot for looking into it!
    Forgive me for asking, but are there certain lines I need to replace with this code in the css file?
    I’m not very experienced yet when it comes to editing style sheets. I seem to be unable to find exactly where to put this in order to take effect.

    In general, you should not edit any of the theme’s files, because if the theme ever gets upgraded (either because of a feature enhancement or a security patch), your changes will be overwritten and lost. Instead, it is recommended that a child theme be created. If you are just making changes to the CSS, you can do so by creating rules which override the existing rules, and adding them either through a child theme, or using a plugin which supports custom CSS like JetPack or Custom CSS Manager (some themes have a Custom CSS option which you should first check). So if you are just making CSS changes, you don’t have to create a child theme, but use a plugin, instead.

    Thread Starter Mr Robville

    (@mr-robville)

    Thank you for the explanation and mentioning the plugin! It is indeed good practise to make any modifications within there.
    I’ve added the lines of code you provided and most text is now black and the blog title is gone. This looks way better.

    There are still some white links within the “about” box on the main page. Is it also possible to make these black as well?
    I don’t mind the white dates within the blue boxes, now that I look at it again.

    The black box around the “See all” button doesn’t seem to have been gone. I tried some different kinds of codes to get rid of it but none worked.

    There are still some white links within the “about” box on the main page. Is it also possible to make these black as well?

    Add this selector to the first rule:
    .toggle .trigger,
    As far as the buttons go, as I mentioned earlier, there’s some CSS which is in a section that I believe is part of the theme’s customization. Try going to Appearance > Customize and see if there’s an option for setting the button color. Otherwise, change the second rule so it looks like this:

    .button-wrap .button,
    .wrapper .button {
       background: transparent;
       color: #000;
    }
    Thread Starter Mr Robville

    (@mr-robville)

    The Customize menu does indeed feature an option to set the link color, which I set to black. However, if I set the color back to default, the box was gone, but some of the black text links would become white again as well.
    Your code however, solved the issue.

    Observing the code you’ve given me I’ve managed to find the bit for the expandable texts as well and colored them blue:

    .toggle .trigger {
      color: #0a99e7;
    }

    Once again thanks a lot for the help you’ve given me. Problem solved!

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Can't find text color information & Blog page name’ is closed to new replies.