Introducing the Nimble Design Lab

March 03, 2015

Everyone knows that the most important thing about your blog is your content, but the way you display that content is important, too! You can make a great first impression on your readers by having a blog that looks fantastic, is accessible across many devices, and is easy for them to read.

The Typepad Team has been hard at work creating Responsive themes (Gourmet is a particular favorite), but this time we've stepped up our game.  Wouldn't you love your blog to look something like this one, gorgeous on all devices? Starting today, Beta team members will be able to do just that.

Screenshot_mel

We've rolled several amazing features into one giant piece of awesomeness that we've named the Nimble Design Lab.  You can use it to create a design like the one above and literally thousands of others.  There's a lot involved, so let's get started!

The Nimble Design Lab currently consists of three different, related features.  We'll go over each of them separately.

The first feature that works as a base to provide you with the other functions is our new responsive theme, Nimble. It's a great base theme that allows you to adopt a responsive feature set for your blog.  Responsive means that your blog will look as it should across all devices, whether it's a traditional laptop or desktop computer or the fanciest new tablet or smart phone.

Now that you have the Nimble base in place, what else can you do?  The answer is a staggering amount of things.  Let's take a look at some of the options that you have.

Nimble is currently available for one- and two- column layouts (we're working on the three-column ones for a later release). After you choose your layout, you can upload your own banner, if you like. We're offering additional banner options to allow you to choose between text or a banner image, and then keeping the banner the width of the blog or stretching it the full width of the browser.

Banner at blog width Banner stretched to browser width

Now let's really get into the nitty gritty!

Click the Style tab and you'll see a vast array of options.  These include Fonts (we'll come back to this), Banner, Navigation, Posts, Sidebar, Footer, Background, and Collections (we'll come back to this as well).

Under each of the sections, you'll see a large number of options.  You have the ability to do things like change background colors or upload an image to use as an overlay over the background color.   You can round corners and collapse the margins between columns.  You can choose colors for links, backgrounds, text, and more.  You can select different alignments for your navigation bar.  This is just a sampling of the things the Nimble Design Lab can do.

Styles

Ever wanted to apply different fonts to your blog's design but found it too difficult?  With the built in Font Selector, it's easy as pie.  Just scroll through the various options (Handwriting, Display, Serif, and Sans Serif) until you find one you like.  Don't see the perfect font?  You can import your own from Google Fonts.

Fonts

What if all of these options are a little overwhelming and you're not sure where to start?  Don't worry!  We've got you covered with Collections.  Simply click it and you'll have the option to choose from dozens of color collections and a dozen different fonts already pre-assembled to look great together.  You can apply these options to your blog and then tweak them to get the perfect look.

  CollectionsAs we mentioned, there are many great things that you can do with Nimble, but we really want to highlight the Highlight Bar!  If you have the "featured image with excerpt" option enabled at Settings > Posts, the first image in your post is going to look extra fancy:

Highlight_image

You'll be able to control the color of the Highlight Bar and its placement on the image.  It's just one more way to really make your images pop.

Take a look at some designs that we whipped up using the Nimble Design Lab.  Remember, this is a Responsive Theme, so we're going to show you how each design looks on a number of devices:

Screenshot_bri

Screenshot_jen

Screenshot_marilyn
You can see the various designs and combinations of colors, fonts, and features that can be effortlessly applied to your blog to make it a thing of beauty.

Another aspect of Nimble is that it's based on an entirely different layout scheme than previous fixed layouts in the past. If you're a fan of customizing your design with Custom CSS, you'll need to reacquaint yourself with the template structure by reviewing the source code of your blog. Test blogs are great for this type of design need.

If you're one for word play, you'll want to take notice of the theme name. You can probably see why we named it as we did! We've also still got at least one major feature we'll be adding soon! (Maybe you'd like to see your own design become a part of Typepad. Wouldn't it be cool to see your design on other blogs?) Let's just say you'll want to make sure you're a Beta team member to take advantage of the features when they're released for testing.

Are you as excited as we are? Let us know what you think by leaving us a comment here, a tweet @Typepad, or a message on Facebook. We'd love to hear from you!

Typepad 101: Shaking Up Your Front Page

February 25, 2015

By default, the front page of your Typepad blog will display the 10 most recent posts you've published, with the most recent at the top. This is a very common format, but sometimes you may want to configure your blog a bit differently. In this post, we will look at some of the different options Typepad offers for the front page of your blog.

Ten posts is usually a good number to display on the front page. People who would like to read back in your blog don't have to keep hitting the next page all the time, while at the same time the page doesn't get too long and unwieldy. If your posts are quite long or very short, however, you might want to adjust the number up or down. Or maybe you're doing something very different with your blog - our example photo showcase blog has just one post on each page so that it looks like a photo album.

To change the number of posts on the front page, go to the Settings > Posts page for your blog and look for the Posts to Display section. You can display a certain number of posts or even a certain number of days of posts (we only recommend using the Days setting if you post regularly or on a consistent schedule). Enter the number that you want to display and use the drop-down menu to choose posts or days, then scroll down to the bottom of the page to save your changes.

Posts to Display

Maybe 10 posts is a good number, but you're using your blog to tell a story that you'd like people to read from the beginning. In this case, you may want to have your blog display oldest posts first. Do be aware that if you use this format, readers who arrive at your blog won't easily be able to tell if or when you have published a new post. However, if you're using your blog to tell a complete narrative and won't be adding to it, the "oldest first" display might be ideal for your needs.

To adjust the display order, go to Settings > Posts and scroll down to the Order of Posts section. Choose either newest or oldest first, then save your changes.

Order of Posts

Another way that you can customize the display of your front page is to only display posts from certain categories. For instance, you might want more of a magazine format for your blog and to display only featured articles on the front page. Or maybe you have one or more categories you don't want on the front page, but you would like to display all of the other categories. First, make sure you know how to configure categories for your posts. Also, keep in mind that visitors arriving at your blog may not be aware that you have categories other than the ones that appear on the front page. We recommend displaying a listing of all categories using the Categories sidebar module or linking to categories using the navigation bar.

Once you've got everything set up with your categories, head on over to the Settings > Posts page and look for the section called Limit Recent Posts. When you click on the drop-down menu here, you'll see options to add a new category or to assign multiple categories and also a listing of all the categories on your blog. If you choose one of the categories in the listing, only the posts in that category will appear on the front page of your blog. Set up the category or categories you want to display, then save your changes.

Limit Recent Posts

All of these options are great, but perhaps you don't want to display your posts on the front page of your blog at all. Maybe you want to set up a landing page with important information for your readers, or you want to use your blog more like a website instead of having a stream of recent posts. First, you'll need to create the informational Page with the content for your landing page. If you plan to have posts as well as one or more Pages, you'll want to be sure to provide a link to the recent posts page in the sidebar or navigation bar.

On the Settings > Posts page, look for the Front Page section. Choose the option to display a Page and then select the Page that you want to use. After saving your changes, you will see that the Front Page section now lists the URL for the recent posts page for your blog. Be sure to copy this URL so that you can set up the link in your navigation bar!

Front Page

One other Typepad feature you may want to take advantage of in combination with any of the options discussed above - or just by itself if you want to - is the recently-added auto-generated excerpts option. This is especially helpful if you tend to write longer posts but you want to keep the front page of your blog from getting too long. You can use the split extended entry feature to manually create an introduction for each page, but if that's too much effort, just head on over to Settings > Posts and turn on the Auto-Generated Excerpts option. You can also choose whether or not to include a featured image. We recommend turning on this option to add more pop to your excerpts.

Auto-Generated Excerpts

Here's what your published posts will look like with the featured image option selected:

Featured Image

There you have it - five ways to shake up the front page of your blog. Have you customized the display of your front page? Tell us about it and share a link in the comments!

Welcome

Need help?

Follow us!

Typepad on FacebookTypepad on TwitterTypepad on Google+Typepad on PinterestSubscribe to Everything Typepad

Like us!

Typepad Newsletter

Still having trouble? Contact Support.