WordPress.org

Ready to get started?Download WordPress

Forums

Twenty Thirteen
[resolved] Help with Custom Header Installation (5 posts)

  1. yogaman5020
    Member
    Posted 9 months ago #

    I'm trying to install a *.png file as a custom header using the Twenty Thirteen theme. The file contains a client's logo, site name, and tag line, and is 750 px wide x 175 px high.

    When I attempt to install the file in the header, the theme automatically tries to crop the file's height and width. The cropped file fails to show all the formatting I generated with my graphics editor. Using the parent theme, when I crop the custom header to the maximum permitted size and save my changes, the theme expands the file width beyond the view of my computer monitor (I presume out to 1600 px wide, the header default width for Twenty Thirteen). The text and images in the custom header look pixelated and ragged, and both ends of the logo are cut off. This is not acceptable.

    The solution seem to lie in creating a child theme, with modifications to the parent style.css and functions. php files within the child theme folder.

    I modified the allowable height of a custom header to 400 px as described in the following thread. The child theme fully accepted the height of the logo (175 px H), while cropping less of the width than the parent theme. When I viewed the home page of the site, both ends of the logo were chopped off, and the logo continue to look ragged, although less so than just using the parent theme. Worse, the CSS of the navigation bar failed to install.

    I'm at a complete loss as to how to fix this issue. I suspect that the topic thread referenced above is not the complete solution. The parent theme custom-header.php file has default settings for header height and width. Should I modify those values in my child theme as well?

  2. yogaman5020
    Member
    Posted 9 months ago #

    Correction: when the child theme is active, the CSS for the entire site fails to load, not just for the navigation bar.

    Just to clarify things here:

    1) child theme style.css: I did call the parent theme 'twentythirteen' at Template: twentythirteen, and the import function with '@import url("../wp-content/themes/twentythirteen")', and

    2) functions. php: I did use an opening <?php and closing ?> tag to contain the modified scripts.

  3. yogaman5020
    Member
    Posted 9 months ago #

    After presenting this issue to a recent WP meetup group in my community (St. Louis, MO, USA) and observing the responsiveness of the Twenty Thirteen default banner (expands and contracts depending on the size of the display screen), we concluded that a better solution is to switch to a different theme. Any custom banner introduced to Twenty Thirteen's header appears to 'float'. It's not anchored to a particular point from which to scale the image larger or smaller. Hence, the ends of the custom banner get cut off. I'm sure this was a deliberate design feature built into the theme. Better theme choices might include Twenty Twelve or Responsive, a free responsive theme offered through WP.org. Both of these themes seem to visually anchor a custom banner to one spot, and retain the width of the banner when the screen width scales larger or smaller.

  4. DCMLAdmin
    Member
    Posted 9 months ago #

    We're having this same problem, but would prefer not to switch themes. Can anybody think of a workaround? Thanks!

  5. yogaman5020
    Member
    Posted 9 months ago #

    Dear DCMLAdmin: Please start a new thread in the Twenty Thirteen forum for your issue. You have a 50/50 chance that anyone will answer you. I didn't receive a response (as you can see by the prior threads in this post).

Reply

You must log in to post.

About this Theme

About this Topic