Understanding the future since 1983.
5 things Tumblr can do that you might not have realised

TumblrWhen I signed up to Tumblr I didn’t necessarily know what I was getting myself into. There was a lot of hype about Tumblr on the web, but what made it different to its competitors?

I expected similar to other blogging experiences; a cookie cutter template with the ability to create “as complex as you can” posts. But to my surprise Tumblr has turned this on its end. The cookie cutter still exists (see the Theme Garden http://www.tumblr.com/themes/), but more on that later. The exciting change was that the template design is wide open, and the posts were structured.

This got me thinking. What are the possibilities with this style of platform? I quickly realised, that what Tumblr represented, was an ability to create a highly customised website to serve almost any purpose. But the most amazing part, its all for FREE.

As I played with the engine, testing its boundaries, I came to discover the following handy points.

5 things Tumblr can do that you might not have realised

  1. Embed JavaScript API’s Unlike many other simplified website development services, Tumblr actually allows you to include custom script tags (often these inclusions mess with the services own scripts, so they are blocked). So this means that everything from jQuery to Google Analytics, to that little script you wrote last year are at your disposal for creating your Tumblr template.
    Both in line and external code is possible. Google Code / API’s is a great resource for getting up to date versions of jQuery and the alike. GitHub is an excellent resource for using hosted versions of community plugins, and your looking for that little bit more from your scripts try Code Canyon. But if all else fails, just let Tumblr host it for you (keep reading for how).

  2. Host its own assets Tumblr provides a couple of options for managing the hosting of your websites assets. Firstly images can be created inside the template. Placing a meta tag in the head of your like this;

    <meta name=”image:Background” content=”“/>

    will create an input box for you to upload an image of your choice. The hosted URL of this image can be placed into your code by calling the {image:Background} API parameter for it.

    Alternatively Tumblr provides a static file upload tool for storing files like images, JavaScript, or CSS. This tool can be accessed via http://www.tumblr.com/themes/upload_static_file.

  3. Host its own CSS As I mentioned before external CSS files can be uploaded and linked using the static upload tool, but Tumblr also provides a couple of other options which are must less “static”.

    Firstly there is the CustomCSS field inside the template manager. Place any or all your CSS in this box, and then just enter the {CustomCSS} API command in the appropriate section of your code. Alternatively meta tags can be used for simple CSS aspects like color. Using the following in the head section of your template;

    <meta name=”color:Background” content=”#333333” />

    will generate a color picker in the template manager. Then placing the {color:Background} API command into the desired part of your CSS will result in a dynamic color field.

  4. Host multiple pages Websites very rarely have a single page. Tumblr has accommodated for this necessity through the pages functionality. You have the option to create three types of accessory pages. Standard, Custom, and Redirect.
    Standard pages leverage the design layout of the primary page. The HTML you implement into this page will display inside your main post tags.
    Custom pages allow you to design a new page completely from scratch.
    Redirect pages literally redirect the user to a pre-defined URL. All pages are accessed via the sub directly name you choose when you create them

    e.g. http://my.tumblr.com/myNewPage

  5. Automatic Mobile Site Straight out of the box, your Tumblr website will have its own cross-platform mobile site. Not only this, any mobile visitors to your site will be automatically detected, and delivered the mobile experience. So no worrying about browser detection scripting and mobile compatibilities.

So finally here is the interesting bit. If you fancy yourself a talented designer, there are three ways you can go about making Tumblr work for you.

  • Use your Tumblr account as a showcase for your talent. The social network aspect to the platform can help you get your work out there.
  • Design themes for submission to the Theme Garden (http://www.tumblr.com/themes/new make note of the requirements). Although they will be available to users for free, you should be able to have you name on everyone.
  • Join the Premium Theme Beta, and hopefully make some money off selling your work (email support@tumblr.com to enquire).

Now hopefully that has inspired you to get out there an start your own Tumblr, or at least given you an idea of what to do when that relative asks you to build a website for their new business.

Enjoy!

Benjamin Paton
@benjaminpaton 



Notes
  1. joerobens reblogged this from benjaminpaton
  2. bballentine reblogged this from benjaminpaton
  3. acrizzle reblogged this from lifeandcode
  4. unforeseen-circumstances reblogged this from lifeandcode
  5. gaussianmixture reblogged this from benjaminpaton
  6. lifeandcode reblogged this from benjaminpaton
  7. benjaminpaton posted this
blog comments powered by Disqus
Subscribe



Subscribe to RSS
Google Reader or Homepage

Subscribe via email
Recent Articles
Loading...
Tags
Loading...
Latest Tweets