Tumblr development tools

Question

I want to create Tumblr theme and ineteresting is there any IDE (Netbeans, Eclipse, PHPStorm) plugins or tools for development? Ideal is to preview my theme in browser without uploading it to Tumblr. Thanks.

Answer 1

I found my own way to develop tumblr themes using PhpStorm (or possibly any other IDE) and avoid the manual copy pasting to see my updates. I wrote a simple javascript to execute in your browsers console (MIT licensed).

setInterval(function() {
jQuery.ajax('YOUR-URL-TO-THE-THEME-FILE', {cache: false}).success(function(html) {
    var btn = jQuery("div[data-action='update_preview']").first();
    if (html!=ace.edit('editor').getValue()) {
        ace.edit('editor').setValue(html);
        if (!btn.hasClass('disabled'))
            btn.click()

    }
});
},1000);

Howto:

• Use JetBrains PhpStorm to edit your html theme file ( It is possible to use other editors, the only important thing is that the file has to be hosted on a (local or public) server. )
• Click Open in browser in PhpStorm while viewing the file.
• Your browser should open with an url like this: http://localhost:63342/TumblrTheme/index.html.
• Paste this URL in the snippet above.
• Open http://www.tumblr.com/customize/YOUR-BLOG-NAME.
• Click Edit html.
• Open your browsers javascript console.
• Paste in the snippet above (remember changing the path to your theme file).
• The preview now is auto-updated every second if the source has changed.

Published at this gist: https://gist.github.com/cmfcmf/7154536

Answer 2

In terms of resources there's a few that I've found.

• TumblrThemr
• Thimble
• Tumblr Boilerplate

There's also a TextMate bundle although it's a few years old.

Developing for Tumblr is a bit of a pain, the way I do it is by setting up a test tumblr to use, reblogging or posting each post type that I want (photo, photoset, audio, text, etc.). I work on the HTML locally and get it set up how I want it to, until I know I can do pretty much everything I need to achieve via CSS alone. I then host any assets (CSS/JS/etc.) on my server, use the theme editor on my test theme to update the HTML, and then anything I need to do can just be done on my remote assets. If I need to edit the HTML I do it locally then paste it back into the theme editor.

It's not the nicest way of working, but I've done about 4 themes that way and it works okay for me.