Graphene header width, mobile, and 404 page

  • deputy963


    Hello, I absolutely love the theme and especially the customization options. Having everything wrapped into one package is great!

    The only thing I don’t like is the width. Seems a bit narrow, especially in these days of widescreen high res monitors.

    I’ve played around with the css to increase the width a bit (to around 1160) and I’ve figured most of it out using the css below:

    #container { width: 1160px; }
    .two-columns #content-main { width: 875px; }
    .two-columns { width: 845px; }
    .two-columns .post { width: 790px; }
    .two-columns .post.post_404 { width: 845px; }
    .two-columns .entry { width: 790px; }
    .two-columns .entry-content { width: 790px; }

    Works well except for the following:

    1. If I attempt to upload my header I receive a “crop and choose” dialog limiting my to 960px.

    2. The content area of the 404 pages are still at 960 and I don’t know which class to change.

    When this goes live I plan to purchase the mobile option (one thing at a time). How will the increased width affect the mobile theme?



    As for the mobile theme, I haven’t had a chance to play with it. I’m sure Syahir will be much more qualified to answer that one. Be patient, and he will respond.

    As far as your header, I know there is a filter you can apply which will let you adjust these settings… but I can’t find the thread anywhere.

    So, in the meantime, you can always bypass the uploading (and cropping) process by just using either FTP or your hosting control panel, and upload it directly. Here is the URL of the image being called:

    Create a new image, with your desired dimensions, and upload it to that location, replacing the original.



    Thanks for the reply, Josh! Seems like a pretty nice community here.

    I was going to sub the header (and have done so now), but I really wanted to use the theme without hacking too much of it. 🙂

    Still interested in the content area of the 404 page and compatibility with the mobile plugin.



    You’re very welcome.

    Here you go, here is the thread about how to filter the header dimensions:

    As far as the 404, your “page not found” area is 845px wide. This looks right.

    The area below it “suggested results” is 645px wide.

    Add this to your child theme style.css file, at the bottom of the file on a new line:

    .two-columns .post.nodate, .two-columns, .two-columns .post.post_404, .two-columns .post.post_404_search {
    width: 845px;

    Syahir will answer regarding the mobile theme.


    Syahir Hakim


    Graphene and Graphene Mobile are two separate themes, so changes made to one will not affect the other.



    Thanks again, Josh.

    I’ve got it now, Syahir. I was confused (nothing new) but I’m on the right track now! Thanks again.

Viewing 6 posts - 1 through 6 (of 6 total)

  • You must be logged in to reply to this topic.