Profile theme: how can I change space between header and page?

  • Unknown's avatar
    lifemeetsbeauty · Member ·

    I’m using the Profile theme including a big header. I like this big header, but when I click on a blogpost or page, this page is coming up and hides the most of my header. What can I do to change the position of the post/page so I still can see the header?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    designsimply · Member ·

    I used this method:
    http://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/

    And I found that this rule was in place for the home page:

    .home-header {
	min-height: 420px;
}

    Then I looked on a single page and I found that the header container uses “#header” for the selector. That means you can do something like that to make the header taller everywhere:

    #header {
	min-height: 420px;
}

#navigation {
	background: transparent;
}

    Give it a try by adding it to your Appearance > Customize > CSS editor and make sure to test it on a few different pages to make sure it works as expected.

  • Unknown's avatar
    lifemeetsbeauty · Member ·

    Thank you very much! It works! :-) On every page I see the full header now! I have one more question. Do you know how the buttons are going up or down? I’ve made the header smaller and now the buttons are hiding my blogname in the header. So I want them moving.

  • Unknown's avatar
    designsimply · Member ·

    Sorry, I can’t see any buttons. Were they there before and you removed them? I’m not sure I’m looking in the right place now. Should the buttons be in the header area? How can I find them on http://lifemeetsbeauty.nl/ ?

  • Unknown's avatar
    lifemeetsbeauty · Member ·

    In my header you’ll see 3 links: home, about me and contact. These are white buttons. You do’nt see them because the background of my header is white.

  • Unknown's avatar
    designsimply · Member ·

    Ah, I see. I think of those as links, not buttons. See how they’re just a list of links with a solid white background color in the demo site at https://profiledemo.wordpress.com/ ?

    This rule, which I gave you earlier, takes away the white background because I thought it looked better that way with your header image. You can try deleting this rule to bring back the white background behind the main menu to see if you’d rather keep it:

    #navigation {
	background: transparent;
}

    You can use CSS to adjust them to look more like buttons. Here is an example you can play around with:

    #navigation a {
	background: #bbb;
	border-radius: 5px;
	padding: .3em 1em;
}

    Try adjusting the color codes and the padding numbers to see how it can change.

  • The topic ‘Profile theme: how can I change space between header and page?’ is closed to new replies.