In-Depth Review of Tumblr's Custom Theming Ability

Wdd Logo.
September 03, 2010

thumbTumblr. If you're a savvy tech maven, you may have heard of, or had the chance to use, this powerful microblogging platform.

No wonder; millions of people have chosen Tumblr as their blogging service, and the average Tumblr user creates 14 original posts every month. Half of those posts are photos, and the rest consist of text, links, quotes, music and video.

Tumblr is nothing to sneeze at. It has proven itself worthy of receiving cash infusions from two venture capital firms and a number of angel investors.

If you're thinking of climbing on board the Tumblr train, this article is your golden ticket. We'll discuss what Tumblr is and how it works, then we'll look at how to customize it. We'll cap that with a few miscellaneous bits of wisdom—things I wish I knew when I got started with Tumblr. All aboard!

What Is It?

1

Before diving into customizing Tumblr, let's hammer out what Tumblr is and how it works. If you're already familiar with Tumblr, skip down to the "Customizing Tumblr" section below.

Tumblr is a unique microblogging platform that bills its service as "the easiest way to blog"— and ease of use is certainly its main draw. Sharing the usual suspects (text and links) is dead simple, but Tumblr really shines when sharing media such as photos, video and music. Heck, even sharing quotes from other websites is easy.

And Tumblr is growing fast; at the time of writing, Tumblr had 951,860,971 posts created by 7,068,516 bloggers.

Tumblr has developed a unique vocabulary to describe the platform. A "tumblog" is the word insiders use to describe a Tumblr-powered blog, and to "reblog" is to repost content from another tumblog.

You can also "like" other tumblogs, and a tumblog can attract "followers" (as on Twitter), who receive updates each time you post content.


Admin Interface

Tumblr's admin interface is sleek. It's simple and not graphics-heavy, but you can tell a lot of thought went into the layout. Across the top are seven buttons for the different types of posts you can create. Each one looks like a torn piece of paper, and its tear—if you examine it closely—matches the one on the paper to its left.

In the right sidebar, you can see how many people you are following and how many are following you. You'll also find links to your messages, drafts, queue and customization menu.

You'll either love or hate the "Radar" in the sidebar, which features content from the Tumblr universe. If you don't want to see it, you can minimize it by clicking the "Hide" link directly below.

The main attraction of the admin page is the content that gets sucked in from people you are following. Unfortunately, Tumblr automatically subscribes you to the "Staff" account, which means you'll be subjected to news, announcements and promotions from time to time.

In the main information pipeline, you'll also see your own posts and notes when people become your followers or reblog or like your content.


Ways to Post

There are plenty of ways to post on Tumblr. The conventional method is to log into the admin area, but you have other options. If you prefer to publish on the go, you can use the free iPhone app or simply text posts in from a mobile phone.

If you are an email fiend, you'll appreciate Tumblr's sophisticated email publishing capability. To use it, simply email the unique address provided. It automatically detects the type of content you want to post and formats it accordingly. You can even use mark-up in email posts.

One of my favorite ways to post on Tumblr is to use the bookmarklet, which makes it easy to share anything you're looking at on the web. For example, by highlighting text on a page and clicking the bookmarklet, it detects that you want to quote it.


Types of Posts

Tumblr features seven types of posts:

  • Text,
  • Photo,
  • Quote,
  • Link,
  • Chat,
  • Audio,
  • Video.

For the most part, these are self-explanatory. One cool feature worth highlighting, though, is the way Tumblr handles pictures. You can post a single photo, of course, but much cooler is the "photo set"—basically, a slick photo gallery that doesn't require any programming.


Customer Service

This is one of the few areas in which Tumblr disappoints. I've had to contact customer support at least twice and didn't hear back either time.

Platform features are documented to some extent, but you wouldn't know a lot of things unless someone told you—like how to find the permalink to one of your posts in the dashboard (see the "Miscellaneous Bits of Wisdom" section below for the answer).

As it is, you're better off asking a friend or searching through a forum to find the answer to your question than contacting Tumblr directly for help. It's sad, but Marc LaFountain hasn't been much of an ambassador to the community, at least not in my view.


Free (for Now)

One of the best things about Tumblr is its price: free. I'm a little puzzled by how Tumblr makes money (perhaps it'll introduce the equivalent of a sponsored tweet sometime).

It doesn't make you pay for storage or bandwidth, and you don't have to upgrade to get "advanced" features such as the ability to customize your website or use your own domain name.

It's nice, but will it be free forever? That's a question you might want to ask before rushing full-speed ahead into developing your own Tumblr theme.


No FTP Capabilities

Unfortunately, Tumblr does not have file transfer protocol (FTP) capabilities. To make changes to your theme, copy and paste your code into a window in the customization interface.

It's a bit of a pain, but you'll need to make the trade-off in order for Tumblr to work with your design.


Using the Queue

The queue feature is a great way to keep fresh content bubbling up to the front page of your blog and holding the audience's attention.

Unfortunately, it doesn't always work as you'd expect. There are times when it works perfectly, but on more than a few occasions my entire queue has been published at once. It's very nice when it works, but it can be a huge frustration when it doesn't.


The Mega-Editor

The mega-editor lets you make batch adjustments to multiple posts (adding a tag, for example, or deleting several posts). In the mega-editor view, content can be sorted by week or by month.


