RW8-Future Theme Height Change

RapidWeaver Classic General
1

Hi,
I need help to change the height of the banner in the new RW8 theme “Future”. Can anybody help me with the CSS code?
Thanks

2

It’s always easier for you to get help with custom CSS if you provide a URL to at least a test page. Otherwise people will have to recreate what you are doing.

1 Like
3

Hi Doug, I am new to the forum, so thanks for the advise.
The url is http://namearthworks.com

I would like to decrease the height of the banner, so that one does not have to scroll down so far to see the actual content. Much appreciated

4

Hi Gerard,
Welcome to the forum.
If someone else doesn’t pitch in before I get to taking a look at it I’ll try and help you out. I’m away from my Mac right now(just an iPad) so I can’t really use any of the web tools. I won’t be back at the off until tomorrow morning.

Looking at the URL you provided did jog my memory, and that theme has a bit of a complicated hero(banner) area. If I remember it has a couple of different element and a couple of breakpoints involved in changing the height of the banner. I’m posting that Incase one of the other regulars wants to jump in and give you a hand.

If you don’t get it figured out I’ll try and remember to have a look at it tomorrow.

2 Likes
5

Try something like this:

.hero,
.hero-background {
    height: 50vh;
}

@media screen and (min-width: 768px) {
    .hero-title {
        padding-top: 30px;
    }
}

It can probably be improved further, but is a start:

56
561600×1127 245 KB

2 Likes
6

Thanks for the great help Doug & Will, this is exactly what I had in mind. Now I can work on finishing it up finally. Great Forum!

7

Hi,

I’m having the same issue. Will, where do i place the code in order to shorten the banner height?

Thanks,

8

Hi Lloyd,

If you want to change banner on all pages, in the global settings menu, under Code, then CSS. For each page in the HTML tab under CSS. Hope this helps!

9

You should perhaps consider buying a copy of the Earthquake theme to use instead. This theme has a similar appearance to Future (slanted containers), but significantly more customisable style and colour settings. The banner area automatically resizes to fit whatever size image you provide, so is easier to use if you want to avoid the use of CSS code. Download the free demo version and project file to test it.

1 Like
10

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.