Everything Typepad

Typepad's New Look: Rebranding an icon

Last month, we premiered a new look at typepad.com, complete with an updated site design and an exciting new Showcase. We made sure to keep the most important elements, like the great support resources you’re used to front and center, but with a beautiful new feel.

Now that we've all had a few weeks to settle in with the new look, we'd like to talk a bit about the Typepad lily pad, and why rebranding was such an important undertaking.

When we began the rebranding of Typepad, we made sure to look closely at the impact the brand had had over the years. We knew the iconic lily pad, seen by thousands daily, was a crucial element. We made sure to keep it mostly intact, but felt it could stand on its own without the box and stem. As a result, the new logo works really well at any size and in any situation, while still remaining firmly reminiscent of the Typepad we all know and love.

We really hope you like the new look! We'd love to hear what you think, so tell us all about it in the comments!

Increase Column Widths To Allow For Premium Ads, Widescreen Videos, & Larger Images

In the forum, Typepad blogger, David, wanted to know the best width for premium ads and any other design considerations he should be aware of when placing ads on his blog.

A 300px width is recommended for premium ad space, and the column widths on your blog may need to be increased to accommodate for the wider ads. The new pre-made themes being released to Typepad have the wider sidebars, including the Retro Theme.

If you prefer to use one of the pre-made themes or a custom design created with the Theme Builder, the space in the sidebar is reduced by the column padding. However, you can use Custom CSS to customize the column widths to fit any content.

The three column right classic layout is ideal for placing ads on your site, and we'll use this layout in our example.

To set up a blog with three columns with available space of 600px, 200px, and 300px, you'll need to add extra pixels to allow for the 15px of padding on each side.

.layout-three-column-right #container { width: 1190px; }
.layout-three-column-right #alpha { width: 630px; }
.layout-three-column-right #beta { width: 230px; }
.layout-three-column-right #gamma { width: 330px; }

At Design > Custom CSS, enter the above code in the text field and click Save Changes to update your blog with the wider columns.

By setting the main content, alpha, column to 630px, you can include 600px wide images and widescreen videos within the body of your post. Vimeo and YouTube set the embedded video width at 500px and 560px respectively. The 630px column width for your main content will easily accommodate the widescreen videos.

See the article on customizing column widths for tips on changing the column widths for other layouts.

If you're not sure where to get started with placing ads on your blog, check out the article on including advertisements on your blog for tips.

Additionally, you can utilize the previous tip on adding a Wide Image or Ad Above Two Sidebars which gives you a wide ad space in the sidebar as well.

If you are looking for design tips for your blog, start a thread in the Typepad forum to get help from your fellow bloggers and the Typepad team.

Featured Blog: Creative Thursday

NAME: Marisa Haedike
BLOG: Creative Thursday
TYPEPAD MEMBER SINCE: 2008
WHY YOU'LL LOVE IT: What started out as one day a week set aside to be more creative while working a 9 to 5 job, Creative Thursday has become a full time business featuring the art of Marisa Haedike, or as she likes to call it, a dream come true. Marissa shares her art and glimpses of her day to day via her blog and its companion podcast, allowing her readers to follow along on the journey through a creative life.

FOLLOW: Typepad | Twitter

Papillon: A New Blog Takes Wing

Haya recently started a new blog on Typepad, papillon. She realized that she needed some extra assistance, so she signed up for our Power Launch Service. We helped her set up her blog with all the features she wanted including an optimized blog feed through FeedBurner, social media sharing, and a nice banner. Haya had developed a unique design for her blog featuring a floating image at the side rather than at the top. We did a custom design service to set this up for her. Haya was very pleased with the results and is thrilled to get her new blog off to a great start.

Have multiple requests for us, or just need a lot of help? We can set you up with any combination of services that you need, or create a special custom service with multiple elements. Whatever you're looking for, we can do it. Sign up today!. And do check out papillon.

P.S. You can view this and many other great blogs in our portfolio.

Introducing Retro, a new theme from Typepad

Today we're introducing Retro, the most recent in our stream of new themes.

Here's why we think you'll like Retro:

• Comes with three classic layouts;
• Has a custom font via Google Webfonts for headers
• Nice retro feeling without being cheesy;
• Set a post to be featured and it'll stand out as a great way to grab your readers' attention; and
• Unlike the majority of other themes, Retro shows off its post footers to the right of their posts (look at that swagger!).

You won't know how amazing this theme is until you try it out yourself. Are you ready to give your blog a great new look? Mosey on over to Design > Choose A Theme and apply Retro today!

Featured Blog: Oscar Ate My Muffin

NAME: Natalya Zahn
BLOG: Oscar Ate My Muffin
TYPEPAD MEMBER SINCE: 2009
WHY YOU'LL LOVE IT: Oscar Ate My Muffin follows the life of Oscar, a Rhodesian Ridgeback with a fondness for discarded or unattended baked goods, as illustrated by his dutiful studio manager & agent, Natalya Zahn. Full of delightful illustrations and photographs, this blog offers a charming look into the life of a very good dog.

