We are an online artist community sharing ways to create and sell art. Join us to save big on art supplies or try our easy websites for artists.

How To Change Your Art Blog’s Design – Effortlessly!

Back in 2010 Blogger launched a template designer that promised to make changing one’s overall blog design effortless and pain-free. I, however, was a little skeptical and a bit terrified that using the template would cause a loss of data.

Boy were my worries unfounded! Today I am going to show you how I spruced up my own blogger blog. . .

Step 1. Back up your blog posts

You can use bloggerbackup.codeplex.com to back up your posts effortlessly.

templatechange1

Step 2. Log into your Blogger account

Once you’ve logged into your account, locate your blog on the dashboard, and click the “Design” link. (You can also get to the Template Designer by clicking on the “Layout” tab.)

templatechange2

Step 3. Select Template Designer

Click on the “Template Designer” link on the top left corner of the design page. This will take you to the new Template Designer tool.

templatechange3

Step 4. Experiment with the Template Designer

Once you click on the template designer link, you should see a design screen that looks like this:

templatechange4

The top half off the screen shows the designer tools. The second half of the screen shows your current blog design. Once you begin making changes to your blog’s design, the changes will appear on the second half of the screen.

These changes will not be made permanent until you click the “Apply to Blog” button, so go ahead and have a little fun.

templatechange5

Step 5. Select a template

Click on a template you like. When you click on an overall design, you will be given several color schemed below the design box to choose from.

In this case, I’ve chosen the “Simple Template” with the blue layout.

Here’s how my blog looks after applying the changes to my blog.

templatechange6

Notice that I’ve lost my banner? That’s okay, we can easily add it back later. (Just make sure you have a backup copy of your banner saved on your computer, or know where you saved the banner in the first place.)

Step 6. Select a background

To change the background of your blog, click on the “Background” link on the left side of your screen. From there you can choose a basic color scheme.

In my case, I stuck with the blues.

templatechange7

Once you select your color scheme you can change the background to include your own background image, or choose from a number of background images already provided.

To add a background image, clink on the single background box. When you do, a new window to pop up showing you a selection of backgrounds to choose from or a button to upload your own image.

templatechange8

To select one of the existing background images, simply click on one of the images provided. To upload your own image, click on the “Upload Image” button in the upper left corner.

templatechange9

When you click on the “Upload Image” button, a new screen will appear asking you to select an image from your computer files.

templatechange10

Once you upload your image, the image will appear inside the single background box with a new set of choices: position, tile, and scroll with page. Make your choices.

templatechange11

This is how my blog looked after I tiled my image:

templatechange12

Step 7. Select Layout

Once you’ve made changes to your background and color scheme, it’s time to choose a blog layout. To choose a layout, simply click on the “layout” link in the left column, then choose one of the layouts that best fits your blog.

templatechange13

This is how my blog looked after I chose the three-column template.

templatechange14

Step 8. Adjust widths

After you’ve selected your layout, you may find that some of your content no longer fits appropriately on your blog. Don’t fret. All you have to do is adjust the widths of your columns by selecting the “adjust widths” link in the left column.

templatechange15

Step 9. Use Advanced Options

Now that the basic design has been put into place, it’s time to tweak your blog and make it more personal. To do that, click on the “Advanced” link in the left column, then scroll through the list of options to change the font colors of your text, links, header, and footer.

templatechange16

Step 10. Remove the Blogger navigation bar

I don’t know about you, but I don’t like having Blogger’s navigation bar take center stage when art collectors or the press stop by my blog. I think it looks unprofessional.

templatechange17

To remove that pesky little navigation bar, click on the “Add CSS” button in your list of “Advanced” options then type “#navbar-iframe {display: none !important;}” without the quotes into the customization box.

templatechange18

This is how my blog looked after I removed the navigation bar:

templatechange19

Step 11. Save your changes

Once you are satisfied with your changes, click on the orange “Apply to Blog” button in the top right corner of your screen.

templatechange20

Step 12. Put banner back

To replace the text with your banner, click on the “Back to Blogger” link next to the “Apply to Blog” button.

templatechange21

When you click on the “Back to Blogger” link, you’ll be taken to the “Add and Arrange Page Elements” section. On this page, you want to click on the bar with the title of your blog.

templatechange22

When you click on the blog title bar, a new window will pop up asking you to configure your header.

templatechange23

Here you can upload a banner image from your computer. Once the image has been uploaded, you’ll receive confirmation that it was successful by seeing the image appear in the configuration box. If the image does not appear in the configuration box, try again.

After the image has successfully loaded, choose whether you want the image to appear behind, above, or in place of your title and description. Then click “save”.

templatechange24

Step 13. Adjust columns

The final step will be to adjust the columns in your new template. To do that, all you have to do is put your pointer over the box you want moved, then right click on your mouse and as you hold down the clicker, drag the box where you want it to go.

Once you are satisfied with all of your changes, click the orange “Save” button in the upper right corner of the page.

templatechange25

And there you have it!

Although I’ve shown you a lot of steps, it truly is as simple as pointing and clicking. And the best part is that with a little trial and error you can find the perfect blog design to match that custom-designed website you paid for!

*Note: this post may contain affiliate links*

"How do I protect my artwork from being copied from my website?"

If you have a portfolio website to display your art, or post images of your artwork on your blog, or elsewhere online, I bet you've wondered this question yourself.

It's hands-down the most common questions I answer here at EmptyEasel, and for good reason. . . as artists, we have to protect our. . . read more

If you're looking for something else. . .
Love the Easel?

Subscribe to our totally free weekly newsletter for artists. Sign up today!

EE Writers
Cassie Rief Niki Hilsabeck Lisa Orgler Carrie Lewis Aletta de Wal Phawnda Moore

If you'd like to write for EmptyEasel, let us know!

We love publishing reader-submitted art tutorials, stories, and even reviews.Submit yours here!
© 2006-2017 EmptyEasel.com About Contact Sitemap Privacy Policy Terms of Use Advertise