Need Help Customizing Banners/Headers in Rapidweaver 6's New Themes

Classic General
1

Hi. I just upgraded from Rapidweaver 5 to Rapidweaver 6. In general, haven’t made a site with Rapidweaver in a few years so I’m a bit rusty with the program.

Anyway, I’d like to know how to customize the banners/headers in Rapidweaver 6’s new themes: Split uses Headers, Reason uses Banner Images and Tesla uses Banner Backgrounds. I can’t figure out how to use custom images for any of those three themes.

I have a bunch of 3rd-party themes that I bought a few years ago and I upgraded them this week to the latest versions. For those themes, I can view them in Rapidweave’rs Themes drawer, then right click on them and choose “Show Contents.” Their contents are then shown in the Finder, including the folders that contain the banners/headers for those themes. I can then place custom images in those folders.

However, when I open the theme drawer and right-click on Rapidweaver 6’s new themes, I don’t see an option to “Show Contents.” Consequently, I’m clueless on how to use custom images for their banners/headers. Can someone please explain to me how to do it?

Thanks.

Sky

2

Okay, I figured out the answer: I need to duplicate the new themes, then I can change their contents.

3

Sky,

In RW6 clicking on the Themes button by default in the menu bar at the top of your Project window displays the Themes at the bottom. Right clicking on a Theme will allow you to see its Contents.

All other things being equal, that’ll show you where you’d substitute a graphic.

If you don’t see it (e.g. for Split - and other third party Themes), you control a Theme’s styles from the Master Style pane of the new Configure tool/option at top left by the side of the Pages icon… it’s like a spanner.

And, as you say, you should always do it to a Duplicate.

Good luck!

4

There is a Tesla Pro version that allows up to 20 custom banners. I am using them on my site http://tracywebber.photography

5

You can customise your Split header images using a little snippet + RW resource files:
http://demo.yuzoolthemes.com/split/how-to.html

6

Thanks Mark, your suggestions have been a been a great help for me!

7

Hi Michael,
me again. :slight_smile:
Wondering why the ‘Slogan’ thats in the inspector, doesn’t appear on the banner image underneath the main Text header? Is that not supported in Split theme?

also, looking at the Split Theme’s own website, there’s a heading text SPLIT on the top left corner. How does that appear? Is that in the Inspector section I’ve yet to notice?
thanks!

One feature I notice that is really super important it seems for websites is having the phone/email etc in small text right at the top, above all header banners. Can this be put in as CSS?

Jenny

8

Thanks @jennyp - in Split the Title acts as the Slogan - it appears in the header if desired:

00
001709×1004 252 KB

You can override this on a per page basis using the Page Inspector

The SPLIT in the top left is the Site Logo:

02
021601×1076 115 KB

For putting a phone number at the top above the navigation, somebody did that once and posted to this forum. Just trying to find it… they added flags for different language links in the the top right corner above the navigation.

So it is possible but requires customisation with HTML and / or CSS.

2 Likes
9

Thank you Michael. I thought I had replied, but I clearly, not!

Landing Page or Sign Up form as a pop up:
I was wondering if there is a way for Split Theme to put a ‘landing page’ , or some frame that pops up on the front page for ‘Sign Up’ form.
Something like this: http://www.ameliaphillips.com.au

I’ve noticed a few for Foundation theme, but not sure how to do this for Split. Any ideas?

Thank you very very much for all your help!
~ Jenny.

10

Hi Michael, is this the post you were thinking of? I think I’ve found it: Split theme: add a CTA on the menu
By @klaatu.

Unfortunately it’s not permitted to add or reply to that older post thread anymore.
Does anyone know how one does tweaks in javascript (as described by @klaatu in the above link) ? I want to change the colour of the button. And direct to either a phone number, or a page within my website, or external URL. Thanks!

1 Like
11

The color is controlled in the css bit
The link is after the href statement in the JS (also the button label)

3 Likes
12

Thanks Scott.
I have tried to change the colours in the CSS bit, but its not working. I tested putting #FFFFFF just to see what happens, and the button remains bright blue. I’ll attach whats’ in my individual CSS and javascript…if that helps to give me any advice.

That is, I put this:

#customButtonSplitNav {
background-color: #FFFFFF;
background: -webkit-gradient(linear, left top, left bottom, from(#00A0FF), to(#0060BF));
border: 1px solid #FFFFFF;
padding: 3px 20px;
color: #FFFFFF;
box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 2px;
margin: 5px;
font-weight: bold;
height: 3em;
font-size: 0.8em;
}

No change except for border now white.
Would there be something on my individual CSS or Javascript tabs for each page, that might be interfering with this?
Much appreciated.
thanks,
Jenny4933

15
15997×433 338 KB

13

Try changing the WebKit background gradient as well.

2 Likes