Community Forums › Forums › Archived Forums › General Discussion › Outreach Theme – Inline CSS puts my logo to the left
- This topic has 10 replies, 4 voices, and was last updated 10 years, 7 months ago by DarralynC.
-
AuthorPosts
-
August 8, 2013 at 5:59 am #54852BrettOnTheNetMember
Hi
I am using Outreach theme. I had managed to center the logo image previously, but when I upgraded to 2.0 I lost that, and it headed back to the left again.
I have not been able to work out what I did to make it work last time. Outreach seems to put some inline css into the header with the !important, so any changes to style.css do not work.
<style type="text/css">#header { background: url(http://paparangiscouts.org.nz/wp-content/uploads/cropped-scouts-header.png) no-repeat !important; }</style>
I've fudged a solution, by putting the css I want into the footer, so I now have two css statements for the same #header.
Where can I change this behaviour in Outreach/Genesis so that I can center the heading. I'm guessing there is some simple thing that I have missed here.
My footer solution is rather inelegant!
Thanks
http://paparangiscouts.org.nz
brettAugust 8, 2013 at 7:43 am #54871IanPParticipantI had a similar header issue that was solved by implementing the following:
I would suggest removing the custom header function from your functions.php file. (backup first however)
Remove this:
/** Add support for custom header */
add_theme_support( 'genesis-custom-header', array(
'width' => 1060,
'height' => 120
) );August 9, 2013 at 2:01 pm #55312BrettOnTheNetMemberHi Ian
Thanks for that. I tried it, and it ended up completely removing my logo. All I was left with was the background that shows in the rest of the theme. It left the space for the logo, but no logo.
Cheers
BrettAugust 9, 2013 at 4:38 pm #55359BrettOnTheNetMemberI've managed to get my additional inline CSS into the header now (using Genesis Extender from CobaltApps), but I still have two inline statements and would like to get rid of the incorrect one.
Anybody got any ideas?
August 13, 2013 at 10:13 pm #56231DarralynCMemberHow did you get this back centered? I am new at this...but it seems like it should be a simple fix?
Thanks.
http://ccsmain.carmeleducationalfoundation.orgAugust 17, 2013 at 4:30 pm #57096BrettOnTheNetMemberI used the Genesis Extender plugin from Cobalt Apps and inserted the CSS I wanted to use into the header, so that it appears after the inline CSS that is causing the problems.
<style type="text/css">#header { background: url(http://paparangiscouts.org.nz/wp-content/uploads/cropped-scouts-header.png) no-repeat center !important; }</style>
If you look at the source of my site you will see this:
<style type="text/css">#header { background: url(http://paparangiscouts.org.nz/wp-content/uploads/cropped-scouts-header.png) no-repeat !important; }</style> <style type="text/css">#header { background: url(http://paparangiscouts.org.nz/wp-content/uploads/cropped-scouts-header.png) no-repeat center !important; }</style>
Two CSS statements saying basically the same thing except the second one centers it.
It's a bit of a hack, but it works
August 24, 2013 at 4:56 pm #58635DarralynCMemberHi, Brett!
Thanks for the code...I am just not sure how to insert?
Genesis Child Theme Outreach Stylesheet.css?I also I looked for the Genesis Extender Plugin - Cobalt Apps and couldn't find it?
Can you give direction?
Thanks.August 25, 2013 at 4:53 am #58687BrettOnTheNetMemberThe Genesis Extender Plugin is not free, but you can see it here: http://cobaltapps.com/downloads/genesis-extender-plugin/
But you could do this with something like Genesis Simple Hooks as well: http://wordpress.org/plugins/genesis-simple-hooks/
All I did was add the CSS above to the wp_head hook.
When I use the Genesis Extender plugin this puts my line of code directly below the line of code that comes from the theme. I can't guarantee that the Genesis Simple Hooks would do the same thing.
August 25, 2013 at 4:54 am #58688BrettOnTheNetMemberSo you don't add it to the CSS stylesheet ... It's got to be added to the code of the site itself.
There might be a more elegant way to do it, but this is the best I could find.
August 25, 2013 at 5:03 am #58691Brad DaltonParticipantJust published a post on this.
You can simply upload your logo to the images folder and remove the PHP which adds support for a custom header.
As long as the logo is 120px height and 400px width it will center.
Otherwise you will need to change the values for the height and width in your style sheet.
All changes should be made by copying the CSS rules to the end of the file and not to the original code as its hard to find and manage modified code that way.
August 28, 2013 at 8:27 am #59214DarralynCMemberHi, Brad and Brett!
The simple hooks solution worked like a charm! It put it right back in the center.http://ccsmain.carmeleducationalfoundation.org
Thanks.
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.