Creating a Splash Page

Ever wish you could work on your Squarespace site in peace, and do things behind-the-scenes without people visiting your site and seeing your progress before you're ready?

I am going to show you how to throw up a quick "under construction" splash page, so you can get down to business without anyone peeking at your goods. ( You will need an advanced account or higher for this )

1. Click into Style Editing Mode ( the paint brush )
2. Click "Template" and then click the little "Copy" link on one of the styles in that template.
3. Then name that new style "Under Construction" via the "Advanced" tab.
4. Click "Banner & Navigation," and choose the One Column option. Choose  the no top navigation option below that (they are both the furthest left options), and hit "Save." You can also change the width of the column at this point too, if you have a graphic that you want to match it up with.
5. Click "Website Management" in the upper left of the window to pull up the admin menu, and choose "Architecture."
6. Then, in one of your existing navigation sections, add a "Basic HTML" page and name it "Under Construction." At the bottom of the menu, you will see a drop down called "Style Override" -- drop it down, and choose your newly created "Under Construction" style. Hit "Save."
7. Now, hover over your "Under Construction" page and click "Configure."You will see the same menu, but at the very bottom again, click "Set as Front Page." This makes the newly created "Under Construction" page your homepage.
8. Now you can go to that page and type your message or add an under construction image. By choosing a one column layout with no top nav options, there will be no nav bar showing.
9. (Optional) If you want, you can even hide the header and footer, so that only your message is visible and nothing else. To do this, make sure you have the current "Under Construction" style enabled and jump back to "Style Editing" mode. Go to "Custom CSS" and type the following:

#pageHeaderWrapper, #pageFooterWrapper { display: none; }

Welcome to super stealth mode.

Now for the rest of your pages, you will want to apply a different style so that you can change things without it affecting your under construction page.

Hope that helps! Feel free to chime in if you have a different and or better work-flow for this.

Comments

[Philip Jaques]

That is really cool!

What I do is just create a page that I can try new things out on and I make sure that page isn't visible to anyone but myself. Then when I perfect something new, I roll it out to the proper page.

[T. Thompson]

@Philip - Thats a great work flow too, thanks for the insight.

[Geoffrey Weg]

Nice! Thanks, Tyler.

[Eric E. Anderson]

Nice! Now my goods are safe - rawk.

[Alan Houser]

Thanks Tyler! I'll give this a try as soon as I can.
Is Squarespace always this responsive & awesome? Should be a fun ride!

[Josh Tilton]

Great post Tyler. Thanks for the info.

Also - I love the type you chose for "under construction", Sentinel rocks.

Cheers,

Josh

[Alethea Cheng]

Style override requires an advanced account or higher, yes?

[Alan the Houser]

