Ho to Modify Area Below Footer

Sorry, I realize there is a typo in the title. It should read:

Kelly Theme: How to Modify Area Below Footer

Thanks
Mike

Hi Mike,

Please post a link to your site. Thanks!

Hi –

Here’s the link: https://bit.ly/2czAPnH

Thanks
Mike

1) remove or hide the color bar and

There are a few coloured bars in Kelly, could you specify which one you mean?

Do you want to change the colour of the bar to make it transparent or remove the entire bar, including its contents?

2) how to add text to the color bar (opposed to using a plugin like Footer Putter)

Again, please specify which bar you mean using the numbers from the screenshot above. Thanks!

Apologies, I somehow completely missed the part where you referred to the footer!

So let’s assume you’re referring to bar #3.

I’ll answer your questions shortly.

1) remove or hide the color bar and

This will make the blue colour transparent:

.site-footer {
  background-color: transparent;
}

Don’t edit the theme files directly, otherwise your changes will be overwritten every time the theme is updated.

An easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You’ll then add your custom CSS in the new stylesheet editor that’ll appear in your dashboard, under Appearance > Edit CSS. You could also install a standalone custom CSS plugin if you prefer.

2) how to add text to the color bar (opposed to using a plugin like Footer Putter)

It looks like you’ve already added your footer credit, maybe using a plugin. If you want to go a CSS route instead, add this to your custom CSS plugin’s editor:

.site-footer::after {
     content: "Copyright \0A9 2016 Love The Brain. All Rights Reserved. Mike Grossman Consulting";
     display: block;
}

You can add additional styling if you’d like to change the font colour, size, etc.

Let me know how it goes!

Hi Kathryn –

Thanks for responding to my question.

I’d like to add text to the .site-footer::after but I don’t know how to escape the tags. Here’s what I’d write:

"Copyright \0A9 2016 Love The Brain. All Rights Reserved. <a href="https://yahoo.com">Mike Grossman Consulting"</a>"

Any idea how to do this?

If I can’t get that part to work I’ll use Footer Putter and in my CSS:

.site-footer {
  display: none;
}

Thanks for your help!

– Mike

Any idea how to do this?

It’s not possible to add HTML within CSS content — for that sort of change you’d need to create a child theme and modify a theme file.

Making a child theme means your changes won’t be overwritten when you update the theme. If you’re new to child themes, you can explore these guides:

https://codex.www.ads-software.com/Child_Themes
https://www.smashingmagazine.com/2016/01/create-customize-wordpress-child-theme/

Keeping your theme up-to-date is strongly recommended to ensure you get bug fixes, security updates, and updates to keep the theme compatible with WordPress core.

If you’d like to go this route, just let me know and I can guide you with the file change needed.