Header Placement in Piano Black

  • Resolved [email protected]

    (@blackspring413aolcom)


    12 years, 2 months ago

    Hello,
    I’ve recently switched over from wordpress.com and I’m having one serious problem. I want my own image as a header in Piano Black. I’ve been trying for several days to place a header into the Piano Black theme. I’ve tried to apply many of the other forum post’s directions but now I’ve come up with this problem. I deleted the top.png file and replaced it with my own top.png file, which is exactly the same size (959×159) but when I upload it my header doesn’t show the image and the header area is off to the right a little and the search box and twitter/rss boxes are all off to the right as well. I have not changed any other code. Anyone know what I’m doing wrong? I’ve really struggled with this I would appreciate any help.

    Sincerely,
    Chris

Viewing 15 replies - 1 through 15 (of 24 total)

  • Hi.
    What seems to be breaking your layout is not your header image, but your top menu. Try removing a couple of menu items or decreasing their padding through CSS so that they fit in one line.
    If that doesn’t fix it, post again here and I’ll take another look.
    Cheers!

    Thread Starter [email protected]

    (@blackspring413aolcom)

    Thank you Marventus.
    I removed some of my menu items and managed to get them on 1 line but that didn’t fix it. Still not sure. I’ve scoured the style sheet and can’t find anything that I can tell that would fix it. I’ll keep trying I guess. Thanks for your help.

    No pb.
    For your image to fit properly you need to remove the margin property to the #logo_image selector in your style.css file. However, you seem to have added an image that is entirely black, so you won’t actually see anything different other than it fitting properly.
    Cheers!

    Thread Starter [email protected]

    (@blackspring413aolcom)

    Thanks again Marventus. Your suggestion moved the header into the correct spot horizontally and then I figured out I had to also change another number to get it to fit vertically. So now it fits but the image isn’t there. I re-checked my file and it opens in photoshop correctly, but on the site it is black? Weird. Thanks so much for help. You’ve gotten me closer. I’ll keep messing with it. Thanks.

    Do you have the same problem when you use .jpgs instead of .pngs? Aldo, your site has several validation errors that might be causing this problem. Try fixing those as well just in case.

    Edit: I just realized you have a space in your image’ src attribute right before the name of the image. That’s why your pic is not loading properly.

    Thread Starter [email protected]

    (@blackspring413aolcom)

    I fixed the space in the src attribute and I’m trying to fix all the validation errors. I’m confused why there would be so many errors in a pretty popular theme. The errors as far as I can tell are all inherent in the theme and not something I’ve done to the theme. Should I just pick a different theme? I really like this one though and I’ve designed all my visuals based off of the colors and stuff. But the validation errors are getting into territory way above my head. Thanks for the help Marventus. I appreciate you taking the time.

    Hi.
    Your src value is still wrong. Right now, it seems to be:

    https://www.sublimationpressworks.com/wp-content/themes/piano-black/img/wp-content/themes/pianoblack/img/top.jpeg

    when it should be:

    https://www.sublimationpressworks.com/wp-content/themes/piano-black/img/top.jpg

    Notice the change in the URL path as well as in the image extension. As for your validation errors, if you want to get a clear picture of where they are coming from (theme or plugins), disable all your plugins and run the validator. It is not uncommon for there to be errors in themes, including Premium ones. It’s just… Well, the way it is, ??
    A good way of identifying validation errors is to compare the raw version with the HMTL Tidy version (setting in the validator for this) side by side for differences.
    But first things first: Try to fix the src attribute and let me know if it worked.

    Oh, BTW. I just spotted this in your <head> tag

    content="IE=EmulateIE7"

    That is a huge no, no, no in coding practices. You should get rid of it ASAP.
    Cheers!

    Thread Starter [email protected]

    (@blackspring413aolcom)

    Oh God! I didn’t notice that I wrote jpeg. God I’m an idiot. Thanks for spending so much time trying to help me. It worked, now just some fine tuning. And I’ll delete that content code. Thanks so much for all your effort. I’ve spent just about a week trying to figure this out. thanks again.

    No pb! Glad you were able to make it work.
    If you want your header image and content area to align horizontally, remove the float:left property from the #logo_image selector and the text-align:left from the #contents selector in your style.css file. If you want to keep the contents aligned to the left (i.e., below the header), just add a text-align:left property to your #middle-contents selector.
    Cheers!

    Thread Starter [email protected]

    (@blackspring413aolcom)

    Suddenly my header has disappeared. I haven’t changed any code. It just disappeared. I tried changing the jpg to a gif thinking maybe that is the problem. Any suggestions will be helpful. Thanks.

    Hi.
    Your <img /> tag src value is incorrect. It is set to:

    https://www.sublimationpressworks.com/wp-content/themes/piano-black/img/https://www.sublimationpressworks.com/wp-content/themes/piano-black/img/top.gif

    Try fixing that and the issue should be fixed.
    Cheers!

    Thread Starter [email protected]

    (@blackspring413aolcom)

    I changed that but nothing happened. Hmmm?

    The only image named “top” inside the image directory you are calling:

    https://www.sublimationpressworks.com/wp-content/themes/piano-black/img/

    has a “.png” extension, not a “.gif” extension like the one you seem to be calling.
    Try changing the image extension in the URL see if it works.

    Thread Starter [email protected]

    (@blackspring413aolcom)

    It turned the area black. and shifted the search box and rss/twitter feeds down below the spot.

Viewing 15 replies - 1 through 15 (of 24 total)
  • The topic ‘Header Placement in Piano Black’ is closed to new replies.