gonzoblog theme: A Free, Minimalist Tumblr Blog Theme

In the first 3 Articles of this SepTumblr Series, we’ve explored the Tumblr microblogging platform. In this last Article I proudly present you my free, minimal and customizable gonzoblog Tumblr Theme. You can download it from Tumblr’s Theme Garden, .. yep, it’s an official Tumblr Theme ..!

In this Series of Articles about Tumblr I first wrote A Short Introduction to the Tumblr Blogging Platform, looking into Tumblr’s coding structure, some of the unique features and the (general) pros and cons of this micro-blogging platform. In the 2nd article I showcased 20 Free High-Quality Tumblr Blog Themes to choose from, so you could start blogging right away.

To make Tumblr even more powerful and easier to work with, I showcased several Desktop & Mobile Apps, Web Services and jQuery Plugins to spice up your Tumblog. And now it’s time for the ‘grande finale’ and to introduce to you my free and customizable Tumblr Blog Theme: the gonzoblog theme.

Last week Thursday the gonzoblog theme got approved by Tumblr, so you can use the easy 1 click button to install this theme from Tumblr’s Theme Garden (already 375+ installs). In this article I would like to share some of the features of this free Tumblr Theme:

Introducing the gonzoblog Tumblr Theme

The reason why I designed this Tumblr Theme was first of all because I wanted a customized theme for my inspiration Tumblog, Gonzo the Great. I got quite a couple of nice reactions on the different Social Streams, Communities and Networks, and that made me decide to design a free Tumblr Theme variant.

 

preview | install

Installing the gonzoblog Tumblr Theme

Installing this theme is as easy as pie, but first you need to visit Tumblr.com and sign up by entering your email address, a password and the desired URL you want to use (YourName.tumblr.com). After signing up you can install the gonzoblog theme from Tumblr’s Theme’s Garden with one simple mouse-click (install theme).

 

Traditional Comments With Disqus

Although Tumblr doesn’t include a standard commenting system, it does allow you to integrate the Disqus comment system, which can bring both comments and feedback from social networks to your blog in only a few steps.

Enter your blog’s URL address, which is usually YourName.tumblr.com. Then enter a name for your site, as well as a Shortname that uses no spaces or special characters other than dashes. Make sure to copy your shortname, as this is what you’ll need to add Disqus to Tumblr.

Tumblr’s default “Like” and “Reblog” options are an attempt to reinvent comments, but they only work well when all of your friends and readers are using Tumblr. Adding traditional comments to your Tumblr blog can broaden your site’s community and make it more fun and useful.

 

Customizing the gonzoblog theme

There are loads of aspects build into the gonzoblog-theme making it possible to personalize the appearance of the theme. When having downloaded and installed the gonzoblog-theme and the Disqus comment system, you can customize the appearance of the blog by clicking the customize button in the upper right corner of your Tumblr Blog (you must be logged in to show these buttons).

Clicking the ‘Customize’-button will bring you into a new screen where you can customize the appearance of your Tumblr Blog Theme. In this screen you can see the following buttons in the new customize navigation bar (upper left part of your screen):

1. Info
2. Theme
3. Appearance
4. Pages
5. Advanced

1. Info: here you can fill in the title of your Blog and also a short description, you can use standard HTML-tags in the description.

 

2. Theme: When clicking this button, Tumblr gives you the possibility to download any theme from the Theme Garden. When you click the ‘use custom HTML’-button you’ll be able to make changes to the source code of each theme.

 

 

3. Appearance: This is an important customization section for any theme. The colors of the (quote)text, links, titles, navigation can be set and even the color of a link on mouse-over (hover) can be set at will. The choice of the text and link colors also influence the colors of the top-header, and border-color of the header and footer.

 

 

Note: When building an official Tumblr Theme you can only use type-replacement with Cúfon (google-fonts and @fontface are 3rd party services, so NOT allowed by Tumblr – read more in ‘typography gonzoblog theme’). But due to the fact that I’m using Cúfon for my headings/titles means the hover-effect doesn’t work for the navigation. The hover-effect on the body text works, because I’m using a web safe font (Lucida Sans).

When you scroll down in this drop down menu you’ll see you can choose some more options; e.g. showing the people you follow on Tumblr, showing tags but also the integration with social media. Here you can choose if you want a Facebook ‘Like’ button and Tweet button on each post to have some kind of social integration of your blog.

 

 

 

When you scroll down a bit more (in the drop down menu of  ’Appearance’) you can see that you can fill in the URL’s of your (corporate) website, blog or portfolio. If you fill in one of these URL’s you’ll be able to see the links in the sidebar with an icon in front of it. It goes without saying that if you leave one of these input fields blank, the link (and icon) will not be visible.

Build-in possibility to pick your own (most common) social network sites and communities, just fill in your account-name and the link (with the corresponding icon) will be visible in the sidebanner, see the example below where you can see all the possibilities (twitter, facebook, LinkedIn, Flickr, Vimeo, YouTube, MySpace, Hyves, Behance, LoveDsgn, Forrst and Dribbble).

 

When you have a twitter account name filled in, your last 2 tweets will appear in the footer, updating your blogreaders with the latest news! And last but not least you also have the possibility to follow your webstats in Google Analytics, you’ll be needing an account for Google Analytics first to get an account-number that you can fill in the last input field in the drop down menu of  ’Appearances’..

4.Pages: This speaks for itself, I guess. This is the section where you can add extra pages to your blog, for instance you could add an ‘About’-page or a ‘Contact’-page. These pages show up in the sidebar and in the footer, giving your blogreaders an easy way to navigate, even if they’re at the bottom of the page.

 

5. Advanced: Here you’ll find the standard features for your blog, for instance; how much posts to show per page, using descriptive URLs (recommended BTW) and the possibility to open links in a new browser window, etc.

By now you should have a fully customized blog and you can start posting right away .. now that’s easy and quick!

Typography

As mentioned above (in 3. Appearance) I have used Cúfon type-replacement for the headings (h1,h2,h3 and h4) of the blog, I wanted League Gothic for the headings (except the title of the blog) in combination with Lucida Sans – web safe font – as body text cause I just love that ‘condensed’ look the most.

You can use the different headings by opening the HTML-tab on the text-editor and wrap your titles in a <h2>Title</h2>, or <h3>Title</h3>, etc.

CSS – Fontstacks:

• title: font-family: “AdelleBasic_Bold”, Gotham, “Rockwell”, “American Typewriter”, Georgia, “Times New Roman”, Times, serif;
• body text: font-family: “Lucida Sans Unicode”, “Lucida Grande”, Arial, sans-serif;

Some Last Words

I hope you’ll enjoy using this theme. You can use this theme  for blogging about any topic you want, but I also wanted to make it possible for designers to make a quick portfolio or photoblog with their best work, hence some of the design related Social Network and Communities Links in the sidebanner.

If you have a question about this free Tumblr Theme, please contact me on http://gonzoblog-theme.tumblr.com/. Updates and news about the gonzoblog-theme will also be mentioned here, so you could start following me on Tumblr to get all the updates. Have fun with the gonzoblog theme and start posting ..!