Support » Theme: Sunspot » Fixed sidebar

  • Resolved Angius

    (@angius)


    This theme got great potential of having the sidebar fixed, it’ll look really great.
    But how can I do that?
    I tried slapping position:fixed in various parts of styles.css, but beside breaking the theme – nothing really works…

Viewing 15 replies - 1 through 15 (of 17 total)
  • Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    Hi there, just a heads-up that the best way to make changes to a theme is to use a child theme, so your tweaks won’t be overwritten when updating the theme. Here are some guides in case you haven’t made one before:

    http://codex.wordpress.org/Child_Themes
    http://op111.net/53/
    http://vimeo.com/49770088

    Once you have a child theme set up, try adding this to the stylesheet in your child theme directory:

    #masthead {
       position: fixed;
    }
    
    #main {
       position: relative;
    }

    I tested this on my end and it keeps the sidebar in a fixed position while letting the main column scroll.

    Please let me know how this works for you!

    Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    Actually it may also work with only the first #masthead bit. 🙂

    It works almost perfectly, thank you very much 🙂
    The only issue is that, the elements of the sidebar are a bit too wide, they are wider than actual sidebar.

    Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    You’re welcome! Could you please provide a link to your site so I can take a look, since I’m not seeing that on my test site.

    Did you make any other CSS changes? The code above shouldn’t change any widths.

    http://angius.hol.es/
    No changes. If I recall correctly, of course.
    I’ll try reinstalling the theme maybe.

    Edit: After reinstalling the bug is still present.

    Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    Are you making the changes in a child theme or using a custom CSS plugin? My test is using a child theme.

    I was doing it on a main theme. But if you’re saying, that it works only on a child, I’ll try.

    Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    I’m saying I’ve only tested it on a child theme. 🙂 I don’t recommend modifying the theme files directly, since your changes will be overwritten the next time you update the theme.

    Let me know how it goes.

    Unless I’m doing something terribly wrong, using the child theme broke my site even more…

    Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    Looks like you didn’t upload the styles.css file in your child theme, which is required for a child theme to function:

    http://angius.hol.es/wp-content/themes/sunspot-child/style.css

    Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    You may want to double-check all the other steps in making a child theme from the resources I linked to above – or your preferred tutorial – to make sure everything is set up correctly.

    Apparently it was a matter of a typo… It works now (child theme, I mean), but the elements are still too wide… I even disabled all the widgets, but it looks like that’s not the cause…

    Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    Could you try changing the #masthead CSS to this:

    #masthead {
     position: fixed;
     width: 300px;
    }

    It works perfectly, why haven’t I thought about this earlier…

    Moderator Kathryn

    (@zoonini)

    Automattic Happiness Engineer

    Excellent. 🙂

Viewing 15 replies - 1 through 15 (of 17 total)
  • The topic ‘Fixed sidebar’ is closed to new replies.