CSS amends Forefront Theme

Home Forums Automattic Forefront CSS amends Forefront Theme

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #107726 Resolve

    Sustainable Finance Advisory

    Hello – I’m working with Forefront with the CSS upgrade, and I’m trying to do a couple of things but I can’t seem to get it to work.

    I think it’s because I can’t seem to access the original style sheet (even with Firebug).

    It would be great if someone were able to help me out as I’m getting increasingly frustrated! They seem to be very simple things I need to amend.

    1. I’m trying to hide all the page titles (and one category title in the primary navigation area) without using the custom menu workaround – I need to be able to see the page titles on the backend. Nothing I do seems to work.

    2. Once the page titles are hidden, I’d like to reduce the size of the blank space left by the hidden page title – any idea what code I should be using here?

    3. I’d like to reduce size of the font in the footer – actually across the site if possible.

    See? Simple! But for some reason, nothing is working. I’m wondering if there’s a glitch with our custom CSS or something?

    Anyway, any help would be super appreciated. Thanks so much…

    A —

    The blog I need help with is sustainablefinanceadvisory.wordpress.com
    #137725

    Michelle

    Hi A,

    Sorry you’ve been having a frustrating time of it. I’m happy to help you sort things out. :)

    1. I’m trying to hide all the page titles (and one category title in the primary navigation area) without using the custom menu workaround – I need to be able to see the page titles on the backend. Nothing I do seems to work.

    To hide page titles on the front-end, the following CSS should do the trick:

    .site-main .hero {
    display: none;
    }

    I’m not sure what you mean by hiding a category title in the primary menu. Can you clarify that? Thanks!

    2. Once the page titles are hidden, I’d like to reduce the size of the blank space left by the hidden page title – any idea what code I should be using here?

    The following code will reduce the spacing. “.content-area” is for the main content, and “sidebar-widget-area” is for the sidebar. Adjust the top padding accordingly depending on how much space you want.

    .content-area {
    padding-top: 0;
    }
    .sidebar-widget-area {
    padding-top: 5px;
    }

    3. I’d like to reduce size of the font in the footer – actually across the site if possible.

    I assume you are talking about the footer widgets? If so, try the following CSS:

    .footer-widget-area {
    font-size: 14px;
    }
    .footer-widget-area .widget-title,
    .footer-widget-area .widget-title a,
    .footer-widget-area .widgettitle {
    font-size: 15px;
    }

    To reduce the default font size across the entire site, try this:

    body {
    font-size: 15px;
    }

    You may still need to change some font sizes individually, if they are not using the default size.

    It looks like you’re using Firefox. If that’s your primary browser, you might find the Firebug plugin useful for testing out CSS changes.

    Alternatively, Firefox’s built-in web inspector tool contains a Style Editor that can help you view the original stylesheet as well.

    I hope this helps, let me know if I can provide further assistance!

    #137876

    Sustainable Finance Advisory

    Hey – thanks so much for this! Everything works but now the featured image, text and button on the homepage aren’t showing up….

    Any ideas?

    Thanks a million for this! You’ve been super helpful

    A —

    #137913

    Michelle

    Hi A,

    I’m so glad to help!

    The featured image, text, and button on the front page are not showing up because of this CSS rule:

    .site-main .hero {
    display: none;
    }

    I told you to add this rule in order to hide the page titles. But since you want the page title to show up on the front page, change that rule to this:

    body.home .site-main .hero {
    display: block;
    }

    #137957

    Sustainable Finance Advisory

    You are a hero! A total lifesaver – thank you a million times over xxxx

    #137958

    Sustainable Finance Advisory

    Sorry! Now the page titles are appearing on all pages….

    We need the homepage to display the title, copy and image, but no other pages to display names

    A —

    #137959

    Sustainable Finance Advisory

    Think I’ve figured it out – but is there any way to display the featured image, copy & button on the homepage, but NOT the page title?

    Thanks so much!

    #137989

    Michelle

    To hide the page title on the home page, try this:

    body.home .site-main .page-title {
    display: none;
    }

    #138037

    Sustainable Finance Advisory

    Thank you SO much – that works perfectly!

    x

    #138049

    Michelle

    You’re welcome! I’ll mark this thread as resolved, but feel free to start a new one if you have any other questions.

    Cheers,

    Michelle

Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘CSS amends Forefront Theme’ is closed to new replies.