Typepad 101: Put a Banner on It!
March 20, 2013
Welcome to Typepad 101! Whether you want to add some new features to your blog's design, or simply make your blog more functional, Typepad 101 has you covered. Topics covered in this series are suitable for bloggers at any skill level. Today's project does use a bit of Custom CSS in some areas, so you may need to be at the Pro Unlimited level or above. If you're at the Free Micro or Pro Plus levels and are interested in putting these tricks to use on your blog, you can upgrade your account anytime.
One of the best things about blogging with Typepad is how easy it can be to have a great looking blog in a few clicks, just by using one of our professionally designed Themes. With so many great themes at your fingertips and new themes being added all the time, chances are you'll find the perfect look for your blog.
But what if you want to take it a step further and develop a more custom design without getting too technical? Well, that's where custom banners come in.
There are a few ways to add a great looking banner to your blog. Typepad's Clean, Metropolitan, and Mosaic themes are beautifully designed and come equipped with our banner upload tool. Just click to add your image, and it will be dropped into your design with your blog's title and description overlaid.
Want to add the text directly to your banner with Photoshop or Paint Shop Pro instead? You can do that! Our Pro Unlimited and Pro Premium bloggers can use some Custom CSS to remove text and ribbon overlays. Learn more about that here.
Not so handy with Photoshop? No problem! Use a free service like Picfont or Ribbet to add your text, or Pixlr to crop, add text, and make other nifty edits.
Want to customize your colors, fonts, and column widths along with your banner? Then our Theme Builder is the perfect tool for you.
Ready to be inspired? Let's look at a few different types of custom banners that some great Typepad bloggers are using:
Photo based banners are a fantastically memorable way to make your blog stand out. Just open your photo in Photoshop (or use the online services mentioned above), crop it to the proper size, add your blog's title, and you're in business, just like Seymour Library, here:
If you're armed with basic to intermediate Photoshop skills (or you've hired a designer), you're ready to get fancy! Spend a few bucks on a stock illustration from a service like iStock Photo, match it up with great colors and text, and voila, you have a splendid banner that matches your blog's brand, like the one Petite Eco Kids is rocking:
A text only banner might seem simple, but it can bring a modern, classic look to your blog while allowing you to use a font that may not be found on all operating systems, without the need for special coding. Note To Self wears this look really well:
Most blogs feature their banners across the top of the page, resting evenly over its columns, but it certainly doesn't have to be that way! Why not color outside the lines, so to speak, and get creative with your banner? The more original your blog is, the more memorable it will be!
With a little Custom CSS and the Embed Your Own HTML module (here's a tip), you can shift your blog's contents up, and display your banner on the sidebar, as seen on The Ampersand:
You can even use your banner to highlight different parts of your blog. At Design Editor, the main content and sidebar are cleverly defined with a single banner:
We hope you enjoyed this lesson! If you're ready to get started and you find yourself with questions about how to make a great banner for your blog (or if you already have a great banner and you want to show it off), just leave us a comment!
PS: If you want to have a custom banner designed for your blog without breaking the bank, we can do that! Learn more here.
Thanks for these 101 posts. How 'bout converting using them in a podcast? One more way to help Typepad users.
Posted by: Lexie Smith | March 20, 2013 at 10:49 AM
Yes that is an excellent idea - create a series of video tutorials that are step by step. I would love to change my blog banner but every time I try I mess up my blog so badly it takes hours to put back to the beginning.
Posted by: Terri Walker | March 20, 2013 at 05:06 PM
Yes. Video tutorials, please.
Posted by: Barbara Hagerty | March 23, 2013 at 08:30 PM
can you help me with a video on blog banner?
Posted by: tdthomassales | March 28, 2013 at 05:16 AM