2012-01-31 18 views
7

私はTumblrのテーマを作成したいと思いますし、開発のためのIDE(Netbeans、Eclipse、PHPStorm)プラグインやツールがありますか? Tumblrにアップロードすることなく、テーマをブラウザでプレビューするのが理想的です。おかげさまで Tumblrの開発ツール

答えて

6

リソースの面では、私が見つけたものがいくつかあります。

それは数年前だが、TextMate bundleもあります。

Tumblrの開発は苦痛ですが、私がやっているのは、テストtumblrを使用して再投稿したり、投稿したい投稿タイプ(写真、フォトセット、オーディオ、テキストなど)を投稿することです。 。私はHTMLをローカルで扱い、私がそれを望む方法を設定します。私がCSSだけで達成する必要があるすべてを私ができることを知るまで、私はそれを望みます。サーバー上のアセット(CSS/JS/etc。)をホストし、テストテーマのテーマエディタを使用してHTMLを更新してから、リモートアセット上で行うことができます。 HTMLを編集する必要がある場合は、ローカルでそれをテーマエディタに貼り付けます。

それは働くのに最適な方法ではありませんが、私はそのように約4つのテーマを行い、それは大丈夫です。

6

PhpStorm(またはその他のIDE)を使用してtumblrテーマを作成し、手動コピーの貼り付けを避けて自分の更新を表示する独自の方法が見つかりました。私は、あなたのブラウザコンソール(MITライセンス)で実行するためのシンプルなjavascriptを書いています。

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:

  • 使用JetBrainsのPhpStormあなたのhtmlのテーマファイルを編集する(他のエディタを使用することが可能である、唯一重要なことは、ファイルが上でホストされなければならないことです(ローカルまたはパブリック)サーバー
  • ファイルを表示しているときにPhpStormでOpen in browserをクリックします。
  • お使いのブラウザは、http://localhost:63342/TumblrTheme/index.htmlのようなURLで開きます。
  • このURLを上記のスニペットに貼り付けます。
  • 公開http://www.tumblr.com/customize/YOUR-BLOG-NAME
  • Edit htmlをクリックします。
  • ブラウザのjavascriptコンソールを開きます。
  • 上記のスニペットを貼り付けてください(テーマファイルのパスを変更してください)。
  • ソースが変更された場合、プレビューが1秒ごとに自動更新されます。 https://gist.github.com/cmfcmf/7154536

    :この主旨で公開