How Do I Start Branding My SmugMug Site?: Easy Customizer

Last Updated: Jul 16, 2012 05:15PM PDT
Easy Customizer in the Tools button

If you have a Power User or Pro account, you can completely personalize the look and feel of your SmugMug pages.

The best place to start is with our Easy Customizer. You'll find it in the Tools button on your Homepage.

Without knowing any code, you can go beyond one of SmugMug's standard themes and give your site your own color scheme, banner, and navigation.

Like to watch? Check out our video tutorial that will get you from "blah" to "branded" in 5 minutes!

 

How to Do It

Sample banner

Easy Customizer Options


When you open the Easy Customizer, you'll see a preview on the left and lots of options on the right.

You can change the preview to see a different page on your SmugMug site, but keep in mind that the options on the right apply to ALL your pages, not just the one you happen to be previewing.

The beauty of this tool is that you can jump in and play, keeping an eye on the preview and using the popular 'Start Over' button at the top if needed.

For reference, here's a break-down of each tool and a description of how the example site was designed:

Basic Appearance

The choice between Dark and Light determines your button color and gives a good starting point for text colors. I chose "Dark" for the example site, because my background was Dark.

Easy Customizer OptionsEasy Customizer Options

Browser

The Page Title shown is "Bean Photography" The default favicon is Smuggy.

Easy Customizer Options

Header

In the example, I opted not to show SmugMug's Header at all. I used a simple text banner that clicks back to my SmugMug homepage, though you certainly can create a fancy banner image to use instead, like this one:

Easy Customizer Options


... or this one:


Easy Customizer Options

If you want a fancy banner and you don't have Photoshop, feel free to bug a friend who does. Or, you might stop by Dgrin's Finishing School to ask for help.

Easy Customizer Options

I added a simple Navigation Bar to the right of my banner, with a link to my portfolio category. I had previously created a gallery that serves as a "Pricing" page and another that serves as a "Contact" page, so I added those links to my navigation bar also.

Background, Text, and Boxes

Easy Customizer Options

I chose the Black Arts Background, but you can add an image to use or simply choose a color, instead. I chose all grey (#DEDFDF) Text, except for red (#A43434) titles.

My Boxes are off-black (#161616) with a slightly darker red border (#361616) and a slightly blacker bottom border (#181717).

Photos

The Border Color appears as a 1px outline around each photo on your page. You can specify a different Border On Color if you want that outline to change colors when you move your mouse over the photo.

Note that specifying a custom Right-Click Message does not actually change your image protection. To enable right-click protection, find the "Protected" option in each gallery's settings.

Footer

As a Pro user, you can show SmugMug's full footer...

Easy Customizer Options

... or SmugMug's mini footer, where you can pare down further.

Easy Customizer Options

You can also add your own footer, which will appear above SmugMug's footer.

Homepage

You can choose to hide this UserName's Home bit at the top of your SmugMug homepage:

Easy Customizer Options

Mobile

If you've gone through the work of creating your own custom banner image, you can set a mini version of it to show up when fans browse your website on a mobile device. Simply upload a 400x72 pixel version of it here and it will display across the top.

Advanced Site-wide Customization

You can go beyond the Easy Customizer and use CSS, HTML, and JavaScript to tweak your pages further. Even without any background in web design, there are some neat things you can do just by copying and pasting bits of code we provide. Read more.












help@smugmug.com
http://assets3.desk.com/r1046ffeaa2233e531563a32d7edef6677d8a78b5/javascripts/
smugmug
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
Invalid characters found
/customer/portal/articles/autocomplete