Thanks again. I applied this with little trouble. (I found-out that I had to save some steps up there, but I'm new,and I learned things.)

I'm sure I'll learn this concept quickly, but I'm assuming I can view my site's "other" pages in a live environment? Or does this Under Construction page block access to all other pages?

I'm still in the mentality that when I build pages, I need to pop them into IE6/7/8, FF, etc and keep tweaking. Maybe it's the newbie Squarespace in me, or it's the seasoned & tainted professional in me that doesn't trust browsers.

On another topic, how do I CLICK THE EDIT button when my text does this? http://creativecomponent.squarespace.com/

I'm already braking things. :-)

[Benjamin Battalia]

Awesome! Thanks! This could come in handy in the future.

[T. Thompson]

@Josh - Sentinel is amazing, love it.

@Alan - Yes, you can view all your other pages in the live environment.

@Alethea - Yes, you will need an advanced account or higher for this to work, thanks for pointing that out, I updated the post to reflect the requirement.

[Alan the Houser]

Thanks for answering that, and durrrr...

All pages would exist, but since I'm not LINKING to them, I just need to use my keyboardernets to browse to them.

Word & out.

[T. Thompson]

@Alan - Well if you choose to have a nav(s) show on your other style (the one your working on, not the under construction style) then you will have those links to navigate with, they just wont be on your splash page. For each style you have complete control and options for columns, navigation, header etc.

Word up.

[doug]

seems all I do is splash pages and promise on the come. but I can't whip around the CSS ,so my site is always under-construction .... and feels forever lame ..... and your examples, while pretty. don't get any easier...and it becomes less about content then it does about the juxtaposition of a collection of Miles Davis album covers, than a down a dirty posting position. Squarespace is like a club. Insular. Oh so secret, and select. I like the product. But the process sucks.

Regards

[Josh]

I worked on my entire site behind the scenes with the developer template from scratch while the old one was still functioning. I simply make sure all new pages are disabled and only visible to me. Then, go to Style Editing, switch to the developer template and work like that. Just make sure you don't enable the template, until you're finished with the site, or else it will also change your existing content.

I hope that makes sense. It works great for me.

[Brendan]

Hi! I'm new here and generally love it, though how I would create a few old-school pages I've handbuilt for years in this (very cool new) format elude me.

The one thing I most want to do right now builds on this 'under construction' idea:

how would I create a slash page along these exact same lines - one image on an otherwise blank page - EXCEPT that I want it to serve as a "Welcome" page, with one graphic (that I've created) which includes 'enter' text, that would take visitors into the main, fully functioning site? I've baked the 'enter' into the graphic and want to slap the graphic on the center of the page, eyedropper the rest of the page to match my graphic BG color, and then add a clickable region around the word that leads to the index page of my site.

Thanks!

[T. Thompson]

@Brendan - You would simply follow the instructions above, only you would wrap the image you add to your splash page with an anchor tag. Since you are making this page a Basic HTML page, you can add whatever you want to it via raw html code (like you did in the past), so just make the image a link and point it to whatever page you want.

[Alex]

But its still pretty easy to get around that "Under Construction" page, no? If you type anything after the root URL your site will generate a "Page Not Found" error page using the default style. If that style includes navigation, then now you have access to the rest of the site. Is there a way to assign the under construction style to the "Page not found" page? Even then, should anyone guess at one of your page titles (not too hard to do if you have common titles like "About" or "Blog") they can still pull up a site page you dont want them to see.

[T. Thompson]

@Alex, if you work on your pages when they are disabled then no, they wont show up anywhere to anyone who is logged out...typing in the direct url will result in a page not found, but no nav will show up as long as the pages are disabled.

[benjamin carson]

I use style overrides constantly, but not for the same purpose -- I have sections of my site that are for students, other sections for research conversations, and others for working with musicians who perform with me. They all have different banners and slightly different formatting choices. But one can go further than that -- they also have different degrees of visibility, and connectivity, so that i can control what different audiences see.vi

I don't understand what you mean by "splash" ... you're sort of re-inventing the term, aren't you?

I want to create a "welcome page" that users visit as an entry point to my site, but which is not the "main" page. The splash page is like packaging, but the main page is the central hub from which to navigate. Very different purposes.

Clearly, style and banner overrides are important for this -- my "splash" page is , and is set as the "front" page of the site. But my "main page" is ... and THIS is the page I would prefer that my users always get funneled back to when they click on the banner. Think of it as the "main menu."

Trouble is, I can't figure out how to get squarespace to make this distinction. Can you help?

[Chris]

Hi

I'm researching the capabilities of Sqaurespace, before I 'fully' recommend it to a client, but I NEED to know whether the 'Welcome' screen (referred to earlier by Josh) is at all possible?

Both my client and I, are after a graphically rich welcome screen with a solid CMS behind it and if this can be done, I'll sign up today!

Hope you guys can help, an quick response will be very much appreciated, many thanks in advance.

Chris

[Chris]

whoops - didn't read the author tags correctly, I see @Brendan asked the question which appears to have been answered - apologies..