Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Does that theme come with a section in the dashboard named something similar to, “Custom CSS”, “Custom Styles” or “Jetpack”?
Hi Andrew
Other than the Editor (in the ‘Appearance menu’) there doesn’t seem to be anything like that. I’ve tried using the ‘Customize’ function in the Theme menu, but that deletes the site title and tagline rather than hiding it, which I think will then affect how search engines pick up the website?
Cheers
Chris
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Download and activate a Custom CSS Manager plugin. This’ll allow you to make specific CSS changes without modifying the theme’s files and therefore safeguard your changes when the theme updates.
Then, within the section of the dashboard allocated by the Custom CSS Manager plugin, enter this;
.headerblock {
display: none;
}
You should be using some-sort of browser developer tool for this kind of CSS debugging. I use Google Chrome’s built-in Developer Tool and found this underlying HTML and CSS structure http://snag.gy/PQ3Sd.jpg .
Hi, if you hide content, it will not get any value in search engines.
If you try to hide it with white colors, you may get penalized.
You can make it invisible if you open the style.css and locate:
.headerblock {
}
Inside this, you will add two lines:
display: none;
visibility: hidden;
After that is done, you can find the red colors..
Look for:
#header-widget-area {
It should contain:
background-color: #57100A; (line 55)
if you delete that line, the image will appear in full width.
But then the readability of your text suffers.
If you wish to replace all occurrences of the red color with something else, simply replace: #57100A with a new color of your choosing.
You can also do a search for this color if you wish to delete or modify manually. It is also located inside:
#access (your horizontal menu).
Ps. I use the dom inspector in google chrome to identify the matched styles. (right click->inspect item). You may have to “unpack” the items.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Thanks for all your help! I’ll apply what you’ve suggested and let you know how it pans out…
Cheers
Chris
Pasted Andrew’s code into the Custom CSS and it’s worked a treat! Thanks for your help, guys! 🙂
Hi
I’ve started putting together a second website using the same theme (Mad Meg), but when I pasted Andrew’s code into the Custon CSS Manager it didn’t get rid of the tagline this time. Am I doing somthing wrong?
Cheers
Chris
PS – new website is http://abriefhistoryofmusic.co.uk/
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
CSS works by selecting HTML elements. There probably are no HTML elements in your new website that match the previous.
Ah. I’m a bit of a CSS novice, I’m afraid! So even though I copied the entire stylesheet over from my other website that means that I can’t replicate all the changes I made?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Only the changes that aren’t apparent (i.e the code I first posted) can’t be replicated. I’d recommend this forum for CSS support http://CSSCreator.com/forum <- They specialise just in this and you can post as many CSS queries as you want 😉
Excellent! Thanks again for your help, Andrew. 🙂
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
And Thanks to you and Olavxxx for contributing to the WordPress community 🙂
I was able to hide the title and tag lines, but my site still has the blank space above the header image. Does anyone know how to remove that?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
You need to create your own thread to discuss that and if you’re using the Mad Meg theme then you can do so here: http://wordpress.org/support/theme/mad-meg#postform
