Previous month:
February 2015
Next month:
April 2015

Posts from March 2015

New to Nimble: Borders for Posts and Sidebar & Miscellaneous Fixes

In case you missed all the hullabaloo about Nimble Design Lab, we're continuing to improve it, based not only on our own ideas for features, but also on all the feedback that we've been receiving from our Beta Team members.  Keep the feedback coming!  We love making Nimble work how YOU want it to.

The first thing we want to show off is that it's now incredibly easy to add borders to your posts and sidebars.  To do this, just look for the Border option within each section.  Click it and the options section will slide into view.  You can then click the "Change" link to see the various looks you can apply to the border like changing its color, style, and width:

Border_options

These options allow you to make some great design choices for your blog.  Check out how the use of a solid border on one side and the double border on the other really sets to the two sides apart on this blog:

Border_shot
Isn't that great?  Borders are just one more tool you can utilize to make your blog stand out from the crowd.

Next, we wanted to cover some of the miscellaneous things we've been fixing as part of our Nimble housekeeping.

Previously you may have noticed that some widgets, like the Twitter or Facebook ones, would overlap within the sidebar.  We've resolved this issue and it shouldn't happen any longer.  If you do see this occurring, though, please open a help ticket so we can help get you straightened out.

There had also been a conflict with the ShareThis widget, but it's also been resolved and you can add it to your blog at Design > Content.  Check out the Knowledge Base for more information on recommended widgets.

Finally, you should see general improvements in icons and margins on blogs.

We hope you're loving Nimble just as much as we're loving working on it!  If you're using Nimble on your blog, leave a comment with a link or send us a Tweet.  Maybe your blog will get featured!  Keep working on those designs and maybe soon, you'll see your own design in Typepad!  (New feature spolier alert!)


Typepad 101: Responsive Designs and Mobile Usability Issues

Recently you may have received an e-mail from Google about mobile usability issues on your blog.  It would look something like this:

Tool_reportThat looks scary, right?  It might look that way, but don't panic!  It actually isn't that scary at all.

All this means is that your blog needs to have a Responsive design applied to it. If you're wondering what exactly this does, it 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.  With the number of people accessing the Internet from mobile devices, making sure your blog is readable on all of them is very important.

Responsive_set

All Typepad bloggers have access to three Responsive pre-made themes: Gourmet, Sol, and Snap.  You can use any of these themes to your blog by going to Design, clicking the green "Choose a theme" button, and looking for the Responsive category.  Click the one you like best, apply it to your blog, and you're set!

If you're a Beta Team member, you'll have two additional options: the Responsive Theme Builder and the Nimble Design Lab.

It's easy to use the Responsive Theme Builder.  It works just as the Theme Builder you know and love, but has a few more options, including the option to make the theme Responsive. When creating your theme, just check the "Create as Responsive" box and your blog is now a Responsive blog!

Finally, you can use the Nimble Design Lab to make your blog Responsive.  We've been talking about Nimble a lot around here lately (Check back tomorrow to find out about even more new features!), but that's only because it's the most exciting design element in Typepad.

Nimble's got options for just about everything and we're currently making weekly updates to the system to incorporate additional features that we've been planning on releasing and features based on your own feedback and suggestions.

Once you've selected one of these designs and applied it to your blog, you can check your blog in the Mobile-Friendly Test tool. You should receive a “mobile-friendly” score, indicating that your blog is now ready to be viewed across all types of devices.

You can also read more about Responsive themes in our Knowledge Base.  If you've still got questions or need any further assistance with figuring out how to move to a Responsive theme, just open a help ticket and one of our support team members will get you straightened out!


Typepad on Pinterest: MakeWells

Did you know Typepad is on Pinterest? It's true! We love pinning and repinning great content from Typepad blogs in every genre, and we're always looking for great, inspirational content. Are you on Pinterest? Drop your link in the comments, and don't forget to follow Typepad right here! If you're not on Pinterest yet, check it out - it's a great way to promote your blog and connect with others!

