How to shrink the big blue blob (kubrick theme)?

  • I started installing WordPress almost 12 hours ago. Some of the delay was because I had to activate mysql on my hosting account and figure out how to create databases. Then I changed my mind about what directory I wanted WP in, so I had to rip everything out and completely start over.

    But the biggest time waster by far has been trying to understand the CSS enough to figure out how to shrink the hideous big blue blob at the top of my new blog. Creating a smaller image is not the problem. That’s done. And it’s named personalheader and it’s in my images directory, ready to go.

    Setting all the proper CSS is the problem. I’m not a CSS expert, but I’m no newbie either, and that style sheet is making me very cranky. I’ve been futsing with it for WAY too many hours. I give up. Can someone just please tell me which settings to change and in which files?

    It looks like there are probably a few places I need to make changes in style.css – but I can’t get the right combination. I know I also need to uncomment out the section in header.php to use personalheader.jpg. Do I have to comment out the header line above (in the CSS images section) that sets the use of kubrickheader.jpg?

    I have been able to get the blue part to almost look right (but not quite), but no matter what I do, I can’t get the blog name text to “move up” to be centered in the new shorter space. And I don’t see where the position of that text is being set.

    I would like the blue blob to be no taller than 100 px (maybe even only 75), instead of the current 200 px. I’m fine with the default width.

    The rest of WP has been pretty easy to use. But that style sheet. Bleh. So messy.

    Thanks in advance for a quick and painless solution.
    Jen

Viewing 9 replies - 1 through 9 (of 9 total)
  • Moderator James Huff

    (@macmanx)

    If you have Photoshop, grab the original Photoshop template by downloading Kubrick v1.2.5: https://binarybonsai.com/files/kubrick125.zip

    Thread Starter jadex

    (@jadex)

    Thanks. I don’t have Photoshop. How would that help me anyway? The issue is that I need to know how to change the CSS to support a smaller header. I don’t need Photoshop to create a smaller header.

    Thanks,
    Confused in CSS-land

    You do need an image editor – Photoshop, Photoshop Elements, Jasc Paint Shop (TM) Pro or similar – because the whole header is an image background. You’ll need to create a header the size you want and then adjust the rest around it.

    I hope Mr Kubrik won’t mind my quoting this text from his style.css file:-

    “*** REGARDING IMAGES ***
    All CSS that involves the use of images, can be found in the ‘index.php’ file.
    This is to ease installation inside subdirectories of a server.”
    So you should find the image properties in the index.php file.

    Thanks for asking the question, it made me look this up myself and I too have just installed WordPress 1.5 today.

    Thread Starter jadex

    (@jadex)

    I already have an image the size I want. It’s already named personalheader.jpg. It’s already in the images directory. I found the image properties in the header.php file. I tried changing them and things did not line up properly.

    What I need help with is exactly what I’m supposed to change in header.php and in style.css. I can’t figure out the right combination of settings to change so that things will still line up properly with a smaller image.

    Thanks.

    Maybe you should post a link to your site so we can see what the problem is.

    the best bet is to change the index.php within the default theme folder, i believe that’s what Gillie2Tat was saying – you may have misunderstood them.
    Try it out and let me know.
    You may also want to checkout the WordPress guide to theme creation, which explains all of this and a bag of chips in great detail.

    Hey, I’ve been having the exact same problem, but I figured it out.

    In header.php you have to change the header image size AND its alignment, which is located here:

    #header
    { background: url(“<?php bloginfo(‘stylesheet_directory’); ?>/images/kubrickheader.jpg”) no-repeat bottom center; }

    Change “bottom” to “top”.

    You also have to change a few things in style.css: the height variable under “#header” and “#headerimg” and the text alignment settings found in the section marked “/* Begin Headers */”.

    Wash it in hot water.

    ??

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘How to shrink the big blue blob (kubrick theme)?’ is closed to new replies.