Advanced Customizations

Since launching the new manual a few weeks ago, we noticed the need for more advanced walk-throughs on customizing modules.

Josh jumped on the case, and took to creating a bunch of working examples of our most requested customizations for the photo gallery and journal modules. These sites are live examples, with the exact configurations and CSS you'll need to achieve them. We plan on adding more of these for other modules in the future, to help people achieve some cool, more advanced things with their Squarespace sites.

If you feel like diving into some Custom CSS, jump on over and see the different options you can set up for your Squarespace site.

Journal Customizations

Photo Gallery Customizations

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.

Our New Favorite Bank!

We love that more and more businesses are discovering Squarespace as the perfect solution for their needs, so we were thrilled when the folks at First Bank approached us with a unique idea.

In an effort to encourage small businesses to sign up for accounts, First Bank is turning the age-old give away toaster idea right on its ear. They are currently offering a promotion which includes the gift of a full year of Squarespace to all new Business Account customers (Correction: This only applies to new accounts and if you received a code from the bank.) So if you're in Colorado, maybe you need a new account too?

Just for the occasion, we designed some slick black Squarespace gift cards. Ok, so they don't come with a personal concierge like a black American Express card, but they're still darn cool!

Squarespace Favicon Makeover

For those of you who have spent some time using Squarespace, you've likely noticed that we pride ourselves in always paying attention to the little details. Details in the design of our website, details in the design of our platform, and even the details in the design of our slick little Squarespace favicon.

We admired the icon design work of the team at Techlogica, and when they approached us with the idea of refining our favicon, we were anxious to see what they would come up with.

We asked Techlogica's Kyle White to share a bit about his motivation as well as the icon design process:

 "Squarespace always struck us as a high quality, next-gen web design framework (as it likely does for most).

However, we noticed the favicon being used didn't make use of the alpha channel, and was 15 pixel on one dimension (itwas an ICO with a 15x16 inner icon entry of type 32bit XP format). This left it up to the browser itself to either resample it, or show it 1:1. While the cube being shown is the best object to represent the framework, we thought there could be some areas for improvement.

The newly designed icon is still a black cube, but we made use of the full 16x16 canvas, shading all three visible sides with different gradient fills. You'll notice an inner stroke drawn at about a 30% opacity value over the inner shape, as well as an outer border of a dark gray tone. The edges of the icon are anti-aliased as well. All in all, we think the result is a more modernized take on what was already a great idea, and we believe it suits the Squarespace framework well."

Agreed--we all love it too!

You can see the progression of the Squarespace favicon designs in the image above. What do you guys think?

Squarespace at BlogHer

For those of you heading out to the yearly action-packed femme blog fest, BlogHer, there will be plenty of opportunities to get your Squarespace on!

Our Senior Designer, Krystyn Heide, will be front and center at the conference:

*"Living With Purpose" panel discussion.

Krystyn along with Jill Beraud, Stephanie Agresta and Lee Woodruff will take part in a Round-table Discussion and "Tweet-Up with Purpose" sponsored by Pepsi.

Time: Friday, July 24 from 11:45 to 1:00 PM CT
Physical Location: IRL, Sheraton Towers Chicago.
Online: Twitter - #livewithpurpose
Overview: The goal is to create an annual event at BlogHer that encourages women to explore what’s important to them and what gives their lives meaning. The results will be archived in a digital index and examined to explore how women’s attitudes and perceptions about purpose in their lives changes over time.

RSVP here!   

*Also on Friday, Krystyn will teach a GeekLab on the Squarespace platform.

Time: Friday, July 24 from 3:30 to 4:00 PM CT
Physical Location: Breakout session #3b
Overview: Squarespace powers everything from simple blogs to robust, professional websites. In this Breakout Session, Krystyn Heide will show you how easy it is to add features and functionality you may not even know about!

RSVP here!

Krystyn will also be checking out all the parties, and attending a number of different panels, so make sure you are following her on Twitter! (if you @ her to say "hi," she might even have a shirt for you :)