Want some inspiration? Check out our featured pinner - MakeWells

Megan Wells is a Renaissance woman sharing her different mediums of art from her home studio along with her many inspirations, other artists, and living in the Blue Ridge Mountains of Virgina.

Screen Shot 2015-03-16 at 3.45.02 PM

FOLLOW: Blog | Pinterest

Want to promote your pinterest account on your Typepad blog? Just go to Blogs > Content and add the Pinterest Widget to your Sidebar via the center menu. While you're there, make your blog posts "pinable" by adding the Pin It button to your post footers.

Want even more? Learn how to promote your blog on Pinterest and follow Typepad at www.pinterest.com/typepad.


The Big Impact: Landing Pages

Bigimpact

Welcome to our series on making small changes that are guaranteed to help level up your blog's look. Every other week we’ll debut a new post, profiling some great blogs for inspiration that employ Typepad's built-in features. We'll also offer up tips and tricks that can help improve your blog's appeal, gain new readers, and build a more engaged community. Check out our other posts in the series here!

Today, we continue our series on small changes to your blog that can make a big impact. Previously, we've talked about custom banners, sidebar headers, and navigation. Our latest topic is landing pages.

In our recent tips post on shaking up your front page, we mentioned several ways to do something different with the front page of your blog, including setting an informational page as the front page. When this arrangement is used, it is often called a landing page because when visitors first arrive at your blog, that is where they land.

Let's look at some Typepad blogs that make use of landing pages. First is Nonprofit Hearts. When you arrive at Nonprofit Hearts, the first thing you read is a special message they've written for readers about what their site is about and what they hope you learn from it. Nonprofit Hearts is distinctive in another way - it's not really a blog at all! Instead, the entire site consists of informational pages, and there is a table of contents in the sidebar to allow readers to easily navigate from page to page. We love to see Typepad members stretch the limits of what a blog is like this.

Nonprofit Hearts

Next is The Daily Monster. Like Nonprofit Hearts, The Daily Monster uses their landing page to welcome readers and let them know what the site is about. Cute graphics, embedded videos, and links to the most important pages - this landing page has it all! (The site is also a great example of using sidebar header images.)

The Daily Monster

Finally we have Triline Sports. Triline Sports puts an image slider front and center on their landing page, along with photos linking to recent blog posts. Elsewhere on the page, they offer useful tools for readers, including a social media feed, testimonials, and a newsletter signup. All of this is done using Typepad's Theme Builder, a landing page, and code from a few third-party services.

Triline Sports

Inspired by these examples and want to set up your own landing page? Be sure to check out our Knowledge Base articles on creating informational pages and setting them as landing pages. If you need more assistance with your landing page, Typepad Support is just a help ticket away.

All blogs featured in our current series can be found in the Typepad Showcase! If you think you have what it takes to be in the spotlight, submit your own blog today!


New to Nimble: Stickynav & Draggable Spotlight Posts

If you've been busy creating great, Responsive blog designs with the Nimble Design Lab, you'll notice that we've made some changes in the past week (If you haven't checked Nimble out, you should! It's awesome!).

We've made some small (but mighty!) changes, fixing paragraph spacing on pages and improving the appearance of blockquotes, but we really want to highlight two major changes that we think are pretty cool.

To begin with, you can now enable a stickynav option for your Navigation Bar! Never heard of a stickynav? Let us fill you in!

Using a stickynav allows your Navigation Bar to sit right at the top of the browser window. When your readers scroll down the page, the Navigation Bar will "stick" at the top, always available, with no need to scroll back to the top of the page.

Stickynav
Even though we've scrolled down this blog, we can still see the Navigation Bar.

Next, we've created a brand new way to use the Spotlight Posts option!

Previously, spotlight posts could only be featured on your blog's Sidebar (check out the right Sidebar on the image above), but now you can drag and drop Spotlight Posts at the bottom of your blog's main content column, and they'll appear under your posts instead. You can add as many as you like, and if you've used images in your post, the first one will be displayed in an eye-catching way.

