Change the Design, Keep the Content!


Pssst. Sandvox makes it easy to switch things up. Seize that “new year, new start” spirit and publish your Sandvox website in a new design.

For this month’s newsletter, we introduce a couple of the latest designs for Sandvox, and share “how-to” notes for changing the design you use to a new one, and more—lickety-split-like. Really!

Before choosing a new design, remember to back up your Sandvox document first. Why, you ask? While changing the design wouldn’t be expected to break your Sandvox document, it is always best to be safe and be sure your document is backed up before making major changes. This best practice can save a lot of time and trouble in the event of unforseen difficulties. 

For OS X Lion (10.7) or newer, Sandvox uses the Versions feature of the operating system, so in the event that you need to revert to a previous version of your document, you can pick File → Revert To → Browse All Versions... and choose a previous version to restore. In addition, you can always save a copy of your document by using Duplicate from the File menu.

Design Elements

When trying a new design, it’s a good idea to be mindful of the similarities and differences between the various design elements supported by particular Sandvox designs. 

For example, all designs support the sidebar, but its placement can vary with each  design. Some designs show the sidebar to the left of the main content, others show the sidebar on the right. Which works for you depends on your personal style and the goals for your website. The width of the sidebar also varies by design. Some designs use fixed widths while some adjust to the width of the web browser. 

Banners

Many Sandvox designs support changing the banner graphic at the top. Changing away from the stock banner graphic in a design can be a great way to personalize your site and refresh its look without too much work.

There is a Sandvox Help page that explains how to change banners, as long as the selected design supports it.

Keep in mind that banner size also varies by design. Sandvox Help also details which designs support banners as well as their respective width and heights as a handy reference.

Hydrogen and Kryptonite

Two of the newest additions to Sandvox’s growing list of available, out-of-the-box designs are Hydrogen and Kryptonite. These are attractive, modern-looking designs that fit many uses, but are particularly well-suited to use by photographers.

Changing the Design

To change your site's design, simply open the Design Chooser by clicking “Designs” on the toolbar. The Design Chooser shows a thumbnail preview of all included Sandvox designs plus any third-party designs that you may have already downloaded and installed. 

The Design Chooser groups designs into following categories: Minimal, Basic, Glossy, Bold, Artistic, and Specialty. Some of the designs have multiple color variations and the Design Chooser indicates how many there are for each design. Click on the desired design and then click “Choose”. The design will immediately be applied to your Sandvox document. 

There’s another (even faster way) of switching designs, which doesn’t require opening the Design Chooser. You can do it by going the File menu and selecting “Next Design” or “Previous Design”. This action applies the next or previous design available and you’ll see a nice pop up showing the name of the design as it is being applied. 

To make it more fun, we added keyboard shortcuts. Instead of going to the File menu, just use Cmd-Ctrl-] or Cmd-Ctrl-[ to go to the next or previous design. In this way, you can quickly get a glimpse of how your website will look like in each of the more than 60 designs, which can make it easier to visualize your site, and decide which design best matches your objectives and taste. This is also helpful when you’re trying to decide which specific variation or color scheme of a design would work best for your Sandvox website.

Hint: If you’d like to make this process even faster, you can temporarily uncheck the “Load data from the Internet” checkbox within Sandvox Preferences. Some objects on your pages, like the Facebook button and Twitter timeline, require Sandvox to load data from the Internet, which can cause a second or two of delay in loading a page and applying the design. So, temporarily disabling that may speed up the process of cycling through the designs. If you try it, be sure to return the preferences setting to its original state when you’re done! 

Third-Party Designs

In addition to the over 60 designs a Sandvox license and install includes, you can choose from a range of third-party designs by clicking “Discover More Designs...” from the Design Chooser. 

Note: Due to Mac App Store requirements, this button is not available in the Mac App Store version of Sandvox (because it contains links to third-party sites that sell products). If you own the Mac App Store version of Sandvox, you can still browse third-party Sandvox designs on the web.

That’s it, in a nutshell! You’re now armed with the information you need to charge into changing your Sandvox website’s design. 

Here’s to change!