Support » Themes and Templates » How to increase header width on Mantra theme?


    I would like the header to line up with the outer border of the right sidebar. Right now it is 900 pixels and only reaches a little past the right sidebar.

    (P.S. I am a novice WordPress user, but can follow instructions)


Viewing 15 replies - 1 through 15 (of 15 total)
  • Michael


    Forum Moderator

    your theme seems to be based roughly on twenty ten; have a look into functions.php of your theme – the header width and height should be defined in there.

    Yes it was! And it worked. Thanks!

    Hi careercreatrix and alchymyth, I am using Mantra theme and my banner looks totally silly! I would like to extend height and the length.
    Please could you tell me exactly where you found the functions.php?

    Between 1/4 and 1/3 of the way down, you will find

    // Add a filter to mantra_header_image_width and mantra_header_image_height to change these values.
    define( ‘HEADER_IMAGE_WIDTH’, apply_filters( ‘mantra_header_image_width’, 1080 ) );
    define( ‘HEADER_IMAGE_HEIGHT’, apply_filters( ‘mantra_header_image_height’, 280 ) );

    …and you just change the numbers.

    Be sure to ctrl+f5 (clear cache) when you go and view your webpage to see what the changes look like.

    Actually I think by default it will say 900 x 200; those numbers (1080 x 280) are what I used to get it to line up.

    Hi careercreatrix,
    Thank you for taking the time to respond. This is causing me some grief!
    Sorry to sound so dense – I am unsure where to look in the first place to find where the filter!
    I cannot find anything like this on Mantra Theme Settings, nor on Header settings.

    Ohhh sorry I didn’t see that you were asking where to find functions.php.

    In the “Appearance” menu on the left hand side of your Dashboard, you will see the word “Editor” – click on it.

    Once you do that, you will see in the edit window in the centre of the page the file style.css. That’s not the one you want to edit, you want to edit functions.php.

    So, you will also see a list of templates on the right. In that list functions.php is titled “Theme Functions”. Click on “Theme Functions”.

    Once that template comes up in the edit window, scroll down through the code to about 1/4 of the way down and you should see the text that I have copied here.

    Then you can go ahead and change the width and height pixel numbers (I made it 1080 px to get it to line up) and height (whatever you want) and click “update file” to save your changes

    Oh, thank you so very much! That is wonderful information. I have to go out now, but will be trying that later. It is certainly not easy trying to do everything yourself, but very satisfying when it comes up right.
    Thank goodness for people like yourself, who are will to share information. 🙂

    I will let you know how I get on.

    Just had a quick look before I go and I have found the place you directed me to. Yippeee! This is what I see:
    // The height and width of your custom header. You can hook into the theme’s own filters to change these values.
    // Add a filter to mantra_header_image_width and mantra_header_image_height to change these values.
    global $totalSize;
    define( ‘HEADER_IMAGE_WIDTH’, apply_filters( ‘mantra_header_image_width’, $totalSize ) );
    define( ‘HEADER_IMAGE_HEIGHT’, apply_filters( ‘mantra_header_image_height’, 90 ) );

    where the text says:
    define( ‘HEADER_IMAGE_WIDTH’, apply_filters( ‘mantra_header_image_width’, $totalSize ) );
    can I delete $totalSize ) );
    or do I just leave a space after $totalSize and add in the width that I require?

    Also, at the bottom of the edit box, there is some grey text which says:
    You need to make this file writable before you can save your changes. See the Codex for more information.
    Did you have to do that, or is it not necessary for these changes?

    I finally figured out that my website host has to enable access to write to files. This is now done, but when I follow as you have kindly said, all that happens is the background stretches way down the page and moves the tabs down. The header stays exactly the same. Any suggestions please? I have also contact Mantra designers to ask and awaiting a response.

    Unfortunately I don’t know why that’s happening for you. I am a relative beginner at WordPress myself, all I know is that what I did on my site, worked.

    It might help if you post your website address here, so others seeing this can look at what you’ve got and maybe know what is going wrong.

    Hi and thank you so much for your information. It works. The image that I was using had been cropped and was too small. All that I needed to do was to upload another, bigger image and then to follow your instructions. Thanks again and the best of luck with your business. :o)

    I am trying to change the width of my header (an image I have uploaded to replace hte default banner) (my theme = twenty eleven) by changing the numbers in the following code in the functions.php file:

    // The height and width of your custom header.
    // Add a filter to twentyeleven_header_image_width and twentyeleven_header_image_height to change these values.
    define( ‘HEADER_IMAGE_WIDTH’, apply_filters( ‘twentyeleven_header_image_width’, 1000 ) );
    define( ‘HEADER_IMAGE_HEIGHT’, apply_filters( ‘twentyeleven_header_image_height’, 288 ) );

    However, changing these numbers (e.g. 1000 and 288) does nothing to the header at all! I notice that above in this thread, the code being changed includes the name of the custom header image…whereas in the code I have put here it doesn’t mention the file name of the image I uploaded. I can see my jpeg fine as the header image but can’t change it’s width! Can anyone help?

    Have discovered I have some problem with competing themes…Twenty Eleven theme is activated as current theme and Twenty Ten layout and defaults actually showing up on the site which can see in ‘view source’ (twenty ten style css), and now another white screen of death situation so guess this is a different issue I’ll continue elsewhere!

    i was also getting troubled with my header size…it was 1100×60 but with help of “careercreatrix” , i did it good….i find the height and width of header in function.php file>>editor>>appearance.

    change the

    define( ‘HEADER_IMAGE_WIDTH’, apply_filters( ‘mantra_header_image_width’, $totalSize ) );
    define( ‘HEADER_IMAGE_HEIGHT’, apply_filters( ‘mantra_header_image_height’, $mantra_hheight) );

    to any number in the blank space

    define( ‘HEADER_IMAGE_WIDTH’, apply_filters( ‘mantra_header_image_width’, _____ ) );
    define( ‘HEADER_IMAGE_HEIGHT’, apply_filters( ‘mantra_header_image_height’, _____) );

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘How to increase header width on Mantra theme?’ is closed to new replies.