Tumblrのオリジナルテーマ作成用フレームワーク・tumblr-framework

Tumblrでオリジナルのテーマを自作
するためのフレームワーク・tumblr
-frameworkのご紹介です。日本でも
企業が公式ブログ等にTumblrを使い
始めていますのでこういったフレー
ムワークも確保しておくと良さそう。

女優の水野美紀さんや楽天、NISSANのキャンペーンサイトなどなど企業や著名人でも徐々に利用し始められてきたTumblrですが、テンプレートは独自の記法を用いて作成する必要が有ります。

この独自記法が予め書かれているフレームワークがtumblr-frameworkです。

tumblr-framework

Tumblrのオリジナルテーマを作成するためのフレームワーク。

以下のような、よく使われるタグや条件分岐タグなどが一通り備わっています。

<h1 title="{Title}"><a href="/">{Title}</a></h1>
	{block:Description}
		<p class="description">{Description}</p>
	{/block:Description}

Googleアナリティクスも管理画面で設定出来るようになっています。

{block:IfGoogleAnalyticsID}
	<script>
		var _gaq = _gaq || [];
		_gaq.push(['_setAccount', '{text:Google Analytics ID}']);
		_gaq.push(['_trackPageview']);
		(function() {
			var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
			ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
			var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
		})();
	</script>
{/block:IfGoogleAnalyticsID}

このフレームワークで作成したテンプレート例も紹介されています。（Viewport、Pinstripeなど）

ただし、CSS部分は自分で書く必要があります。編集画面で色を変えられるようにするには以下のような書き方をします。

body {
    color:{color:Text};
    background-color: {color:Background};
    font-family: Meiryo,"MS PGothic",arial,sans-serif;
}

この辺はリファレンスを見ないとですけど、オリジナルテーマを配布する以外ではあまり必要ないような気もします。Tumblrは人気ですけど、こうしたリソースはあまり見かけないような気もするので覚えて置いて損は無いのではないかなと。

ライセンスはMITです。以下よりどうぞ。

tumblr-framework