How to reduce white space around logo?

Travelify
1

I love the theme thank you. I’m playing around with the options. Have added a banner and disabled header text above it. Unfortunately there is still a lot of white space there and I would prefer none (or very little). Is this possible? Thanks!

2

Add these lines to Theme Options – Other – Custom CSS or inside style.css if you use WordPress Child Theme.

.hgroup-wrap {
	padding-top: 5px;
	padding-bottom: 5px;
}

Additionally you can try to add something like this

#site-logo {
	margin-top: 5px;
}

You can adjust size depending on your website setup. It is really hard to give suggestions without seeing your website.

3

Woops – theme name is “travelify” – but still stuck on this.

4

Ha, ha! I didn’t notice that either, but i gave you accurate suggestions :slight_smile:

5

Thanks for the quick advice. I’m crating the site locally Will try that and once the test site is up, will send you a link. Thank you!

6

Yes, reducing it to 0 brings the whitespace down a lot more but I guess it needs to stay there as it displays social media buttons. Perhaps I should change the colour so it merges with the header – is this possible? Also, how can I change the font (size and style) on the featured slider? Thanks very much.

7

To change header color add:

#branding {
	background: #111;
}

To change font style in slider add

.featured-text {
	font-family: Your font;
}
8

Yes that worked thank you. Should I put 2-3 different fonts in case the users’ computer lack the main one (separated by semicolons)? Can I also put in some code to change the size of the font and the dark area surrounding it? Many thanks.

9

Fonts in CSS should be used like this

font-family: "Helvetica Neue", Helvetica, sans-serif
Fonts need to be separated via comma and fonts that contains spaces like “Helvetica Neue” should be wrapped with quotes.

In give scenario, first font will be used is “Helvetica Neue”, if this font is not available on users machine, it will try next font, and then the last one if nothing else works.

You can change font size, color, background etc

font-size: 30px;
background: #eaeaea;
color: #111;
10

Hi Aigars,

I am struggling with much the same problem: the url is http://ol-nv.com and I would like the company logo to be at the top of the page, so eliminating the thin beige strip at the very top, the part where the background image is and the white bit above the logo…
Can you help?