Swoonish_spotlight
Showing off your blog's posts.

We've got even more options and surprises in store, so if you haven't signed up to be a Beta Team member yet, you're really missing out!  Nimble Design Lab gives you so much power to spruce up your blog's design and it's just as easy as can be.

To all of our existing Beta Team members that have sent in feedback, thank you!  Your feedback is very important to us and has really given us some great ideas on what to include in future rounds of improvement!


Typepad 101: Easy "Sticky" Navigation Bar

Note: This tip requires the use of Custom CSS, which is available to subscribers at the Unlimited level and above. Learn how you can upgrade your account to take advantage of this great feature here.

Today, we're learning how to make your blog's Navigation Bar "stick" at the top of the page. That means that the Navigation Bar will sit right at the top of the browser window and stay in that spot when a reader scrolls down.

This is awesome because it allows you to keep important navigation links front and center. And it's really easy to execute.

This tip works especially well in conjunction with the Theme Builder.

Special note for our Nimble beta testers: We'll have this as a built in feature for you soon, so you don't need to code this yourself.

First, go to Blogs > Design > Content and make sure you have the Navigation Bar turned on and populated with the links you want to use.

Next, check to see that the Navigation Bar is styled to your liking. If you're using the Theme Builder, that's via the Design > Theme Builder page.

Your blog should now look something like this:

Navigation Bar default

Next, decide whether you want the Navigation Bar to span the full width of the browser window or just the width of the blog container.

If you'd like to span the full width of the browser, add this code in Design > Custom CSS:

 #nav {
    margin: 0;
    padding: 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
}

#banner { margin-top: 30px; }

When you view the blog after saving, you should see something like this:

Navigation Bar, full browser width

If you'd like the Navigation Bar to be the same width as the blog container, use code like this:

#nav {
    margin: 0;
    padding: 0;
    position: fixed;
    top: 0;
    width: 1050px;
    z-index: 2;
}

#banner { margin-top: 30px; }

The width is width of each column added together. You can see that under General in the Theme Builder. In our example, the main content column is 700 pixels and the sidebar is 350 pixels so that's 1050px total.

The above code will result in something like this:

Navigation Bar, blog container width

And that's it! Our Knowledge Base has even more tips for styling the Navigation Bar with Custom CSS.


Featured Blog: Eye Level

NAME: Smithsonian American Art Museum
BLOG: Eye Level
TYPEPAD MEMBER SINCE: 2005
WHY YOU'LL LOVE IT: Eye Level is the official blog of the Smithsonian American Art Museum. Using the museum’s collection as a touchstone, the conversation at Eye Level is a fascinating exploration of American art and the ways in which the nation’s art reflects its history and culture.

Eye_level

FOLLOW: Typepad | Twitter


Typepad on Pinterest: WordPlayhouse

Did you know Typepad is on Pinterest? It's true! We love pinning and repinning great content from Typepad blogs in every genre, and we're always looking for great, inspirational content. Are you on Pinterest? Drop your link in the comments, and don't forget to follow Typepad right here! If you're not on Pinterest yet, check it out - it's a great way to promote your blog and connect with others!

Want some inspiration? Check out our featured pinner, Wordplayhouse

Wordplayhouse is full of creative project ideas for your child to keep them engaged, curious, and exploring their imagination.  Written by NY Times Best Selling Author and "mother of a few",  Heather Cahoon hopes by sharing her own family's activities will give other parents fun ideas to get creative with their children and get the most out of life.

Wordplayhouse

FOLLOW: Blog | Pinterest

Want to promote your pinterest account on your Typepad blog? Just go to Blogs > Content and add the Pinterest Widget to your Sidebar via the center menu. While you're there, make your blog posts "pinable" by adding the Pin It button to your post footers.

Want even more? Learn how to promote your blog on Pinterest and follow Typepad at www.pinterest.com/typepad.