Community Forums › Forums › Archived Forums › Design Tips and Tricks › Eleven40 Header
Tagged: eleven40 header
- This topic has 17 replies, 2 voices, and was last updated 10 years, 11 months ago by sterman7.
-
AuthorPosts
-
April 22, 2013 at 7:10 pm #37031sterman7Member
My site is http://marketandeconomy.com
I have been beating my head against my computer trying to get the Eleven40 header image to change. I followed the instructions on the following thread:
and cannot get my site to respond to the header change the darn blue keeps showing. Any help in what I am missing would be greatly appreciated;
I have switched the Header to Image in Genesis settings; uploaded a PNG file named logo.png to the blue theme images as well as the eleven40 images file; deleted and changed everything from the above noted thread and still I have the blue rectangle. Helppppp
April 22, 2013 at 7:55 pm #37038Brad DaltonParticipantIts a bit more complicated than other themes so i've written a tutorial on how to do this: http://wpsites.net/web-design/changing-header-image-custom-header/
April 22, 2013 at 8:21 pm #37042sterman7MemberBrad,
Thanks for the reply. I spent all afternoon on the instructions with the link you referenced. I simply want to have a small logo fill the space that is currently occupied by the blue textured rectangle. The thread I referenced from anitac seems like it should work for me where your write up seems to be for someone that wants to remove the header. I am just looking to use the space that the blue textured rectangle is taking up.
April 22, 2013 at 8:40 pm #37049Brad DaltonParticipantUnderstand. You'll need to remove the default header image first then add your logo which you can layer on a transparent background or edit the PHP and CSS files to change the header image dimensions. No quick and easy solution for this in my opinion.
April 23, 2013 at 9:18 am #37152sterman7MemberI have tried a mix of Brad's recommendations as well as anitac's in both of the above linked threads/instructions. My site is close but I cannot seem to get my logo.png to show in the space where the usual eleven40 image shows. What am I missing? http://marketandeconomy.com
April 23, 2013 at 9:50 am #37158Brad DaltonParticipantMy tutorial didn't show you exactly how to do that rather it showed how to remove the default image and add a normal header which is not exactly what you wanted, i know. Just thought it may help you to remove the default image.
I see you have removed it so you could add your image using different methods:
CSS in your child themes style.css file
Custom header like in explained in the tutorial.
Custom function
Genesis Simple Hooks plugin
Header logo pluginCab you please provide a link to your image and i will test it in Firebug first.
Example:
.header-image #title-area, .header-image #title, .header-image #title a {
display: block;
float: left;
height: 68px;
overflow: hidden;
padding: 0;
text-indent: -9999px;
width: 265px;
background: url ('http://path-to-your-image.png');
}
// And change the values
April 23, 2013 at 9:56 am #37161sterman7MemberIndeed it did. Now, I am stymied as to what is inhibiting my small logo from filling the space that the eleven4o header used to occupy. When one scrolls over the area that should show the eleven40 text/image there is still a hyperlink there but nothing shows. By my estimation my transparent background PNG image should be there.
April 23, 2013 at 10:07 am #37165sterman7MemberBrad,
THe link to the image is:
http://marketandeconomy.com/wp-content/themes/eleven40/images/logo.png
The letters are white so they show on a black background like the top of my site.
April 23, 2013 at 10:35 am #37174Brad DaltonParticipantI see you have already uploaded that image which is in the correct location in your header.
The reason its not displaying is because all the old code for the default header is over riding it.
If you look in the tutorial i linked to which i tested, it says to remove that CSS code.
Backup first before you do.
I deleted all that code in Firebug and your header logo displays.
April 23, 2013 at 10:43 am #37177sterman7MemberBrad,
Here is what is in my header currently. I removed what you said to in your tutorial but some of this other stuff I was not sure of.
/* Header
------------------------------------------------------------ */#header .wrap {
min-height: 68px;
}#title-area {
float: left;
width: 45%;
}#title {
background: url(http://marketandeconomy.com/wp-content/themes/eleven40/images/logo.png) no-repeat;
border-top: 0;
display: inline-block;
font-family: verdana;
font-size: 30px;
line-height: 1;
min-height: 68px;
margin: 0;
padding: 18px 25px 17px;
position: relative;
text-shadow: 0 1px #96430d;
}#title a,
#title a:hover {
color: #fff;
text-decoration: none;
}#description {
display: none;
}#header .widget-area {
float: right;
width: 48%;
}April 23, 2013 at 10:57 am #37182sterman7MemberThere is also this bunch of code after the header in the css sheet: Should this be history too?
/* Image Header - Partial Width
------------------------------------------------------------ */.header-image #title-area,
.header-image #title,
.header-image #title a {
display: block;
float: left;
height: 68px;
overflow: hidden;
padding: 0;
text-indent: -9999px;
width: 265px;
}.header-image #description {
display: block;
overflow: hidden;
}
/* Image Header - Full Width
------------------------------------------------------------ */.header-full-width #title-area,
.header-full-width #title,
.header-full-width #title a {
width: 100%;
}April 23, 2013 at 11:04 am #37184sterman7MemberAs my sits now I have removed everything under the old header code in the css sheet and added the following (adding my image url appropriately):
#header { max-width: 1140px; margin: 0 auto; width: 100%; height: 200px; background: url("replace-wth-full-image-url") no-repeat scroll 0 0 transparent; }
I dropped this code just before the responsive design section starts on the style sheet. And the site looks as it does. Still lost. Sorry for the trouble !
April 23, 2013 at 11:22 am #37189Brad DaltonParticipantThe tutorial i linked to works perfectly so you'll need to follow it exactly as is.
I tested it and wrote the tutorial when i was doing the job. Any other mods you made may cause issues.
April 23, 2013 at 11:26 am #37190sterman7MemberI am oh soo close. It appears to be working but on certain pages and not others. Most importantly it os not owkring on the home page but on others. Any thoughts??
April 23, 2013 at 12:06 pm #37200Brad DaltonParticipantI can see it on your home page. It was probably the caching at browser or server level.
April 23, 2013 at 12:13 pm #37205sterman7MemberDude your the f****** bomb. I really appreciate your help. If you need any financial guidance let me know.
April 23, 2013 at 12:40 pm #37213Brad DaltonParticipanthahahaha. I worked as a stockbroker for ten years so i guess we have a bit in common. Not sure how to make money with WordPress though?
April 23, 2013 at 12:56 pm #37225sterman7MemberDevelop blogs for advisors. This would be a niche just getting started since the regulators have been so tight fisted with allowing social media many advisors are just thinking of blogging. Plenty of room to educate and develop.
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.