jgennick

Happy I could help! Glad the idea worked.

Where is the domain registered? Most registrars that I'm familiar with offer an option to forward a domain name to a specific URL. So visitors will type in something like www.oldurl.com, and you can have that url forward to www.newurl.com/somepage. Visitors will see that they have been forwarded to your new site, but that's probably ok. You want them to know the new URL anyway.

The Fulton template is better as a separate question, and it would help if you posted a link to the specific page you want to colorize. For regular pages though, the following seems to work:

#siteWrapper {background-color: green;}

And then you can target the footers with:

#preFooter {background-color: green;}
#footer {background-color: green;]

Index pages may require a different technique.

I had time for only a fast look while eating breakfast, and hope the above helps.

Maybe something like:

body {background-color: pink;}
div#canvas {background-color: pink;}

Put style tags around them and put them into the Page Header Code Injection field for the page you want to affect.

Every template requires different CSS rules. Some problems are easier to solve in one template than in another. Please post a link to your site, and I will try and take a look.

Changing the color on just one page is possible using a couple of CSS rules. Go to your one page, click the Settings button, then go to the Advanced tab. Enter the following into the Page Header Code Injection field:

<style>
 body {background-color: pink;}
 #canvas {background-color: pink;}
</style>

The first rule changes the entire page body. The content area has its own color setting though, so you must change that one separately. I’ve tried these rules on the demo site’s Read Me page, and they seem to do what you are after.

Possibly you might need to add !important after the color names, as in “…:pink !important;”. Try the above first. Add the !important if you need it.

It would be to your advantage to learn enough about CSS to personally understand what the above rules mean and how they work. That’s a shameless plug for my book, but it’s true too.

Jonathan Gennick, Author: Learn CSS for Squarespace

The only way that comes to mind at the moment is to drop a Code block onto your page, and then write the table's HTML by hand.

Add a closing angle bracket to the final style tag. Somehow I got a dot there by mistake.

I used to use the following for my events page:

<style>
#banner-area-wrapper {display: none}
</style>

In my case, I went to Events Settings, the Advanced tab, and I placed the above code into the Page Header Code Injection field.

I just tested this solution quickly. It still works.

Just thought I'd add a comment to share my recent experience. I had an iframe tag for embedding a video that is a countdown time to an upcoming event, and thus having the video play automatically is desirable.

Dropping the tag into a code block was not ideal, as the code block was not responsive to browser window changes. I was placing two videos side-by-side, so having them resize was important. One would resize, and the other would not.

I ended up discovering that I could use a video block while also dropping in the iframe tag I had been given. I clicked the gear icon to the right of the URL box. That opened an Edit Embedded Data dialog. I took a shot and pasted the iframe tag into that box, and that did the trick. Despite the iframe tag including a width and a height, the video resizes along with the browser screen, and I'm able to have my two videos side-by-side. One is a countdown timer that auto starts. The other is a video that the user must click to play.