FOLLOW: Typepad | Twitter

Did You Know?: Post Footer Options - Part II

Two weeks ago we explained all about the text options you can use for your post footer.  This week, we're going to tackle the button options.

To edit your Post Footer, you need to go to Design > Content.  There, click the pencil icon for Post Footer.

These are the buttons you can add to your post footer:

Reblog - Links to Reblog a portion of your post which opens the Blog It window.

Favorite - Allows your readers to Favorite your post.

Tweet This! - Opens a window so that your readers can Tweet a link to the post on Twitter. More information is available in the article on integrating your blog with Twitter.

Google +1 - Add the +1 one button to allow readers to share your post in their Google circle. More information is available here.

Pinterest - This button lets your readers pin images from your posts to Pinterest. We've got more information on adding Pinterest to your blog here.

Facebook Like - Link to add a link to Facebook wall as liked post. More information on the Facebook Like button is available here.

Digg This - Lets your readers Digg your post.

Save to del.icio.us - Link to save post as a bookmark at del.icio.us.

You can check the "Show footer links as buttons?" option so that the options with images are displayed as a button image in your post footer instead of text.

You can read more about the Post Footer in the Knowledge Base.

We hope you found this useful! Check back every other week for more "Did You Know?" tips to help make your blog even better!

Typepad's Knowledge Base is always expanding! Check out the newest articles.

You've probably seen the new look at Typepad.com and Everything Typepad. We've also been updating the Knowledge Base and wanted to point out some of the new articles.

The ability to protect individual pages and files has always been possible with Typepad. In the article on how to add password protected pages and files to your site, you'll find tips for setting up a protected folder in your account and adding content.

Love or hate Pinterest, we have you covered with tips to make it easy for readers to pin your posts or block pinning of your content.

If you prefer to not encourage linking to outside sites in comments, you can hide the URL Field in comment form.

Also, a few quick tips for composing your posts have been added:

• Add Anchor Tags To Jump To Specific Location On Page
• Change Post Date And Time
• Insert Single Line Break

Interested in a new look for your blog? Check out the recently released themes:

• Tonic Theme
• Element Theme
• Chunky Theme
• Clean Theme

If you like a theme but want to customize it, the CSS Cookbook has tips to make major or minor changes to the theme using the Custom CSS feature.

What tips would you like to see highlighted in the Knowledge Base or Everything Typepad? Let us know in the comments!

Claiming your content with the Google Authorship feature

We've discussed branding and owning your blog before; now we want to share how you can take owning your online content to a whole new level with the integration of the Google Authorship feature.

With Typepad and Google working together, the Authorship feature gives you the ability to claim your post and blog content as your own. In the search results, your image and author name will appear as a byline to your content, making your blog stand out.

In order to enable the Google Authorship feature, and have your image show up in Google search results, follow the steps outlined below:

• Have a Google+ Profile
• List your Typepad Profile in your Google+ Profile
  • Click the profile icon, then select Edit Profile
  • Edit the Other Profiles section to add your Typepad Profile URL (e.g. http://profile.typepad.com/username)
  • Edit the Contributor To section to add your blog URL (e.g. http://example.typepad.com/ or http://www.example.com/)
• Have an appropriate headshot on your Google+ Profile
  • Hover mouse over avatar area in Profile, then click "change profile photo"
  • Uploaded image must be at least 250px square
• Add your Google+ Profile to your Other Accounts list in Typepad
  • Account > Other Accounts (you will only need to add the 21-digit ID from your Google+ Profile URL; do not add the full URL)
• Add the Author Name attribute to your blog's Post Footer
  • In basic templates, go to Design > Content > Post Footer.
  • In advanced templates, locate the entry footer module code in the Main Index, DateBased, Category, and Individual Archive templates and the following code inside of it:

    <$MTTrans phrase="Posted by [_1] at" param="MTEntryAuthorNickname"$>

    Replace that with:

    Posted by <a rel="author" href="<$MTEntryAuthorProfileURL$>"><$MTEntryAuthorNickname$></a>

    Save your changes.

It can take as little as two days, or as long as two weeks, for your changes to take effect. The length of time it takes for your profile image to appear in search results is determined by a number of factors, and isn't something we can control or guarantee. We recommend waiting a few days, then using the Rich Snippets tool to verify whether the Authorship feature is in effect. When the process is complete, you'll see a display similar to the earlier shared image.

Featured Blog: The Sierra Club

NAME: The Sierra Club
BLOG: Sierra
TYPEPAD MEMBER SINCE: 2006
WHY YOU'LL LOVE IT: Since 1892, the Sierra Club has been working to protect communities, wild places, and the planet itself. They are the largest and most influential grassroots environmental organization in the United States, helping to provide a safe and healthy community in which to live, smart energy solutions to combat global warming, and an enduring legacy for America's wild places. Their blogs are insightful, engaging, and educational resources for everyone.

FOLLOW: Twitter | Typepad