• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

How to change color of footer

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › General Discussion › How to change color of footer

This topic is: not resolved

Tagged: change color, footer

  • This topic has 3 replies, 3 voices, and was last updated 10 years ago by DTHkelly.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • April 20, 2015 at 11:32 pm #148633
    blubutterfly
    Member

    Hi just wondering if anyone knows how to change the color of the footer in magazine pro?

    http://www.blubutterflynailtips.com
    April 21, 2015 at 1:22 am #148638
    Christoph
    Member

    Hi Justine,

    the code to change the background-color of the footer widgets is around line 1693 of the style.css:

    .footer-widgets {
        background-color: #222;
        color: #AAA;
        clear: both;
        font-size: 14px;
        padding: 60px 0px 20px;
    }

    The code to change the background-color of the footer is around line 1768:

    .site-footer {
        background-color: #222;
        font-family: "Raleway",sans-serif;
        font-size: 14px;
        text-align: center;
    }

    Just replace #222 with the color you want to use.


    https://www.christophherr.com | Genesis Customizations | Buy me a coffee

    April 21, 2015 at 2:48 am #148642
    blubutterfly
    Member

    Hi Christopher, thank you so much for this, I am very new at this not sure where to put the code? Any chance you could explain where to insert it?

    Thanks Justine

    April 21, 2015 at 6:17 am #148659
    DTHkelly
    Member

    This is CSS, so you can use a free plugin like https://wordpress.org/plugins/simple-custom-css/ to add CSS to your ChildTheme.

    Otherwise, offline using http://notepad-plus-plus.org/, open the magazine pro zip file, open style.css. Find line line 1693 and line 1768 and make the changes. Save. Upload to your site via cPanel or FTP. wp-content > themes>magazine-pro. it will over-write the existing style.css file.

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘General Discussion’ is closed to new topics and replies.

CTA

Ready to get started? Create a site or shop for themes.

Create a site with WP EngineShop for Themes

Footer

StudioPress

© 2025 WPEngine, Inc.

Products
  • Create a Site with WP Engine
  • Shop for Themes
  • Theme Features
  • Get Started
  • Showcase
Company
  • Brand Assets
  • Terms of Service
  • Accptable Usse Policy
  • Privacy Policy
  • Refund Policy
  • Contact Us
Community
  • Find Developers
  • Forums
  • Facebook Group
  • #GenesisWP
  • Showcase
Resources
  • StudioPress Blog
  • Help & Documentation
  • FAQs
  • Code Snippets
  • Affiliates
Connect
  • StudioPress Live
  • StudioPress FM
  • Facebook
  • Twitter
  • Dribbble