Customizing Tumblr

Building a Theme

And now for the good stuff: customizing a Tumblr theme. Check out the official Tumblr documentation on theme customization. You might also want to glance at Tumblr's Theme Garden to get a sense of what others have done with the platform.

You'll probably want to create your own theme only if you're good at writing HTML by hand. If you use Dreamweaver or another WYSIWIG editor, this might not be for you.

Coding Structure

Tumblr uses two operators to render specific types of content in your HTML, and you'll need to familiarize yourself with both. These operators are "Variables" and "Blocks." To quote Tumblr directly:

Variables are used to insert dynamic data, like your blog's title or description, while blocks are used either to render a block of HTML for a set of data (like your posts) or to conditionally render a block of HTML (like a "Previous Page" link).


Basic variables include {Title}, {Description}, {RSS} and {Favicon}.

Let's say you want to render a pagination block. This is how you'd do it:

{block:Pagination}{/block:Pagination}

Each type of post is made up of numerous variables and blocks, so you'll have to style each type separately with CSS. If you plan to release your Tumblr theme for free or for cost, be sure to enable custom colors, fonts, text and images, as well as the custom CSS.


Using Your Own Domain Name

Your blog won't be completely customized until you're using your own domain name, and fortunately this is very easy.

Simply follow your domain registrar's instructions to point your domain's A-record (IP address) to 72.32.231.8—it will be the same for every domain you want to use. No need to mess with the name servers for this.

To make sure your domain is set up properly, click on the Custom Domain Test tool. To finish up, log into the admin dashboard and click Customize → Info → Use a Custom Domain Name. Enter your domain name, click "Save Changes," and you're good to go.


Miscellaneous Bits of Wisdom

Social Integration

The built-in Facebook, Twitter and FeedBurner tools are definitely worth using if you don't want to mess with third-party solutions.

Unsurprisingly, integrating social media is a snap. Navigate to Customize → Services, and enter your account information.

Tumblr can send posts to your Facebook news feed and Twitter account automatically. If you want to integrate FeedBurner, Tumblr can redirect your blog's regular RSS feed to a designated FeedBurner feed.


Letting Users Submit Posts

One nifty built-in feature of Tumblr is the ability to let users submit posts; for example, to set up a users' news section on your blog.

To enable this feature, go to Customize → Community, and check the "Let people submit posts" box. Your readers will then be able to contribute to your website. You can display submission guidelines, decide what kinds of posts people can submit and pre-populate tags.


Finding Permalinks

When you hover over an article in your dashboard, the top-right corner of the box folds down; clicking in that area reveals the permalink for that post. If someone hadn't have told me about this, I never would have known.


Your Primary Blog

Be cautious: your first Tumblr blog will be your primary blog by default, even if you create another one down the road. Every time you log into the admin panel, this blog will show up first. Use the drop-down menu in the sidebar to switch to your other blogs.


Favicons

The favicon is basically your portrait, and it can be changed by clicking Customize → Info.


Setting Your Time Zone

This may seem minor, but if you plan to use the queue, then make sure your time zone is set correctly. Go to Customize → Advanced.


Written exclusively for WDD by Chris McConnell. Chris co-founded the Brandeluxe network of sites which includes Freelance Review, Design News Source and Daily Design Advice. Be sure to follow @FreelanceReview, @Brandeluxe and @DesignNewsSrc on Twitter!

Do you use Tumblr for blogging? What are your thoughts on this platform?

WDD Staff

WDD staff are proud to be able to bring you this daily blog about web design and development. If there's something you think we should be talking about let us know @DesignerDepot.

Read Next

3 Essential Design Trends, May 2024

Integrated navigation elements, interactive typography, and digital overprints are three website design trends making…

How to Write World-Beating Web Content

Writing for the web is different from all other formats. We typically do not read to any real depth on the web; we…

20 Best New Websites, April 2024

Welcome to our sites of the month for April. With some websites, the details make all the difference, while in others,…

Exciting New Tools for Designers, April 2024

Welcome to our April tools collection. There are no practical jokes here, just practical gadgets, services, and apps to…

How Web Designers Can Stay Relevant in the Age of AI

The digital landscape is evolving rapidly. With the advent of AI, every sector is witnessing a revolution, including…

14 Top UX Tools for Designers in 2024

User Experience (UX) is one of the most important fields of design, so it should come as no surprise that there are a…

What Negative Effects Does a Bad Website Design Have On My Business?

Consumer expectations for a responsive, immersive, and visually appealing website experience have never been higher. In…

10+ Best Resources & Tools for Web Designers (2024 update)

Is searching for the best web design tools to suit your needs akin to having a recurring bad dream? Does each…

3 Essential Design Trends, April 2024

Ready to jump into some amazing new design ideas for Spring? Our roundup has everything from UX to color trends…

How to Plan Your First Successful Website

Planning a new website can be exciting and — if you’re anything like me — a little daunting. Whether you’re an…

15 Best New Fonts, March 2024

Welcome to March’s edition of our roundup of the best new fonts for designers. This month’s compilation includes…

LimeWire Developer APIs Herald a New Era of AI Integration

Generative AI is a fascinating technology. Far from the design killer some people feared, it is an empowering and…