2016/12/25 その他

「Tokusetsu 3」を自鯖で運用する話

※この記事は DTM Advent Calender 2016 24日目の記事です。

jacket

(クリックで特設サイトに飛びます)

Introduction

突然ですが、今年の秋M3の新譜「Harajuku 1-Day Passport」の特設サイトは、「Tokusetsu 3」を用いて作成しました。音屋の方ならこのテンプレートをご存知の方も多いのではないでしょうか。Tokusetsu 3はTumblrに導入することで簡単に特設サイトを作れるテンプレートです。

しかし今回、この特設サイトは自分のサーバ上(www.oto-hako.net)に用意しました。なぜそうしたのか?も含めてやり方を説明します。


理由(というか経緯)

時は2016年9月に遡ります・・・!!

icon

(クリックで特設サイトに飛びます)

2015年春M3に「日本楽音ノイズ協会」名義で出したアルバム「Tokyo Θinema Paradiso」の特設サイトはTokusetsu 3 の前身である「Tokusetsu 2」を用いて、Tumblr上に公開しました。現在のURLは、http://gakuonoise-blog.tumblr.com/ となっており、「gakuonoise-blog」の部分がブログのIDとなっています。

しかし、元々のURLは http://gakuonoise.tumblr.com/ でした。(現在は他人のブログとなっています。)

Tumblrには、出来るだけコンテンツを休眠させたくないという方針があるらしく、1年以上Tumblr自体にログインをしないユーザのブログに対してはIDを運営側が勝手に変更できるというルールがあるそうです。(それが妥当かどうかはさておき)

※参考記事

https://support.tumblr.com/post/129312400022/heads-up-on-a-little-maintenance-thats-going-on

 

↓ Tumblrに問い合わせメールを送った時の返答

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-12-24-1-18-38

(普段使わないメールアドレスでTumblrに登録していたので気付けなかった・・・)

ということで、この特設サイトはいつの間にかURLが変わってしまいました。更に元のURLはフランス語のスパムっぽいアカウントに取られてしまい、取り戻すためにはユーザと直接交渉するしかない模様。日本楽音ノイズ協会相方のlumoさんとも相談しましたが直談判は断念。ひとまずURLはgakuonoise-blogのまま保留となりました。(今後URL変えるかも知れません。)

Tumblrを普段使いしてる方ならこのような問題は起こらないと思いますが、特設サイトの用途だけで使っている方はこの件は頭に置いておいた方が良いでしょう。

というわけで、今回の新譜はこのような問題が起こらないよう、テンプレートをカスタマイズして自鯖に置くことにしました。


カスタマイズ方法

 

1.Tokusetsu 3のテンプレートファイルをDLする

(元作者さんのコードから多少修正しました)

ここからDLして下さい。index.html と名前を付けてhtmlファイルを作りましょう。

 

2.Tumblrタグを抽出する

Tumblrのカスタムテンプレートは、簡単に言うとhtmlの中に{title}などの{}で囲まれたtumblrタグが埋め込まれています。要はこの部分を直接置換しちゃえばいいのです。

tumblrタグには2種類あり、前述した{text}のような単純な置換タグと、{block:example} 「block:」で始まる、xmlのように開始タグと閉じタグで挟むタイプのタグ {/block:example}があります。

というわけで、置換するためにこのテンプレートで使われているタグを抽出しましょう。正規表現を使えばできます。

 

・・・いや面倒でしょ。というわけでタグ抽出済みのスプレッドシートを用意しました。

「text」シートには前者の情報を入力、「block」シートには{block}{/block}を表示するかしないかどうかを1か0で入力しましょう。「コピー用」シートの内容は後で使います。

 

3.python環境を整える

ググってください。(たぶん2でも3でも大丈夫だと思います)

 

4.Tumblrタグを置換する

置換用コードをここからDLして下さい。さきほどDLしたindex.htmlと同じフォルダに置きましょう。

perse.pyのコードをテキストエディタで開き、スプレッドシートの「コピー用」シートのセルを縦一列単位でコピペします。ペーストする場所はperse.py内のコメントを参考にしてください。

ペーストしたら、perse.pyを実行して下さい。(実行の仕方はググって下さい)

index_fix.htmlが同一フォルダ内に出力されます。このファイルが特設サイトのhtml本体になります。

お疲れ様でした。

いや1から作ったほうがよくない?というのは置いておいて


[宣伝] Harajuku 1-Day Passport はC91 3日目西り39a「Prhyzmica」さんにて委託頒布予定です。視聴音源を貼ってお茶を濁します。ここまでお読み頂きありがとうございました。

 

Copyright ©2005-2017 おとのはこにわ All Rights Reserved.