@Style

何気なくタグをクリックしたみた。

エラーが発生しました。
Not a HASH reference

とりあえずfogbugzに上げておきました。

新サーバー簡単移行」機能とは、旧サーバー環境（sv1.xserver.jp～sv1999.xserver.jp）をご利用のお客様が、「データコピー」「確認」「移行」の3ステップのみで最新サーバー環境（sv2001.xserver.jp 以降）へ簡単に移行することができる機能です。

新サーバー簡単移行 | レンタルサーバー【エックスサーバー】

「データコピー申請」を行うと、わずか20分程で新環境のサーバーにすべてのデーターのコピーが作られる。Movable Typeのcheck.cgiなどアクセス権を000にしていたファイルはすべてエラーとなったが全く問題なし。（移行完了しないと確認ができないが）DNSレコードもコピーされていた。

移行後にMovable Typeが高速で再構築できるようになった。

Web制作者、Webサイト運営者、CMS初心者、CMSに興味がある人を対象としたCMSの有識者によるセッション形式のセミナーです。
今回はMT Sagaさんとの共同開催です！

Movable Typeだけでなく、WordPressやbaserCMS、Jimdoについてのセッションもあります。

気になる方はぜひお越しください！

イベント詳細：https://goo.gl/SSJzNI
申し込みフォーム：https://goo.gl/mkaT0L

テーマ販売と制作を本年3月に終了しましたが、十数年にわたりご愛顧いただきましたお得意様をはじめ、ご指導ご鞭撻を賜わりました業界各位の皆様には心よりお礼申し上げます。

2016年 Advent Calendar 3日目の記事として、感謝を込め、ほんの少しだけMovable Typeでの思い出を書こうと思います。（敬称略）

趣味でMovable Type

2003年12月、当時nifty会員だったのでスタート当日からココログを使い始めた。 ValidなHTMLを目指してみたりCSSをいじり倒してみたりで面白かった。まだまだCSSだけでレイアウトしているサイトが少ない頃だったので作成した3カラム用のスタイルシートを配布してみた。後の仕事につながったのかもしれない。

使って行くうちにどうも物足りなくなりココログ兄貴分のMovable Typeを使ってみたくなった。 当時は人気で入手困難だったXREAの無料アカウントが手に入ったので、Movable Typeの2.6（詳細なバージョンは覚えていない）をインストールした。はっきりと覚えているのはバージョン2.661。

Milano::Monologさん「引き続き、MT2.661用の日本語化パッチをリリースしました」

書くのは専ら当時所有していた1958年式Volks Wagenのこと。ここでもValidなHTMLとCSSを目指していじり倒した。

そうこうしているうちにMovable Typeの3.0がリリースされたので早速アップグレード。ところがコメントがうまく動作しないので色々考えたが上之郷谷太一さんのブログに「おかしいですね」とコメントを書いてみた。そのコメントを見た小川 宏高さんから解決策を教えてもらった。 数年後、小川さんにこの話しをしたら覚えていらっしゃった。

2004年の秋頃から体調が思わしくなく、翌年の2005年2月に入院。その後に会社員としての仕事が難しくなり自宅療養しながらMovable Typeで遊んでいた。 これを仕事にしようと思ったのが5月。早速ドメイン（atstyle.biz）を取得して準備を始めた。

まずは療養中に作っておいたMovable Typeのテンプレートを無料で配布してみた。テンプレートにはリンクを挿入していたのでアクセス解析でわかる。たくさんの方に使用していただいていたようだった。

こっそりと開業したが

本格的に販売しようと思って2005年12月5日に開業届けを提出。翌年の2006年1月には、シンプルなブログ型のテンプレートだったが15本売れた。結局2006年は180本販売した。多くの企業様、個人事業主様、製作会社様にご利用いただき営業を終了するまでの10年間で700ものライセンスをご購入頂いた。

2006年2月 小林 晋也さんから突然の電話。「こんなこともあるんだ」と思ってびっくりした

3月 CSSによるレイアウトに困っていた蒲生 トシヒロさんのブログにトラックバック（←懐かしい響き！）してみた。なんでもなさそうなことが人生を変えてしまったかもしれない。 その後は懇意にしていただき、色々と体験させてもらった。 蒲生さんのお誘いで2007年の1月にWebSig 24/7の大阪での新年会に参加した。そこでは 和田 嘉弘さん・中野 宗さん・茂出木 謙太郎さん・坂西 裕彰さんにお会いし、この世界を全く知らない私は圧倒されっぱなしだった。

WebSig 24/7ではMovable TypeテーマとしたWebSig会議も行われていた。2007年7月31日神田のデジタルハリウッド大学で【第14回】WebSig会議受付開始　「Movable Type 4のポテンシャルを探る～GPLライセンス版登場でMTはどう変貌するか？」が行われた。すごいメンバーだ！これは参加するしかない。

このWebSig会議後の懇親会で登壇者の藤本壱さん（この時はお話しできませんでした）・関根 元和さん・小川 宏高さんとご一緒した。もう一人の登壇者の野田 純生さんとは同じホテルだった。 WebSig会議が終了後一旦ホテルに入った。懇親会へ移動の前にホテルの喫煙所で汗を拭きながらタバコを吸っていた野田さんと名刺交換させていただいた。

少し時期が遡るが「Web Designing (ウェブデザイニング) 2007年 05月号」に寄稿させていただいた。どういう経路で私のところにお声がかかったかは忘れたが、これにはびっくりした。できるかどうか心配だったが引き受けてみた。

Movable Typeのデフォルトテンプレートに手を入れたものを配布していたので、これをテーマとして寄稿しても良いかをWebSig 24/7の大阪での新年会でご一緒した（当時はシックス・アパートの）河野武さんに聞いてみた。「直接シックス・アパートに聞いた方が良い」とご指導いただいた。 なんだか色々と誤解もあったらしいけれども利用規約の改定を確認してもらってOKをいただいた。 編集の方からは「図版は.aiで入稿してね」と。Fireworksしか使っていなかったので慌てて手配。なんとかできた。

この後大変なことが起こるのですが、それは追々書かせていただきます。

ありがとう、Movable Type

html5slidesが削除されたので、Movable Typeのテンプレートで作ったスライドが動かなくなった。チョコっと修正して動くようになったので覚書。

以下よりhtml5slidesをダウンロードする

slides.js・prettify.js・styles.cssを使用する

slides.jsを開き、13行めのパスを書き換える

var PERMANENT_URL_PREFIX = 'http://html5slides.googlecode.com/svn/trunk/';

例えば、スライド直下であれば以下の通り。

var PERMANENT_URL_PREFIX = '';

slides.js・prettify.js・styles.cssをインデックステンプレートに作成する。

インデックステンプレートの「メインページ」23行め、slides.jsへのパスを修正する。

<script src="http://html5slides.googlecode.com/svn/trunk/slides.js"></script>

<script src="slides.js"></script>

Movable Type 6 ブログテーマを少し手直しし、GitHubで公開しています。

ご利用ください。

販売中のテーマデモサイトをSSL化した際の覚書。テーマには一切手を入れずに完了した。

AdminCGIPath https://example.com/Movable Typeをインストールしたディレクトリ/

再構築して完了

本日より、Movable Type 6.2 の出荷を開始します。すでに Movable Type 6 のライセンスをお持ちの方は、無償で Movable Type 6.2 にアップグレードいただけます。

アイテム管理・編集機能を強化したCMSの最新版 Movable Type 6.2 をリリース

早速、アップデートしようとしたが"Can't locate parent.pm"というエラーが発生。「Parent モジュールが必要になったんですけど...」とシックス・アパートの高山さんから教えていただいたが、利用中のサーバーにはインストールされていなかった。

エックスサーバーに問い合わせてみたところ、「サーバーにアップロードすれば利用可能な場合がある」との回答。parent.pmをアップロードしてcgiファイルにuse parent;を追加記述。やっと動きました。

2015年9月30日、Movable Type 5.2.x は"EOL"（製品ライフサイクルの終了）となりました。

【Movable Type 5】EOL（製品ライフサイクルの終了）のお知らせ

アットスタイルではMovable Type ５以下のテーマの販売を終了することにいたしました。無料テンプレートにつきましても同様に公開を終了する予定です。

何卒、ご理解の程よろしくお願いします。

スマートフォンから、Movable Type へブログ記事やニュース記事を簡単に投稿する。そんな Movable Type 専用アプリができました。

特徴は

• 記事／ウェブページの作成・編集・投稿（カスタムフィールド対応）
• 記事公開日・非公開日の設定
• カテゴリやフォルダの設定
• 編集中の記事／ウェブページのプレビュー（スマートフォン＆PCビュー）
• 投稿した記事やウェブページの確認（スマートフォン＆PCビュー）
• 下書きした記事やウェブページのローカル保存
• 写真のアップロード、サイズ・品質指定・管理
• Basic認証に保護された Movable Type でも利用可能

早速インストールしてみた

先日よりMT6 ウェブサイトと配下のブログのどちらでも利用できるテーマを公開・販売しています。

これまでのテーマはウェブサイトとブログ用に構成していましたが、「Movable Type 6 ブログテーマ」は、ウェブサイト単体またはブログ単体で利用することができます。

個人ブログやウェブサイト配下でちょっとしたブログを作成する場合に最適です。

Google アカウントでコメントサインインしようするとMovable Type 6.1.1でエラーが発生します。

Google アカウントでは現在 OpenID Connect が使用され、OpenID 2.0 は 2015 年 4 月 20 日以降、ご利用いただけなくなりました。

とりあえずFogbugzにあげています。

Googleアカウントでのコメントサインインエラー

HTML 5ではscript要素のtype="text/javascriptは省略可能なので消したい。

<$mt:StatsSnippet replace=' type="text/javascript"','' $>

すっきり

5月21日、ヨカラボ天神にて「MT福岡 もくもく会 vol.2」を開催しました。

今回も長丁場。

成果はこれ。

ブログでもウェブサイトでも利用できるシンプルなBootstrapテーマ。もちろんOGPや構造化データも実装。

販売は少々お待ちください。

本年一発目（昨年はほぼ休止状態...）は、ゆる〜い「もくもく会」。

私の作業の内容は、Bootstrap 3.3.4とFont Awesome 4.3.0を使い、デザインを変えないリニューアル。

今後も「もくもく会」は行われるようです。

• 一人だとどうも進まない
• Movable Typeを通じて交流がしたい。
• Movable Typeって気になっていたけれど触れる機会がない。

あまり触れたことのない人でも興味があれば大歓迎です。

MT福岡はMovable Type大好きな人たちが集まるユーザーグループです。

MT福岡 Facebookページ

2月10日からエックスサーバーで提供されている「MySQL5.5移行ツール」を利用してMySQLのバージョン移行、Movable Typeの設定を行った。

サーバーパネルにログインし、phpmyadminでMySQL5をダウンロードしておく。その後、「MySQL5.5移行ツール」をクリックする。

MySQL5.5のホスト名（図ではグリーンの部分）が表示されるのでメモなどしておく。

外面下の「MySQL5.5移行ツールの利用を開始する」をクリック

使用中のMySQL5毎に移行を行う。文字コードを選択し「移行（確認）」ボタンをクリック。「MySQL5.5へデータベースの追加（確定）」をクリック。

mt-config.cgiのデータベース設定部分を編集してアップロードする。

正常な動作を確認したらMySQL5.5移行ツールの「バージョンをMySQL5.5に移行する（確認）」をクリックして完了。

iMacセットアップ完了から25日になるが、やっとMovable Typeを動かす設定ができたので覚書

インストールの手順

Mac App StoreからXcodeをインストールする

ターミナルでXcodeのライセンスに同意する

sudo xcodebuild -license

Command Line Developer Toolsをインストール

xcode-select --install

MAMPのダウンロードとインストール

• MAMP: Mac, Apache, MySQL, PHP

MacPortsのダウンロードとインストール

• The MacPorts Project -- Home

MacPortsの初期化

echo 'export PATH=$PATH:/opt/local/bin:/opt/local/sbin/' >> ~/.bashrc
echo 'export MANPATH=$MANPATH:/opt/local/man' >> ~/.bashrc
echo 'source ~/.bashrc' >> ~/.bash_profile
sudo port -d selfupdate
sudo port -d sync

ImageMagickなどのインストール（＊Mac miniでは1時間くらいかかってたがiMacでは15分位だった！）

sudo port install ImageMagick +perl

ImageMagickのインストールは出来ているみたいだが、システム情報では「インストールされていません。」と表示されている。よくわからないので、後ほどGDもインストールする。

PerlのパスをMacPortsのインストールディレクトリへ変更

cd /usr/bin/
sudo mv perl perl.bak
sudo ln -s /opt/local/bin/perl /usr/bin/perl

DB関連モジュールのインストール

sudo port install p5-dbi
sudo port install p5-dbd-mysql
sudo port install p5-dbd-sqlite
sudo port install p5-dbd-sqlite2

上記3つ目・4つ目は実行せず、SQLiteとSQLite2はインストールしなかった

オプションモジュールのインストール

sudo port install p5-gd
sudo port install p5-crypt-dsa
sudo port install p5-archive-zip
sudo port install p5-xml-atom
sudo port install p5-mail-sendmail

FTPクライアントを使って.htaccessを追加

Options +ExecCGI
AddType application/x-httpd-cgi .cgi .pl

「スマートフォン・タブレット端末対応 ビジネス向けMovable Type 6 ベーステーマ（テンプレート） Bootstrap HTML5」のBootstrapをv3.3.0からv3.3.1にアップデートしました。

よろしくお願いします。

1ヶ月ほど前になりますが、Bootstrap v3.3.1がリリースされています。

これに伴い、「Movable Type 6 無料テーマ Bootstrap 01」のBootstrapをv3.3.0からv3.3.1にアップデートしました。

有料テーマのアップデートは完成次第、ご案内します。

よろしくお願いします。

特定のウェブページのみで利用するCSSなどは、他のページで利用することはない。特定ウェブページにstyle要素で指定すれば他のページに影響することがなく、僅かであるが読み込みも速くなるだろう。

例えば、サイトマップのページが格納されているフォルダ名「サイトマップ」の場合だけに使用する背景画像を、Base64でstyle要素に追加する。

予めsitemap_folderを指定し、mt:FolderLabelの値と比較する。

<mt:SetVar name="sitemap_folder" value="サイトマップ">
<mt:SetVarBlock name="Folder"><$mt:FolderLabel$></mt:SetVarBlock>
<mt:If name="sitemap_folder" like="$Folder">
<style>
.main-unit  ul.tree li {
    background: url(data:image/png;base64,エンコードした文字列);
}
</style>
</mt:If>

この例では、アーカイブパスを%c/%iにしている。（その他の設定の場合は変更が必要。適用できないこともあります。）

「スマートフォン・タブレット端末対応 ビジネス向けMovable Type 6 ベーステーマ（テンプレート） Bootstrap HTML5」のBootstrapをv3.2.0からv3.3.0へ、FontAwesomeを4.1.0から4.2.0にアップデートしました。

よろしくお願いします。

Bootstrap v3.3.0がリリースされています。

これに伴い、「Movable Type 6 無料テーマ Bootstrap 01」のBootstrapをv3.2.0からv3.3.0にアップデートしました。

有料テーマのアップデートは完成次第、ご案内します。

よろしくお願いします。

先日の「Movable Type 6 無料テーマ」のアップデートに続き、「スマートフォン・タブレット端末対応 ビジネス向けMovable Type 6 ベーステーマ（テンプレート） Bootstrap HTML5」のBootstrapをv3.1.1からv3.2.0へ、FontAwesomeを4.03から4.1.0にアップデートしました。

よろしくお願いします。

Bootstrap v3.2.0がリリースされています。

これに伴い、「Movable Type 6 無料テーマ Bootstrap 01」のBootstrapをv3.1.1からv3.2.0にアップデートしました。

有料テーマのアップデートは完成次第、ご案内します。

よろしくお願いします。

Movable Type 5の製品ライフサイクル終了日は、2016年1月15日となっており、継続使用される所も多いようです。

アットスタイルで販売中の「Movable Type 6 テーマ（テンプレート） Bootstrap HTML5」をMovable Type 5で利用する方法をご紹介します。

なお「Movable Type 6 ビジネス向けベーステーマ（テンプレート） Bootstrap HTML5」でも同様の編集でご利用いただけます。

<$mt:WebsiteName encode_html="1"$>

<mt:BlogParentWebsite><$mt:WebsiteName encode_html="1"$></mt:BlogParentWebsite>

<li><a href="<$mt:WebsiteURL$>">Home</a></li>

<li><a href="<mt:BlogParentWebsite><$mt:WebsiteURL$></mt:BlogParentWebsite>">Home</a></li>

変更後、再構築して完了です。

第1回から第3回まではケーススタディーとして開催されましたが、今回は実践的なMovableTypeテーマについてのイベントになったようです。

気になる内容は

1. テーマの導入によるウェブサイト制作の高効率化
   テーマ導入の事例
   テーマ導入によるワークフロー改善
2. MTのインストール、セッティング
   テーマ導入までのMTの設定を解説
3. テーマ制作

参加したいのですが...

色々なところでMovable Typeの利用に関する注意喚起が行われています。

mt.cgiの名前を変更して管理画面にBASIC認証をかける手順を紹介します。

mt.cgiの名前を変更

mt.cgiの名前を変更後にmt-config.cgiへ追加記述します。例えばhoge.cgiとする場合は以下のように記述します。

AdminScript hoge.cgi

管理画面にBASIC認証をかける

.htaccessに以下の内容を追加します。パスは適宜編集して下さい。

<Files hoge.cgi>
AuthUserFile アプリケーション ディレクトリへのパス/.htpasswd
AuthGroupFile /dev/null
AuthName "Please enter your ID and password"
AuthType Basic
require valid-user
order deny,allow
</Files>

「ベーシック認証 作成」で検索するとたくさんのツールがありますので、これらを使ってパスワードを暗号化しておきます。

以下の様な.htpasswdファイルを作成します。

ID名:暗号化されたパスワード

.htaccessと.htpasswdをアプリケーションディレクトリにアップロードします。

.から始まるファイルが見えない場合は.txtなどで保存しアップロード後に.htaccessと.htpasswdに名前を変更して下さい。

8年ほど前に「テンプレートに同梱させてください」とお願いし快諾いただいたSYNCK GRAPHICAさんの【メールフォームCGI Jcode版】が、5月2日にアップデートされています。

これに伴い、Movable Type 6 ビジネス向けベーステーマ Bootstrap HTML5には最新版を同梱いたします。

よろしくお願い致します。

Movable Type 6 無料テーマ Bootstrap 01にフラットでシンプルなデザインが美しいBootswatchのスタイルシートを適用する方法をご紹介します。

Bootswatchのスタイルシートを利用するには、予めナビゲーションバーをFixed navbarなどに変更します。

ダッシュボードを開き、Bootswatchよりダウンロードしたbootstrap.min.cssをbootstrap_min_css（bootstrap_min_css.mtml）にペーストします。ファイルサイズが大きいために上手くペースト出来ない事があります。その場合はテーマのbootstrap_min_css.mtmlに上書きアップロードし、bootstrap_min_cssを初期化して下さい。

テーマによってはページャーなどがうまく表示されないものもあるようです。多少カスタマイズの必要な場合があります。

「Movable Type 6 無料テーマ Bootstrap 01」にはZenbackの設定をスムーズに行えるように「Zenback」モジュールを作成しています。このモジュールにコードを記述するだけでZenbackを実装することが出来ます。

「Zenback」モジュール（zenback.mtml）を開きます。上下の<!--と-->を削除し、「ここに Zenback の Script コードを貼り付けてください。」部分にZenbackから提供されたコードを記述します。

「記事アーカイブ」を再構築します。

設定直後は上手く表示できませんが、少し時間が経過すると正しく表示されます。

昨日、「Movable Type 6 無料テーマ Bootstrap 01」のユーザー様よりmeta name="keywords"の出力についてご質問をいただきましたので、ブログでも紹介いたします。

• 記事のキーワードフィールドの内容をmeta name="keywords"として出力
• meta name="description"の直後に出力する

「HTMLヘッダー」モジュール（html_head.mtml）を開いてdescription部分に

<meta name="keywords" content="<$mt:EntryKeywords$>">

を追加します。

entry_templateで分岐しているその範囲内に追加します。

<mt:Ignore>================ description ================</mt:Ignore>
<mt:If name="entry_template">
<meta name="description" content="<$mt:EntryExcerpt remove_html="1"$>">
<meta name="keywords" content="<$mt:EntryKeywords$>">
<mt:ElseIf name="category_archive">
<meta name="description" content="<$mt:ArchiveTitle$> <$mt:CategoryDescription$>">
<mt:ElseIf name="page_template">
<meta name="description" content="<$mt:PageTitle$> <$mt:PageExcerpt remove_html="1"$>">
<mt:ElseIf name="main_index"><mt:If tag="BlogDescription">
<meta name="description" content="<$mt:BlogDescription$>">
</mt:If><mt:Else>
<meta name="description" content="<$mt:var name="page_title"$>">
</mt:If>
<mt:Ignore>================ /description ================</mt:Ignore>

記事以外でキーワードの追加を行うとしたら、以下のようになります。

<mt:Ignore>================ description ================</mt:Ignore>
<mt:If name="entry_template">
<meta name="description" content="<$mt:EntryExcerpt remove_html="1"$>">
<meta name="keywords" content="<$mt:EntryKeywords$>">
<mt:ElseIf name="category_archive">
<meta name="description" content="<$mt:ArchiveTitle$> <$mt:CategoryDescription$>">
<meta name="keywords" content="キーワード1,キーワード2,キーワード3">
<mt:ElseIf name="page_template">
<meta name="description" content="<$mt:PageTitle$> <$mt:PageExcerpt remove_html="1"$>">
<meta name="keywords" content="<$mt:PageKeywords$>">
<mt:ElseIf name="main_index"><mt:If tag="BlogDescription">
<meta name="description" content="<$mt:BlogDescription$>">
<meta name="keywords" content="キーワード4,キーワード5,キーワード6">
</mt:If><mt:Else>
<meta name="description" content="<$mt:var name="page_title"$>">
<meta name="keywords" content="キーワード7,キーワード8,キーワード9">
</mt:If>
<mt:Ignore>================ /description ================</mt:Ignore>

キーワード1~キーワード9は適宜変更してください。

無料配布中のMovable Type テーマ（テンプレート）をGitHubに移動しました。

• Movable Type 6 無料テーマ Bootstrap 01
• Movable Type 6 無料 html5slidesプレゼンテーションテンプレート
• Movable Type 5 無料 html5slidesプレゼンテーションテンプレート
• Movable Type 5 無料テーマ HTML5
• Movable Type 4.2 無料テンプレート 2Column HTML5
• Movable Type 4.2 無料テンプレート 2Column 2nd
• Movable Type 4.2 無料テンプレート 2Column

利用規約も変更し、より気軽にご利用いただけるようになりました。よろしくお願いします。

「Movable Type 6 無料テーマ Bootstrap 01」のナビゲーションバーを、Bootstrapのサンプルにも掲載されているFixed navbarにカスタマイズする方法をご紹介します。

バナーヘッダー（banner_header.mtml）を以下の内容に変更します

<div class="navbar navbar-default navbar-fixed-top">
<div class="container">
<header role="banner">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="<$mt:Link template="メインページ"$>"><$mt:BlogName$></a>
</div>
<nav class="navbar-collapse collapse" role="navigation">
<ul class="nav navbar-nav">
<li><a href="<$mt:Link template="メインページ"$>">Home</a></li>
<mt:Pages tag="@about">
<li><a href="<$mt:PagePermalink$>"><$mt:PageTitle$></a></li>
</mt:Pages>
<mt:Pages tag="@ADD_TO_SITE_NAV">
<li><a href="<$mt:PagePermalink encode_html="1"$>"><$mt:PageTitle$></a></li>
</mt:Pages>
<li><a href="<$mt:Link template="最新記事のフィード"$>">Feed</a></li>
</ul>
</nav>
</header>
</div>
</div>
<div class="container">
<header class="blog-header" role="banner">
<h1 class="blog-title"><$mt:BlogName encode_html="1"$></h1>
<p class="lead blog-description"><$mt:BlogDescription$></p>
</header>
<div class="row">

custom_for_mt_css（custom_for_mt_css.mtml）に以下を追加します。

body {
    padding-top: 40px;
}

再構築し完成です。

「Movable Type 6 無料テーマ Bootstrap 01」は、幾つかのOGPが自動的に出力されますが、テーマインストール時にog:imageの設定を行って下さい。

まずブログ全体のog:imageを設定します。手動でFTPする方法とMovable Typeのアイテムを利用する方法があります。

og:imageをFTPアップロードする方法

1. 「blogimg」フォルダの中にあるオープングラフ(OGP)用の og_image.png を参考に画像を作成して 上書きします。
2. 公開するディレクトリへ「blogimg」フォルダごとアップロードします。

og:imageをMovable Typeのアイテムとしてアップロードする方法

1. サイドメニューから [アイテム] - [新規] を選択します。
2. [ファイルを選択] ボタンをクリックして、画像をアップロードします。
3. アイテム一覧から、アップロードした画像アイテムを選択して、[アクション] - [タグを追加] を行います。
4. 表示されたポップアップウィンドウに、@SITE_ICON を指定します。

記事アーカイブでは、記事に関連付けされた画像アイテムが、優先的に利用されます。複数の画像アイテムが存在する場合は、最新の画像アイテムが採用されます。

「Movable Type 6 無料テーマ Bootstrap 01」はRainierやApexと同様にウェブページをナビゲーションメニューに追加することが出来ます。

今回のカスタマイズは、その方法をご紹介します。

1. サイドメニューから [ウェブページ] - [新規] を選択します。
2. 「タイトル」「本文」「続き」に内容を入力し、タグとして @ADD_TO_SITE_NAV を指定し、ウェブページを公開します。
3. 再構築します。

ナビゲーションに「タイトル」がそのまま表示されるのでご注意下さい。

「Movable Type 6 無料テーマ Bootstrap 01」はシンプルに使っていただきたかったのでFont Awesomeのアイコンを実装しておりません。簡単に追加することが出来ますのでご紹介します。

Font Awesomeのサイトから一式をダウンロードします。

ダウンロードしたファイルを解凍し、「fonts」フォルダをMovable Typeで指定した「ブログURL」直下へアップロードします。

ダッシュボードから「HTMLヘッダー」（html_head.mtml）を開き、Custom styles for Movable Typeの下辺りに次の様に記述します。

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">

テンプレートや記事のお好きな場所に以下の記述を追加して、アイコンを表示できます。

<i class="fa fa-アイコンの名前"></i>

例えば上部ナビゲーションバーにホームアイコンを追加する場合は「バナーヘッダー」モジュール（banner_header.mtml）を開き、5行目の記述

<a href="<$mt:BlogURL$>" class="blog-nav-item">Home</a>

を、以下のように書き換えます。

<a href="<$mt:BlogURL$>" class="blog-nav-item"><i class="fa fa-home"></i> Home</a>

先日リリースしました「Movable Type 6 無料テーマ Bootstrap 01」の「記事」テンプレートと「記事の概要」モジュールを修正しました。

どちらにもmicroformats 2の記述を一部追加しています。

よろしくお願いします。

先日より作成を行っていた「Movable Type 6 無料テーマ Bootstrap 01」をリリースしました。

大画面では2カラム（右サイドバー）スマートフォンなどの小さい画面では1カラムで表示出来るBootstrap謹製のBlog templateをベースに Movable Type 標準のテーマ「Rainier」で実装されたオープングラフ(Open Graph Protocol)や Microdata、構造化データ、ページネーションを加味し、レスポンシブデザインのテーマに仕上げました。

プレゼンテーションテンプレートと同様にGitHubからのダウンロードをお願いいたします。

ご利用下さい。

Bootstrapには入門用に幾つかの基本テンプレートが用意されている。

Build on the basic template above with Bootstrap's many components. See also Customizing Bootstrap for tips on maintaining your own Bootstrap variants.

Getting started · Bootstrap

この中にブログ用のテンプレートもある。

The official example template of creating a blog with Bootstrap.

このテンプレートを使ってMovable Type 6用のテーマ作成中。現在のところ、メインページと記事のページは完成。

公開には、もう少し時間がかかると思います。

先日のBootstrap アップデートに続き、以下のテーマのBootstrapをv3.1.0からv3.1.1にアップデートしました。

スマートフォン・タブレット端末対応 ビジネス向けMovable Type 6 テーマ（テンプレート） Bootstrap HTML5

よろしくお願いします。

Bootstrap v3.1.1がリリースされています。

これに伴い、以下のテーマのBootstrapをv3.0.2からv3.1.1にアップデートしました。

スマートフォン・タブレット端末対応 Movable Type 6 テーマ（テンプレート） Bootstrap HTML5

jQueryはGoole Codeからcode.jquery.comの最新（1.11.0）に変更しています。よろしくお願いします。

空要素は /> で閉じるのですか？ それとも > で閉じるのですか？

HTML の空要素（たとえば、br, img, input 要素）に終端スラッシュをいれる必要はありません。<br />の代わりに<br> と書けば良いだけです。これは HTML4 と同じです。しかし、XHTML1 の利用が広まっているため、かなり多くのページで、終端スラッシュが使われています。

WHATWG FAQ - 日本語訳 - HTML5.JP

Movable Typeのテンプレートタグ MTCanonicalLinkはlink rel="canonical"としてURLが出力される。link要素の終端スラッシュが少し気持ち悪いので置換を使って削除した。

<$mt:CanonicalLink replace=" /",""$>

BootstrapでのPaginationは以下のようにマークアップを行う

<ul class="pagination">
<li><a href="#">&laquo;</a></li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">&raquo;</a></li>
</ul>

Movable Type テンプレートタグで書き換える

<div class="pagination">
<ul>
 
<mt:IfPreviousResults>
<li><a href="<$mt:PreviousLink$>" rel="prev" onclick="return swapContent(-1);">&laquo;</a></li>
</mt:IfPreviousResults>
 
<mt:PagerBlock>
<mt:IfCurrentPage>
<li class="active"><a href="#"><$mt:Var name="__value__"$></a></li><mt:Else><li><a href="<$mt:PagerLink$>"><$mt:Var name="__value__"$></a></li>
</mt:IfCurrentPage>
</mt:PagerBlock>
 
<mt:IfMoreResults>
<li><a href="<$mt:NextLink$>" rel="next" onclick="return swapContent();">&raquo;</a></li>
</mt:IfMoreResults>
 
</ul>
</div>

出力例

当サイトよりダウンロードして頂いていたhtml5slidesプレゼンテーションテンプレートをGitHubに移動しました。

• Movable Type 6 無料 html5slidesプレゼンテーションテンプレート
• Movable Type 5 無料 html5slidesプレゼンテーションテンプレート

現在、それぞれのページの「ダウンロード」ボタンはGitHubのリポジトリにリンクしています。

• presentation_mt6
• presentation

よろしくお願いします。

Bootstrap v3.1.0がリリースされています。

これに伴い、以下のテーマのBootstrapをv3.0.3からv3.1.0にアップデートしました。

• Movable Type 6 ビジネス向けベーステーマ Bootstrap HTML5 2001
• Movable Type 6 ビジネス向けベーステーマ Bootstrap HTML5 2002
• Movable Type 6 ビジネス向けベーステーマ Bootstrap HTML5 2003
• Movable Type 6 ビジネス向けベーステーマ Bootstrap HTML5 2004

前回通りBootstrap CDNを利用、html5shiv.js・respond.min.jsもCDNに変更しています。

よろしくお願いします。

これまでアクセス解析には個人アカウントのGoogle AnalyticsとResearch Artisan Liteを使ってきた。

Movable Type 6からはダッシュボードやloupeでアクセス解析表示できるので、Google Analytics の連携 : Movable Type 6 ドキュメントを参考にGoogle Appsのドメインアカウントで設定した。

はじめの「ページ上部のナビゲージョンから [システム]、ウェブサイトあるいはブログ を選択する」をGoogle API Consoleで探しMovable Typeのダッシュボードと気づくまでに時間がかかったり、GoogleのUIが変わっているので少々迷う

サイトで利用しているMovable Typeの設定は簡単に終了したが、デモ用のテーマなど385個ものブログのトラッキングコード張替えは大変。2日がかりで完了。データは正しく取れている模様

Mavericksへのアップデートに伴いローカルの開発環境も入れ替えしたかったが途中でエラーが発生し、放置していた。休暇中にMovable Typeを動かす設定ができたので覚書

インストールの手順

Mac App StoreからXcodeをインストールする

Command Line Developer Toolsをインストール

xcode-select --install

MAMPのダウンロードとインストール

• MAMP: Mac, Apache, MySQL, PHP

MacPortsのダウンロードとインストール

• The MacPorts Project -- Home

MacPortsの初期化

echo 'export PATH=$PATH:/opt/local/bin:/opt/local/sbin/' >> ~/.bashrc
echo 'export MANPATH=$MANPATH:/opt/local/man' >> ~/.bashrc
echo 'source ~/.bashrc' >> ~/.bash_profile
sudo port -d selfupdate
sudo port -d sync

ImageMagickなどのインストール（＊ここ、1時間くらいかかります！）

sudo port install ImageMagick +perl

ImageMagickのインストールでエラー発生したがGDで代用するつもりで、そのまま次に

PerlのパスをMacPortsのインストールディレクトリへ変更

cd /usr/bin/
sudo mv perl perl.bak
sudo ln -s /opt/local/bin/perl /usr/bin/perl

DB関連モジュールのインストール

sudo port install p5-dbi
sudo port install p5-dbd-mysql
sudo port install p5-dbd-sqlite
sudo port install p5-dbd-sqlite2

オプションモジュールのインストール

sudo port install p5-gd
sudo port install p5-crypt-dsa
sudo port install p5-archive-zip
sudo port install p5-xml-atom
sudo port install p5-mail-sendmail

FTPクライアントを使って.htaccessを追加

Options +ExecCGI
AddType application/x-httpd-cgi .cgi .pl

Google Analytics のユーザープロファイルを設定すると、ダッシュボードの [サイト情報] にウェブサイト / ブログのアクセス統計グラフを表示する事ができます。

Google Analytics の連携

Google AnalyticsのUIが変わっていたので少し迷ったけれども、Google側で設定。Movable TypeでClient IDとClient secret を入力してみるとエラーが出たので「Authorized Redirect URIs」を正しく設定するとエラーが消えて設定完了。

バナーフッターモジュールに<$mt:StatsSnippet$>を追加。意外と簡単でした

当サイトで販売しているMT6テーマのバナーフッターモジュールには<$mt:StatsSnippet$>を記述していますので、上記設定を行い再構築すればすぐにデーターを取ることが出来ます。

Movable Type 6よりウェブサイトに記事を作成できるます。アットスタイルのテーマは、記事がある前提でテーマを作成しておりましたが、Movable Type 5からアップグレードされたサイトなどではウェブサイトに記事はありません。このような構成のサイトに利用できるサイトマップテンプレート（sitemap.mtml）を追加いたしました。

サイト構成によって選択利用してください。

FontAwesomev4.0.3がリリースされています。

これに伴い、Movable Type テーマのFontAwesomeをv4.0.1からv4.0.3にアップデートしました。

アップデートしたテーマは以下のとおりです。

• Movable Type 6用テーマ211以降
• Movable Type 5用テーマ105以降

よろしくお願いします。

本日、Movable Type 6 テーマ（テンプレート） Bootstrap HTML5をバージョン1.0より、バージョン1.1にアップデートいたしました。 主にパンくずやフォルダの部分ですが、変更した内容は以下のとおりです。

ウェブサイト

• ウェブページのパンくずリストにフォルダを表示可能に
• サイドバーのウェブページリストを階層表示可能に
• サイドバーのカテゴリリストを一階層下げる
• サイトマップのウェブページリストを階層表示可能に
• 記事の投稿者情報（メタ）部分のマークアップ修正

ブログ

• ウェブページのパンくずリストにフォルダを表示可能に
• 記事の投稿者情報（メタ）部分のマークアップ修正

デモサイトは既にバージョンアップしたものに変更しています。

MTCafe Fukuoka 2013 Winter ～Movable Typeの"今"と"可能性"を知るセミナー～無事終了しました。たくさん方のご参加ありがとうございました！

私も少しだけお話させていただきました。当日のスライドは公開しています。

SYNCK GRAPHICAさんの【メールフォームCGI Jcode版】を利用してBootatrapテーマ用メールフォームの実装テストを行っています。

Movable Type 5までのテーマでは、5年ほど前のメールフォームCGIを使用していましたが、今回より現行のメールフォームに変更の予定で、すでにお問い合わせ部分のマークアップは完了しました。

ビジネス向けテーマにご期待ください。

MTCafe Fukuoka 2013 Winter ～Movable Typeの"今"と"可能性"を知るセミナー～ の定員30名がまもなく一杯となりそうです。

私も登壇させていただくかもしれません。

お申し込みは Zusaar で！

懇親会は別途Zusaarで参加表明お願いします。

レスポンシブデザインで利用出来るスライダーFlexSlider 2を使って、Movable Type 6のアイテムでカルーセルを作る。以下、覚書

FlexSlider 2から一式をダウンロード

zipを解凍

今回はベーシックなカルーセル「Basic Carousel」を使用する。どれも基本的にはulでマークアップしてJavascriptとCSSを読み込ませるとOK

Movable Type 6での利用が前提なので、ちょっとゴニョゴニョ

fontsフォルダはルートにアップロード

CSSの出力先変更を可能にするため、flexslider.cssを以下のように変更

修正前26行目

@font-face {
    font-family: 'flexslider-icon';
    src:url('fonts/flexslider-icon.eot');
    src:url('fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'),
        url('fonts/flexslider-icon.woff') format('woff'),
        url('fonts/flexslider-icon.ttf') format('truetype'),
        url('fonts/flexslider-icon.svg#flexslider-icon') format('svg');
    font-weight: normal;
    font-style: normal;
}

修正後26行目

@font-face {
    font-family: 'flexslider-icon';
    src:url('<$mt:WebsiteURL$>fonts/flexslider-icon.eot');
    src:url('<$mt:WebsiteURL$>fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'),
        url('<$mt:WebsiteURL$>fonts/flexslider-icon.woff') format('woff'),
        url('<$mt:WebsiteURL$>fonts/flexslider-icon.ttf') format('truetype'),
        url('<$mt:WebsiteURL$>fonts/flexslider-icon.svg#flexslider-icon') format('svg');
    font-weight: normal;
    font-style: normal;
}

インデックステンプレートにflexslider_cssとして作成する

同様に、インデックステンプレートにjquery.flexslider-min.jsをjquery_flexslider_min_jsとして作成する

ウェブサイトのメインページに追加記述する

CSSへのリンク

<link rel="stylesheet" href="<$mt:Link template="flexslider_css"$>">

画像リスト

<div class="flexslider carousel">
<ul class="slides">
<$mt:Setvar name="counter" value="0"$>
<mt:Entries lastn="0" include_blogs="children" include_with_website="1">
<mt:EntryAssets type="image" lastn="1">
<$mt:Setvar name="counter" op="++"$>
<mt:SetVarBlock name="EntDate"><$mt:EntryDate format_name="iso8601"$></mt:SetVarBlock>
<mt:SetVarBlock name="EntryLink[$counter]"><$mt:EntryPermalink$></mt:SetVarBlock>
<mt:SetVarBlock name="ImageCode[$counter]"><img src="<$mt:AssetThumbnailURL height="200" square="1"$>" alt="<$mt:EntryTitle$>" title="「<$mt:EntryTitle$>」on「<$mt:BlogName$>」" width="200" height="200"></mt:SetVarBlock>
</mt:EntryAssets>
<mt:SetHashVar name="Compare"><mt:SetVarBlock name="$EntDate"><a href="<mt:GetVar name="EntryLink[$counter]">"><mt:GetVar name="ImageCode[$counter]"></a></mt:SetVarBlock></mt:SetHashVar>
</mt:Entries>
<mt:Setvar name="CountB" value="0"><mt:If name="counter" ge="1">
<mt:Loop name="Compare" sort_by="key reverse"><mt:If name="CountB" lt="10"><mt:Setvar name="CountB" op="++">
<li><mt:GetVar name="__value__"></li></mt:If>
</mt:Loop>
</ul>
</mt:If>
</div>

Javascript

<script src="<$mt:Link template="jquery_flexslider_min_js"$>"></script>
<script>
$(window).load(function() {
  $('.flexslider').flexslider({
    animation: "slide",
    animationLoop: false,
    itemWidth: 210,
    itemMargin: 5
  });
});
</script>

完成

注意

• 200pxのため、変更する場合は200の箇所を書き換える
• itemWidth: 210,は200+5+5

2013年10月にメジャーバージョンアップしたばかりのMovable Type 6の最新情報、そしてMTとECサイト、そのブランティング、MTの活用事例などの講演を行います。

30名と少数での開催なのでお早めに！

お申し込みは Zusaar で！

先日、v3.0.1へアップデートしたばかりですが、Bootstrap v3.0.2がリリースされています。

これに伴い、以下のテーマのBootstrapをv3.0.1からv3.0.2にアップデートしました。

Movable Type 6 テーマ（テンプレート） Bootstrap HTML5

• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 205
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 206
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 211
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 212
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 213
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 214
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 215
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 216
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 217
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 218

Movable Type 5（MTOS 5）テーマ（テンプレート） Bootstrap HTML5

• Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 101
• Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 102
• Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 103
• Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 104

よろしくお願いします。

Bootstrap v3.0.1がリリースされています。

これに伴い、以下のテーマのBootstrapをv3.0.0からv3.0.1にアップデートしました。

Movable Type 6 テーマ（テンプレート） Bootstrap HTML5

• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 205
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 206
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 211
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 212
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 213
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 214

Movable Type 5（MTOS 5）テーマ（テンプレート） Bootstrap HTML5

• Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 101
• Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 102
• Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 103
• Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 104

よろしくお願いします。

先日、Font AwesomeのVersion 4.0.1がリリースされました。

これに伴いMovable Type 6 テーマ（テンプレート） Bootstrap HTML5 205・Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 206のテーマをFont Awesome Version 4.0.1に対応させて、別のテーマとしてリリースしました。

• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 211
• Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 212

211以降はFont Awesome 4.0.1になりますので、よろしくお願いします。

Bootstrapを利用したテーマ「スマートフォン・タブレット対応 Movable Type 6 テーマ（テンプレート） Bootstrap HTML5 205」をリリースしました。

前回の206と順序が逆のリリースとなりましたが、今後201までさかのぼりたいと思っています。

よろしくお願いします。

Movable Type 6 + Bootstrap 3 + FontAwesome でリニューアルした「はやさかクリニック」 のサイトが公開されました。

Movable Type 3 の頃からのお付き合いいただいており、Webにも詳しいオーナ様がレスポンシブWebデザインを希望されました。

Bootstrapを利用したテーマ「Movable Type 6 テーマ（テンプレート） Bootstrap」の販売を開始いたしました。

よろしくお願いします。

Movable Type 6 をリリース　―日米で出荷開始―

2013年10月16日（現地時間）、米ニューヨークで開かれた Movable Type Idea Exchange にて、Movable Type 6 の出荷開始を発表し、正式リリースの運びとなりました。日本でも、本日より出荷を開始しています。

Movable Type 6 をリリース　―日米で出荷開始― | Movable Type

シックス・アパートから「Movable Type 6」 が正式リリースされました。

このバージョンからMTOS（Movable Type Open Source）が廃止され、ライセンス体系も変わっています。新たに「Movable Type 開発者」ライセンスも設けられています。

Movable Type 6.0 RC1用 Bootstrap 2.3テーマを少しいじって、Movable Type 6.0 RC2用 Bootstrap 3のテーマが完成しました。

Movable Type 6.0 RC2用のため、公開・配布はいたしません。Movable Type 6.0 公開後にリリースの予定です。

Get Restarted with "Movable Type"！

MTDDC Meetup HOKKAIDO 2013は、北海道内で活躍するMovable Typeを活用した開発者やWebデザイナー、あるいはWebサイト制作会社などと、Movable Typeに興味関心はあるが触れたことのない開発者やWebデザイナー、IT/Webに関連する企業や一般企業Web担当者の結びつきを強め、新たな情報交換や交流の場を提供することに加え、北海道の地からMovable Typeの特徴を活かしたIT/Web施策を発信していきたいというコンセプトのもと開催されます。

北海道の有志によるMTDDC Meetup HOKKAIDO 2013。申込み期限が2013年9月30日 12:30となっているようです。

参加申込はPeaTixにて

日程

2013年10月5日(土) 12:30～18:30

場所

北農健保会館
札幌市中央区北4条西7丁目1−4

参加費

一般：1,000円・学生：500円

定員

100名

懇親会

19:00～21:00（参加費4,000円）

翌日にはハッカソンも！

MT:Fukuokaも協賛しています。

Movable Type 6 ではウェブサイトに記事を書けるようになったので、ひょっとしたらMT4.2用のテンプレートセットプラグインがそのまま利用できるのではないかと思い試してみた。

pluginsデレクトリへ販売中のテンプレートセット736をアップロード。（ローカルでのテストのためhtdocs内のmt/pluginsフォルダ）

ウェブサイトのテーマ一覧に表示されるので「適用」ボタンをクリックし、再構築する

ウェブサイトを見てみる

ここまで上手く行ったので実際に記事をインポートしてみたがエラー発生。モジュール「ブログ記事の概要」が無い。「記事の概要」となっているモジュールの名前を変更する。

「記事の概要」モジュールの名前の前に「ブログ」を追加して「ブログ記事の概要」にする。

再構築して完成！

この方法は、新たに追加されたMT6の機能を使わないことになりますので、オススメはしません。

Bootstrap 3.0ではinput要素・select要素・textarea要素の幅が、標準で100%になった。

Requires custom widths

Inputs, selects, and textareas are 100% wide by default in Bootstrap. To use the inline form, you'll have to set a width on the form controls used within.

コメントキャプチャでレイアウトが崩れてしまったので、CSSを以下のように変更

#comments-open-captcha {
    margin-top: 20px;
}
.captcha .label, .captcha img {
    display: block;
    float: left;
    margin-right: 10px;
}
.captcha .label {
    width: 80px;
    min-height: 1.2em;
    background-color: rgba(0, 0, 0, 0);
    color: #333333;
    text-align: left;
    text-shadow: none;
}
.field {
    float: left;
}
#captcha_code {
    clear: both;
    margin-top: 10px;
    margin-bottom: 10px;
}
.captcha p {
    clear: both;
}

今回リリースの「Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 101」「Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap HTML5 102」より、以下の2点を変更しております。

• Bootstrapをバージョンアップして3.0.0に
• ブログ記事のアーカイブマッピングをカテゴリ配下に

ブログ記事のアーカイブマッピングについて

カテゴリ配下のエントリーベースネームディレクトリのインデックス

category/sub-category/entry-basename/index拡張子

となって一層使いやすくなりました。

もちろん、テーマインストール時に自由に変更していただくことも可能です。

Bootstrap 3.0 にアップグレードした、スマートフォン・タブレット対応テーマ「Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap 101」をリリースしました。

もちろん、Font Awesome・google-code-prettifyも実装済です。

よろしくお願いします。

Movable Type　6.0 RC1がリリースされたのでBootstrap 06をベースにテーマを作成してみた。

Movable Type 6.0 RC1用のため、公開・配布はいたしません。Bootstrap 3 へのアップグレードなどを行い、Movable Type 6.0 公開後にリリースの予定です。

以下のページを参考に、現在のPin It buttonのコードに対応したものを書いてみた

Pinterest Image URL - Movable Type Forums

ボタンの掲載はブログ記事だけ、最後にアップロードした画像をPinしてもらうことにした。

標準で提供されるコード

<a href="//pinterest.com/pin/create/button/?url=「掲載ページのURL」&media=「画像のURL」&description=「概要」" data-pin-do="buttonPin" data-pin-config="none"><img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" /></a>

Movable Typeのテンプレートタグで記述

<a href="http://pinterest.com/pin/create/button/?url=<mt:EntryPermalink>&amp;media=<mt:EntryAssets lastn="1" type="image"><mt:AssetURL encode_url="1"></mt:EntryAssets>&amp;description=<$mt:EntryTitle encode_html="1" strip="%20"$>" data-pin-do="buttonPin" data-pin-config="none"><img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" alt="Pin it"></a>

9月15日追記：ブログ記事の概要からブログ記事のタイトルに変更しました。

GENE BERG JAPANさんのサイトにも付けたので、Boardを作ってみた

予てからリニューアル作業を行っておりましたGENE BERG JAPANを本日公開いたしました

Bootstrap + FontAwesome + Movable Type Open Source を利用して短期間で制作いたしました。

VW乗りの間では知らない人はいないアメリカ・カリフォルニア州のオレンジカウンティにあるGENE BERGのパーツや空冷VWを専門に扱うマニアックな自動車専門店です。

Facebookページも公開しておりますので、何卒よろしくお願いします。

本日から少しずつmtde.infoの変数系解説をCode@Styleでご紹介いたします。

以下の様にまだたくさんの有用な情報がありますので、出来る限り掲載するつもりです。

よろしくお願いします。

2014年1月23日追記：Code@Styleは閉鎖いたしました。ありがとうございました。

サイトをMTOSで構築することになった。

サイトオーナー自身で更新作業になるため、なるべく簡単に出来るようAnotherCustomFieldsプラグインを使おうかとも思ったけれども、MT標準の「定型文」を使うことにした。

リッチテキストエディタにはオリジナルのスタイルシートを適用できるので、以下のようにリッチテキスト用のrich-text.cssを設定。

読み込ませるスタイルシートは1つしか設定できないので、Bootstrapなどを利用する場合にやりにくい。そこでrich-text.cssに@importでbootstrap.min.cssとカスタマイズ用のcustom.cssの2つを読みこませる。

@import url("<$mt:Link template="bootstrap_min_css"$>");
@import url("<$mt:Link template="custom_css"$>");

スタイルを変えたい場合には、カスタマイズ用のスタイルシート本体だけを弄ればOK！

半年前のお話ですが、MTDDC Meetup KYUSHU 2013でライトニングトークに参加しました。

またまた見事に失敗したのですが、その時に「MT5で作るスライドについて」のスライドを作成しています。 ブログでも積極的にお知らせしておりませんでしたので、ご覧に合った方は少ないと思いまして、改めて公開URLをお知らせします。

スライドで使用したテンプレートは無料配布しております。

• Movable Type 5 無料 html5slidesプレゼンテーションテンプレート

よろしくお願いします。

通常、会社案内や企業サイトの構築の際には装備することはあまりありませんが、テーマとしてリリースする場合にはコメントやトラックバックは必須です。

ところが、Bootstrapで作ったコメントフォームにMovable Typeのコメントキャプチャをそのまま入れてしまうとレイアウトがおかしくなってしまいます。

覚書（Code@Style）に掲載していますが、こちらでも紹介します

以下、Bootstrap 2.3での解説です。Bootstrap 3.0.0では利用できません。「Bootstrap 3.0でのMovable Typeのコメントキャプチャ」にて別途解説しています。

一般的にブログでは横並びのフォームを利用しますのでBootstrapコンポーネントを使用した場合はform-horizontalを用い、以下の様なマークアップになります。

<form class="form-horizontal">
<div class="control-group">
<label class="control-label">ラベル</label>
<div class="controls">
<input type="text" class="span3" placeholder="入力欄">
</div>
</div>
<div class="control-group">
<div class="controls">
<label class="checkbox">
<input type="checkbox">チェックボックス
</label>
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn">Submit</button>
</div>
</form>

フォーム内に

<div id="comments-open-captcha"></div>

と記述するとキャプチャが表示されますが、このままじゃスタイルをあてにくいので、<div class="captcha"></div>で囲います。

<div class="captcha">
<div id="comments-open-captcha"></div>
</div>

コメントフォーム全体のコードは以下の通りです。

<form class="well form-horizontal" method="post" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">
<input type="hidden" name="static" value="1">
<input type="hidden" name="entry_id" value="<$mt:EntryID$>">
<input type="hidden" name="__lang" value="<$mt:BlogLanguage$>">
<input type="hidden" name="parent_id" value="<$mt:CommentParentID$>" id="comment-parent-id">
<input type="hidden" name="armor" value="1">
<input type="hidden" name="preview" value="">
<input type="hidden" name="sid" value="">
<div id="comments-open-data">
<div id="comment-form-name" class="control-group">
<label for="comment-author" class="control-label">名前</label>
<div class="controls">
<input type="text" class="span3" id="comment-author" name="author" size="30" tabindex="1" accesskey="n" value="" onfocus="mtCommentFormOnFocus()" placeholder="お名前">
</div>
</div>
<div id="comment-form-email" class="control-group">
<label for="comment-email" class="control-label">電子メール</label>
<div class="controls">
<input type="email" class="span4" id="comment-email" name="email" size="30" tabindex="2" accesskey="m" value="" onfocus="mtCommentFormOnFocus()" placeholder="電子メールアドレス">
</div>
</div>
<div id="comment-form-url" class="control-group">
<label for="comment-url" class="control-label">URL</label>
<div class="controls">
<input type="url" class="span4" id="comment-url" name="url" size="30" tabindex="3" accesskey="u" value="" onfocus="mtCommentFormOnFocus()" placeholder="ウェブサイトのURL">
</div>
</div>
<div id="comment-form-remember-me" class="control-group">
<label for="comment-bake-cookie" class="control-label">ログイン情報を記憶</label>
<div class="controls">
<input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="mtRememberMeOnClick(this)" onkeypress="mtRememberMeOnClick(this)" value="1" tabindex="4" accesskey="r">
</div>
</div>
</div>
<div id="comment-form-reply" style="display:none" class="control-group">
<label for="comment-reply" id="comment-reply-label" class="control-label"></label>
<div class="controls">
<input type="checkbox" id="comment-reply" name="comment_reply" value="" onclick="mtSetCommentParentID()" onkeypress="mtSetCommentParentID()" tabindex="5" accesskey="c">
</div>
</div>
<div id="comments-open-text" class="control-group">
<label for="comment-text" class="control-label">コメント
<mt:IfAllowCommentHTML>(スタイル用のHTMLタグを使えます)</mt:IfAllowCommentHTML></label>
<div class="controls">
<textarea id="comment-text" class="span4" name="text" rows="8" cols="50" onfocus="mtCommentFormOnFocus()" tabindex="6" accesskey="t" placeholder="コメントをどうぞ！"></textarea>
</div>
</div>
<div class="captcha">
<div id="comments-open-captcha"></div>
</div>
<div id="comments-open-footer" class="form-actions">
<input type="submit" class="btn" name="preview_button" id="comment-preview" value="確認" onclick="this.form.preview.value='1';" onkeypress="this.form.preview.value='1';" tabindex="7" accesskey="v">
<input type="submit" class="btn" name="post" id="comment-submit" value="投稿" tabindex="8" accesskey="s">
</div>
</form>

あとはCSSで調整。（これが非常に難しかった...）

.captcha .label {
    min-height: 1.2em;
    width: 160px;
    background-color: transparent;
    color: #333333;
    text-align: right;
    text-shadow: none;
}
.captcha .label , .captcha img {
    display: block;
    float:left;
    margin-right: 10px;
}
.field {
    float:left;
}
#captcha_code {
    clear: both;
    margin-top: 10px;
    margin-bottom: 10px;
}
.captcha p {
    clear: both;
}

図のようにコメントキャプチャも行儀よく横並びに表示が可能です。

デザインをリニューアル後、ブログ記事570件程度で再構築時間1分をきることができなかったので、環境変数EntriesPerRebuildの値を大きくしてみた。

以下のように、再構築時間が59秒になった。

Bootstrapを採用したために、htmlのdivが複雑になっているので致し方ないのだが、どうしてもリニューアル前よりも短時間で再構築したい。

思い立ってシステムテンプレート以外の 「PHPのインクルードとして処理する」としていたウェブサイトのモジュールを全てウェブサイトのインデックステンプレートに各々作り替え、mt:Include部分全てを<?php include ~ に変更してみた。

もちろん、システムテンプレートはモジュールを読み込ませず、モジュール部分は追加しました。

変更したのは以下の部分

• HTMLヘッダーの一部
• バナーヘッダー
• フッターのリンク
• バナーフッター
• アクセス解析

例えばこんな感じ

<mt:BlogParentWebsite>
<$mt:include module="バナーヘッダー" blog_id="$website_id"$>
</mt:BlogParentWebsite>

を

<?php include($_SERVER['DOCUMENT_ROOT']."/include/banner_header.php");?>

すると再構築時間が38秒になった！

今日もう一度やってみた。

かなり楽になりました！

タイトルの通り、MacのローカルにMovable Type 6.0 ベータ 1 をインストールしてみた。

キャプチャを撮りましたので掲載します。

おなじみの「Movable Typeへようこそ」。今までと変わりなく進みます。

システムチェック

データベースの設定

データベースの設定完了

メールの設定

構成ファイルの設定完了

アカウントの作成

最初のウェブサイトの作成。Rainier 1.1が選択されています。

インストール完了

ユーザーダッシュボード

ウェブサイトに記事を書いてみる

ウェブサイト

ウェブサイトの記事

以上です。

少しずつ弄ってみます！

Movable Type 6 では、新しいAPIを通じて、さまざまな言語による機能実装やデータ操作が可能となります。APIを実際に利用したユーザーモードアプリ「Loupe」では、スマートフォンからMovable Typeの各種操作がスピーディに行えます。

また、ウェブサイトの機能を見なおし、ブログ用の記事を記述できるようになりました。Movable Type 5の特徴である「構造的なウェブサイト管理」はもちろん、シンプルなブログも最短ステップで作成可能となります。

Movable Type 6 ベータテストを開始します

ウェブサイトとブログに分離したことで非常にわかりづらくなっていたこともありますので、大変嬉しい機能追加となっています。

ロゴもスッキリとした物に変わっていますね。

また、GPL での提供は終了しますが、Movable Type 自体は Perl で作られていることもあって、これまで通りソースコードはいつでもどなたでも閲覧可能です。GitHub による開発版の公開も継続して行います。商用版、もしくは個人無償版のライセンスを保有する必要がありますが、GitHub のレポジトリはそのまま使っていただけますし、フィードバックも受けつけます。Six Apart は引き続き Movable Type の成長のための投資を続けます。これからもオープンな体制で開発を続け、今後も皆様からのご支援をいただき、よりよいプロダクトに成長していきたいと思います。

Movable Type 6 の新しいライセンスについて

それでは今からMacのローカルに beta 1 のインストールを行なってみます。

Font AwesomeのCSSを利用する際に、font-awesome.min.cssは Movable Type 5のダッシュボードにペーストしないこと。

bootstrap.min.cssと同様に、必ずテーマ内にfont-awesome.min.cssを作成し初期化する。

あるいは、Movable Type の外で管理し、FTPなどを行う。

Bootstrapを利用したスマートフォン・タブレット対応の新しいテーマ「Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap 07」「Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap 08」をリリースしました。

ウェブサイト名をナビゲーションバー上部に移動し長いウェブサイト名が表示可能になりました。また、全幅のフッター採用しています。

よろしくお願いします。

Bootstrap標準のカルーセル（画像スライド）を実装したスマートフォン・タブレット対応テーマ Movable Type 5（MTOS 5）テーマ（テンプレート）Bootstrapをリリースしました。

カルーセル部分のキャプションはウェブページにて管理。テーマのインストール時に自動的に作成されます。簡単に編集できます。

よろしくお願いします。

Bootstrapを利用したスマートフォン・タブレット対応テーマの リキッドデザイン Movable Type 5（MTOS 5）テーマ（テンプレート）Bootstrapをリリースしました。

よろしくお願いします。

巷で話題（？）のPocket 。

アプリケーションはインストールしたり、アンインストールしたりで、あまり使っていなかったのですが、このブログの「ブログ記事」にPocket ボタンを追加してみました。

ボタン作成は以下のページにアクセス。

Pocket for Publishers: Pocket Button

今回は真中のボタンを選択して「ブログ記事」にペースト

<a data-pocket-label="pocket" data-pocket-count="horizontal" class="pocket-btn" data-lang="en"></a>
<script type="text/javascript">!function(d,i){if(!d.getElementById(i)){var j=d.createElement("script");j.id=i;j.src="https://widgets.getpocket.com/v1/j/btn.js?v=1";var w=d.getElementById(i);d.body.appendChild(j);}}(document,"pocket-btn-js");</script>

まあ、あとで読むほどの記事は書いていませんが...

Bootstrapを利用したスマートフォン・タブレット対応テーマ「Movable Type 5（MTOS 5）テーマ（テンプレート） Bootstrap」の第2段、「Movable Type 5（MTOS 5） テーマ（テンプレート） Bootstrap 02」をリリースしました。

Bootstrapのスタイルを変更できるBootswatchのCosmoをベースにカスタマイズし、少し明るめのボタンにしています。

よろしくお願いします。

予てから作成しておりましたBootstrapを利用したテーマ「Movable Type 5（MTOS 5）テーマ（テンプレート） Bootstrap」の販売を開始いたしました。

1万円と低価格で販売いたします。個人のブログやスタッフブログ・カスタマイズのベースとしてもお気軽にご利用いただけます

もちろん、Font Awesome・google-code-prettifyも実装済。BootswatchのCSSを導入も簡単です。

よろしくお願いします。

先日よりデモ公開をしている「Bootstrap Movable Type 5テーマ」をbit partさんに試用していただいています。

Bootstrap Movable Type 5テーマはウェブサイトと配下のブログで構成されていますが、bit partさんの都合によりブログ用のテーマに編集して利用されています。

現在リリース準備中のBootstrap Movable Type 5テーマは、使用いただいている状態から、さらに手を入れて、8:4のグリッド構成となり、バナーヘッダー・バナーフッターの2箇所を編集するだけでグリッド構造を変更できるように修正を行なっています。

ご期待ください。

5月11日追記：ウェブサイト・ブログの構成にて適用して頂きました。ありがとうございました。

BootswatchのCSSを利用する際に、bootstrap.min.cssをダウンロードした場合はMovable Type 5のダッシュボードにペーストしないこと。

必ず、テーマ内にbootstrap.min.cssを作成し初期化する。

あるいは、Movable Type の外で管理し、FTPなどを行う。

販売または配布用のBootstrapを使ったMovable Type 5 テーマを開発中です。

何とか形になり詳細部分のアップデートを続けていますが、現状でデモサイトを公開いたします。

Bootstrap・Font Awesome・google-code-prettifyのライセンスを調査中。今しばらくお待ち下さい。

Movable Typeのテンプレートタグにregex_replaceモディファイアをつけると正規表現で色々置換することができます。

空白行を詰める

<mt:Unless regex_replace="/\s*\n+/g","\n">
</mt:Unless>

日付の空白文字を詰める

<$mt:EntryDate format="%Y年%B月%e日" regex_replace="/\s/",""$>

空要素の /を削除する

<$mt:EntryBody replace="<br />","<br>" regex_replace="/<img([^>]+) \/>/g","<img$1>"$>

他にも色々と使えます。お楽しみください...

本日、HTML5テーマの投稿日付に使用しているtime要素のpubdate属性を削除しました。

• Movable Type 5 無料テーマ HTML5
• Movable Type 5（MTOS 5）テーマ（テンプレート） HTML5

pubdate属性は2011年11月29日に削除されていますが、テーマを修正できず、本日となってしまいました。

「HTMLエディタに登録しているドキュメントテンプレート」でも書いているようにエディタはSEEditを利用していましたが、日本語入力時に動作が遅いのでエディタを変更しようと思って、Espressoのライセンス購入するところでした。

ところが、

Movable Type と PowerCMS のテンプレートタグの入力補完を提供する Sublime Text 2 用のパッケージ、「MTML Completions」と「PowerMTML Completions」公開しました。

Movable Type と PowerCMS のテンプレートタグを補完する Sublime Text 2 のパッケージを公開しました

Sublime Text 2はお試し中だったので、即「MTML Completions」と「PowerMTML Completions」パッケージをインストールしてみた。

「:」を入力しないで、タグ名を頭から入力すると、快適に候補がリストアップされます！

Sublime Text 2とMovable Typeを使っている方には、激しくオススメです。

アドベントカレンダーは本来、クリスマスまでの日数を数えるカレンダーですが、今回、2013年1月26日（土）に開催される「MTDDC Meetup KYUSHU 2013」までのカウントダウンを刻んで行こう！という事で、このアドベントカレンダーブログを開始する事となりました。 実行委員会スタッフ持ち寄りで、Movable Type との出会いやTipsを紹介していきたいと思います。

MTDDC Meetup KYUSHU 2013 アドベントカレンダー開始！

案内だけではなく役に立つTipsを期待します...

先日よりこのブログでお知らせしておりました、Movable Type 5のウェブサイトでプレゼンテーションする「Movable Type 5 無料 html5slidesプレゼンテーションテンプレート」をリリースいたしました。

ウェブサイト下に作成したブログの「ブログ記事」毎にスライド1ページを作成します。プレゼンテーションのURLはウェブサイトのURLとなります。

html5slides は Apache License 2.0 でライセンスされています。slides.js には一切手を入れていませんが、このテンプレートは同様の Apache License 2.0 ライセンスで配布します。 修正後の再配布などの場合には、その旨を追加記述してください。

ダウンロードページへ

Movable Type 5 無料 html5slidesプレゼンテーションテンプレート

html5slidesを使ってMovable Type 5.2のウェブサイトでプレゼンテーションが出来るテンプレートを作成中です。

ウェブサイトのメインページテンプレート（main_index.mtml）とロゴ画像2枚で実装します。

html5slidesの動作は、ほぼ再現できていると思います。

追記：1月4日公開しました。「Movable Type 5 無料 html5slidesプレゼンテーションテンプレート」

MTDDC Meetup KYUSHU 2013は、もっと九州で、全国で、Movable Typeを使って欲しい！広げていきたい！という想いの元に開催されます。

MTDDC Meetup KYUSHU 2013 公式サイト

MTDDC（Movable Type Developers & Designers Conference）とは、Movable Type ユーザーを対象とするカンファレンスです。

これまでに、大阪、東京、札幌で開催されたこのイベントはシックス・アパート株式会社が主催し、Movable Typeの最新情報を始め、Movable Typeのプラグイン開発、テンプレートカスタマイズなど、Movable Typeユーザーにとって最新の情報に触れられる、大人気のカンファレンスとなっています。

MTDDC Meetup KYUSHU 2013 公式サイト

気になるスピーカーは

関信浩

シックス・アパート株式会社　代表取締役

関田文雄

日本マイクロソフト株式会社 エバンジェリスト

野田純生

アルファサード株式会社　代表取締役

藤本壱

フリーライター

宮永邦彦

アイデアマンズ株式会社　代表取締役社長

私も非常に楽しみにしています。九州の方は是非ご参加を！

以前からOGPを設置しようと思っていたが、やっと手を付けた。

以下覚書

<html lang="ja" prefix="og: http://ogp.me/ns# fb: http://www.facebook.com/2008/fbml">

Movable Typeならばこんな感じ

<html lang="<$mt:BlogLanguage$>" prefix="og: http://ogp.me/ns# fb: http://www.facebook.com/2008/fbml">

10月8日は、Movable Typeの誕生日です! 今を去ること11年前、2001年の10月8日にMovable Typeのバージョン1.0が初めてリリースされました。それ以来、Movable Typeは皆さんのブログやウェブサイトに使っていただきながら、進化を続けてきました。これも、日頃から皆様にご利用をいただき、さまざまな助言、励まし、厳しいご意見をフィードバックとしていただくからこそ、今も進化を続けることができているのだと考えています。本当にありがとうございます!

Movable Typeは11周年を迎えました

私が初めてブログというものに触れたのが2003年の12月、そう@niftyの「ココログ」。
コミニュケーションとしても、また、いじってても面白い。そこからエスカレートして翌2004年4月にはMT2.65をダウンロード、結局XREAにMT2.661をインストールして弄っていた。

モダシンさんや平田さん・関根さんのサイトから必死で情報を集めた。

あれから8年か...

とにかく、Movable Type 11周年、おめでとうございます。

Movable Type 5.2を、本日より正式に出荷開始します。すでに「Movable Type 5」のライセンスをお持ちの方は、本日より無償で「Movable Type 5.2」にアップグレードいただけます。

Movable Type 5.2 は、柔軟なシステム設計を可能にするクラウド・コンピューティング環境への対応を強化し、クラウドの利点を最大限に利用できるようになりました。また、リッチテキストエディタを全面的に変更。入力・編集しやすいエディタ環境により、ブログやウェブサイトの更新がさらに快適になりました。

Movable Type 5.2 を本日より正式出荷

主な新機能、機能改善

• nginx+PSGIによる運用対応
• 新しいリッチテキストエディタ
• サイトパス制限
• SMTP認証に対応
• カスタムフィールドおよび再構築のパフォーマンス改善

Movable Type のクラウド版 「Movable Type EZ」もリリースされています。

結局のところ、使用しているのはMT3の頃に購入したMTPaginateだけで、その他は全て標準のプラグイン。

プラグイン入れなくとも、とりあえずは何とかなります。

ちょっと遅くなりましたが、Mountain Lionインストールに伴い、ローカルの開発環境も入れ替えました。

以下、覚書

インストールの手順（覚書）

Mac App StoreからXcodeをインストールする

下図のようにXcodeにCommand Line Toolsをインストールする

MAMPのダウンロードとインストール

• MAMP: Mac, Apache, MySQL, PHP

MacPortsのダウンロードとインストール

• The MacPorts Project -- Home

MacPortsの初期化

echo 'export PATH=$PATH:/opt/local/bin:/opt/local/sbin/' >> ~/.bashrc
echo 'export MANPATH=$MANPATH:/opt/local/man' >> ~/.bashrc
echo 'source ~/.bashrc' >> ~/.bash_profile
sudo port -d selfupdate
sudo port -d sync

ImageMagickなどのインストール（＊ここ、1時間くらいかかります！）

sudo port install ImageMagick +perl

PerlのパスをMacPortsのインストールディレクトリへ変更

cd /usr/bin/
sudo mv perl perl.bak
sudo ln -s /opt/local/bin/perl /usr/bin/perl

DB関連モジュールのインストール

sudo port install p5-dbi
sudo port install p5-dbd-mysql
sudo port install p5-dbd-sqlite
sudo port install p5-dbd-sqlite2

オプションモジュールのインストール

sudo port install p5-gd
sudo port install p5-crypt-dsa
sudo port install p5-archive-zip
sudo port install p5-xml-atom
sudo port install p5-mail-sendmail

FTPクライアントを使って.htaccessを追加

Options +ExecCGI
AddType application/x-httpd-cgi .cgi .pl

リッチテキストエディタが使いやすくなるらしい

• Movable Type 5.2 で新しくなるリッチテキストエディタ
• Movable Type 5.2 のテキストエディタ機能を一足早くご紹介！

いつも「フォーマット：なし」にしてるので新しくなったとはいえ、使わないと思いますが、ちょっと気になったのでgithubからダウンロード。MAMPにインストールしてみた。

クールです...

MTCafe Fukuoka

Movable Typeユーザーのオフ会、「MTCafe」。
名古屋、東京に続いて、福岡で初開催！

「MT Cafe」は、「だれでも」、「気軽に」、「楽しく」、Movable Typeに触れることのできる場所です。情報交換をしながら、参加者同士でホーム ページやプラグイン作成の情報交換をしましょう！

去年11月のセミナーで「福岡でもMTDDCとかやりたいですね」と言っていたのですが、MTCafe Fukuokaという形で実現したようです。

日時

2012年7月7日(土) 14:00開場、14:30開始 16:30頃終了予定
途中入場、退場可。

開催場所

アクロス福岡　701会議室(福岡市中央区天神1丁目1番1号)

参加費

無料

定員

15人(先着順)

福岡や近県の方、いかがですか

MT5公開前にyoshiさんに書いていただいて、yoshiさんご自身のブログに掲載されていたものですが、残念ながらmtde.info同様ブログも閉鎖されましたので、Code@Styleでご紹介いたします。

2014年1月23日追記：Code@Styleは閉鎖いたしました。ありがとうございました。

福岡で半年ぶりにMovable Typeのセミナーが開かれます。

【福岡開催】Movable Typeの最新情報とCMS/ECソリューション紹介セミナー

概要

開催日時

2012年7月 6日（金）14:00～17:30(13:30受付開始)

セミナー名

【福岡開催】Movable Typeの最新情報とCMS/ECソリューション紹介セミナー

場所

天神クリスタルビル 3F Aホール

住所

福岡市中央区天神4-6-7

参加費

無料

対象

企業ユーザー、制作会社、開発会社

定員

100名

主催

アルファサード有限会社、アイデアマンズ株式会社、株式会社ネットコンシェルジェ、シックス・アパート株式会社

共催

有限会社ランカードコム

スケジュール

1. Movable Type 5 最新情報

   シックス・アパート株式会社
   Movable Typeプロダクトマネージャー
   長内　毅志

2. 講演タイトル未定

   アルファサード有限会社
   代表取締役
   野田　純生

3. スマートフォン向けウェブサイトの最新事情とMovable Typeによるマルチデバイス対応

   アイデアマンズ株式会社
   代表取締役社長
   宮永　邦彦

4. これからのeコマースに求められるものは？　MTコマースで作る新しいECサイト構築アプローチ

   株式会社ネットコンシェルジェ
   代表取締役
   尼口　友厚

その翌日（7日）はMTCafeです！

福岡・近県の方、参加いかがですか？

Code@Styleにmtde.infoのFolder系サンプルコード6種を掲載しました。

上記リンクまたはタグクラウド（Folder）から御覧ください。

2014年1月23日追記：Code@Styleは閉鎖いたしました。ありがとうございました。

3月にお知らせしましたとおり、Code@Styleにmtde.infoのサンプルコード（カテゴリ系11種・エントリ系9種）を掲載しました。

サイドバーのmtde.infoカテゴリまたはタグクラウド（Category・Entry）から御覧ください。

これ以外のサンプルについても利用できそうなものは、後日掲載いたします。

あるサイトがショッピングカートの文字コードに合わせるためShift-JISで出力することになった。

MT4までならばmt-config.cgiに一行追加するだけで簡単に対応することができたが、MT5ではできなくなっている。そこで小粋空間さんの「CharsetEncoder プラグイン」を使う。ブログ全て・テンプレート毎など、非常に簡単に設定ができる。

ただし、波ダッシュ（〜）が「？」と表示された。どうしたものかと検索してみると...

MT5 Shift-JISでの「&#xFF5E;」（波ダッシュ問題） - Cherry Pie Weblog

無事波ダッシュも解消され、サイトはほとんど完成！

さあ、公開まであと少し。

2008年3月10日に公開されたmtde.infoが都合により先日閉鎖されました。

mtde.infoとは

Movable Type 4 専門の解説サイトです。詳細な解説や多彩なサンプルを掲載しています。mtde.infoとは Movable Typeの普及のため、Movable Typeの基本的・応用的な解説や、豊富なサンプルコードなどを提供するサイトです。「変数」についての詳しい記述や、実践的なサンプルコードを多く掲載する方向へ力を入れています。

実はyoshiさんがmtde.info用の下書きとして書かれたブログのデータを、私が保存しておりました。

サンプルコードを紹介することをyoshiさんに了解いただきましたので、MT5でも使える「カテゴリ系」や「エントリ系」「変数」などをコード置き場に掲載させて頂きます。

＊現在、多忙につき作業する余裕がありません。掲載しましたらあらためてご案内します。

2014年1月23日追記：Code@Styleは閉鎖いたしました。ありがとうございました。

Movable Type 4 および Movable Type 5 で確認された複数のセキュリティ問題の修正バージョンとして、Movable Type 4.38、5.07、5.13の提供を開始いたします。これらの脆弱性は、シックス・アパート株式会社による内部的なセキュリティレビューの結果、発見された問題点です。すべてのMovable Typeユーザーは、修正版に必ずアップグレードしてください。

[重要] Movable Type 5.13 および、5.07、4.38 セキュリティーアップデートの提供を開始

今回のアップデートではJavaScriptテンプレートなどテンプレートの一部修正を伴います。

すでに公開済みのテーマを、Movable Type 5.13、5.07、4.38 に対応させるためには、JavaScriptインデックステンプレートを、新しいJavaScriptテンプレートに置き換えてください。Movable Type 5.13 に同梱されている、クラシックブログテーマから、JavaScriptインデックステンプレートをコピーして、既存のテーマのJavaScriptインデックステンプレートを上書き保存します。

5.13、5.07、4.38 のテンプレート変更の詳細

アットスタイルで販売しておりますテーマ・テンプレートでも同作業が必要となります。

1. Movable Typeをアップデートする
2. ダミーのクラシックウェブサイト・クラシックブログ（MT4.38の場合は既定のブログ）を作成する
3. クラシックウェブサイトの「デザイン」から「JavaScript」テンプレートをコピーする
4. 適用したいウェブサイトの「JavaScript」テンプレートにペーストし、テンプレートを再構築する
5. クラシックブログ（MT4.38の場合は既定のブログ）の「デザイン」から「JavaScript」テンプレートをコピーする
6. 適用したいブログの「JavaScript」テンプレートにペーストし、テンプレートを再構築する

環境によりダミーのクラシックウェブサイト・クラシックブログ（MT4.38の場合は既定のブログ）などを作りにくい方には、入れ替え用のJavaScriptインデックステンプレートをお送りいたしますので当方までお知らせ下さい。

先日インストールしたスマートフォンオプション。

17日のセミナーで「ドメイン直下でスマートフォンオプションのブログが作れないか」をシックス・アパートの金子さんに聞いてみた。

「.htaccessがあるので面倒ですが、今までの通りの方法でOK」ということだったので、ちょこっといじってみた。ところが公開パス（ブログURLとブログパス）を書き換えた途端に500エラー。

FTPで.htaccessと.mtview.phpを削除。保存しておいた元々の.htaccessをアップロードしてとりあえずは管理画面にアクセスできた。DynamicMTML .htaccessテンプレートに元々の.htaccessの内容を追加記述し再構築。各ファイルのパーミッションを確認・変更。

できました！

Movable Typeをスマートフォンで利用したい方向けの、ビジネス支援セット「スマートフォンオプション for Movable Type」を本日より発売開始します。

「スマートフォンオプション for Movable Type」を本日提供開始 : Movable Type News - Six Apart

早速インストールしてみた。今回は個人ブログ用のドメイン：atstyle.orgにインストール。

ウェブサイト配下のブログにスマートフォンテーマを適用することになっている。

PC向け

iPhoneでの表示

ウェブサイトを作成せずにドメイン直下で使いたいんだけど。

今日「【福岡開催】Movable Type で地方から攻めるWeb制作ビジネス戦略とスマートフォン対応サイト制作ノウハウ伝授セミナー」で聞いてみよう。

エックスサーバーが「FastCGI」に対応しました。

この度エックスサーバーでは、CGI/PHPのCPU負荷軽減、高速実行が可能となる「FastCGI」に対応しました。
また、PHPプログラムにてFastCGIのご利用がサーバーパネルから簡単におこなえる「PHP高速化設定(FastCGI化)」機能を追加しました。

また、CGIプログラムにおきましても、FastCGI対応プログラムのご利用により、FastCGI化が可能です。Movable Typeは標準でFastCGIに対応しており、FastCGI化の設定を行うことで、CPU負荷軽減や動作の高速化を図ることが可能です。

CGI/PHPの負荷軽減、高速実行が可能となる「FastCGI」対応および「PHP高速化設定(FastCGI化)」機能追加のお知らせ

早速、以下を参考に設定を行った。

• FastCGIについて
• PHPの高速化設定とは

再構築は記事490件で40秒から55秒程度。従来と変わりなさそうですが、検索が速い！サイドバーのタグクラウドでお試しください。

福岡でMovable Type関連のセミナーが行われます。

Movable Type で地方から攻めるWeb制作ビジネス戦略とスマートフォン対応サイト制作ノウハウ伝授セミナー

福岡では2006年6月に【Web2.0セミナー】という今では「ちょっと懐かしい」タイトルで当時シックス・アパートの平田さんが講演されたセミナーに参加したことがあります。レンタルサーバーの会社主催でMT3.3リリース直前だったことを覚えています。

概要

開催日時

2011年11月17日（木）13:30～17:00（13:00受付開始）

セミナー名

Movable Type で地方から攻めるWeb制作ビジネス戦略とスマートフォン対応サイト制作ノウハウ伝授セミナー

場所

天神クリスタルビル 3F Aホール

住所

福岡市中央区天神4-6-7

参加費

無料（事前のお申し込みが必要です）

定員

100名

主催

株式会社スカイアークシステム、アイデアマンズ株式会社、シックス・アパート株式会社

共催:

Japan Perl Association、エムロジック株式会社

スケジュール

1. 「Perlの可能性と開発ロードマップ」

   講演者

   一般社団法人Japan Perl Association
   代表理事　牧　大輔

2. 「Movable Type 5 と jQuery Mobile でつくるマルチデバイス対応サイト」

   講演者

   シックス・アパート株式会社
   執行役員製品企画担当　金子　順

3. 「講演タイトル未定」

   講演者

   株式会社スカイアークシステム
   代表取締役社長　小林　晋也

4. 「Movable Typeによるスマートフォンサイトの制作とスマートフォンオプション」

   講演者

   アイデアマンズ株式会社
   代表取締役社長　宮永　邦彦

5. 「iPhne/androidネイティブアプリ開発入門」

   講演者

   エムロジック株式会社
   取締役　関根　元和

なんとイケメン揃い（関係ないか...）。福岡・近県の方、参加いかがですか？

AnotherCustomFieldsプラグインは、MTOS 5.1xでカスタムフィールドのようなことができるプラグインです。 フィールド追加の定義をconfig.yamlファイルで書く必要がありますが、その点を除けばMovable Type標準のカスタムフィールドとほぼ同様の動作をします。

AnotherCustomFieldsプラグイン(MTOS用カスタムフィールド風プラグイン)リリース

いつもの通りMacにインストール

解凍したAnotherCustomFields・CustomFieldsListing_1_10を所定のディレクトリへ。MTOSのダッシュボードにアクセスするとアップグレードが開始される。

ブログのテーマにAnotherCustomFieldsSample_1_00をインストールし、「クラシックブログ(サブタイトル/トップ画像付き) 1.0」テーマを適用する

ウェブページを作成してみた。新規作成画面の「表示オプション」を開くと「サブタイトル」と「トップ画像」が追加されているのでチェックを入れる。

本文のテキストエリア下にそれぞれのフィールドが追加されている。

「サブタイトル」を入力し「トップ画像」をアップロード

出力されたウェブページ

藤本さんによるとMovable Type標準のカスタムフィールドよりも高速に再構築が可能らしい。

yamlなどの各種設定を解説した「AnotherCustomFieldsプラグインの解説書（PDF）」が販売されている。

本日、小粋空間版「Movable Type」KMTOS 5 専用のテーマをリリースいたしました。

小粋空間版「Movable Type」KMTOS 5 専用テーマ（テンプレート）

このテーマからjQueryは v1.6.3へアップデートしています

よろしくお願いします。

Movable Typeはバージョン5から「ウェブサイト」という概念を導入し、サイト制作の利便性が向上しましたが、その反面、ブログだけを作成する場合には「空の」ウェブサイトを作る必要があります。

ということで、Movable Type Open Sourceをベースにソースコードを改変し、ウェブサイトでブログ記事が作れる機能を追加した小粋空間版「Movable Type」を当ブログで配布致します（MTOSのGPLにもとづいた再頒布です）。

MTのウェブサイトでブログ記事が作れる小粋空間版「Movable Type」の配布開始

さっそくローカルにインストール

テーマには「クラシックウェブサイト」を選択してみた

無事インストール完了。とりあえずウェブサイトが一つできている

記事を書いて保存してみたけど上手くいかない。テーマに「クラシックウェブサイト」を使ったのが原因だった。

テーマを「クラシックブログ（ウェブサイト用）」に変更

再構築して完成です！

テンプレートをイジッテみようか？と思い、MT4.2のテンプレートセットプラグインを入れてみたけど使えない。MT5ブログ用のtheme.yamlのclass: blogをclass: websiteに書き換えるとウェブサイトテーマ一覧に現れた。

今度、MT4.2用のテンプレートでテーマを作ってみよう

9月3日完成しました：KMTOS 専用のテーマをリリースいたしました

ユーザー様から「構築中のサイトでCarritoが使えないか？」とご相談をいただいた。

決済などの関係もあるので直接ユーザー様から開発元の株式会社ベイリーフ様に確認をとっていただいた。全く問題なく、早速導入されることになった。

プラグインとマニュアルをいただいてテスト環境にインストール。ブログ記事を作成してみた。ブログ記事作成画面の下部に必要なフィールドが表示され、そこに入力するだけ。

サンプル用のコードを参考にしながら商品の詳しい情報もカスタムフィールドで追加。「買い物カゴに入れる」ボタンを作成。テーブルで一覧表にマークアップ。これらのコードを使いウェブサイトに「商品詳細」というモジュールを作成。

他のブログにもカスタムフィールドを設定し、「商品詳細」モジュールをインクルードした。

<mt:SetVarBlock name="website_id"><mt:BlogParentWebsite><mt:WebsiteID></mt:BlogParentWebsite></mt:SetVarBlock>
<$mt:include module="商品詳細" blog_id="$website_id">

Movable Typeの外で動くので後はCarritoに任せれば良い。

買い物カゴ導入を検討されている方はぜひチェック！
Google App Engine上で動くECプラグインシステム「Carrito」

静的ページ用ページ分割プラグイン:PageBute

コード

<MTPageContents count="10">
<MTEntries>
<$MTEntryTrackbackData$>
<$MTInclude module="ブログ記事の概要"$>
<$MTPageSeparator$>
</MTEntries>
</MTPageContents>
<ul class="mpage">
<MTIfPageBefore><$MTPageBefore delim="前の10件"$></MTIfPageBefore>
<$MTPageLists link_start="<li>" link_close="</li>" delim=""$>
<MTIfPageNext><$MTPageNext delim="次の10件"$></MTIfPageNext>
</ul>

CSS

.mpage li {
    float: left;
    list-style-type: none;
}
span.current_page {
    padding-right: 5px;
    padding-left: 5px;
}
.mpage li a {
    padding-right: 5px;
    padding-left: 5px;
}

CSSにより微調整は必要

技術評論社さんから出版の「MovableTypeによる実用サイト構築術　ウェブシステムとしての活用ノウハウ MT5/5.1対応」をいただきました。ありがとうございました。

長内毅志さん（シックスアパート）・柳下剛利さん（シックスアパート）・柳谷真志さん（linker）, 野田純生さん（アルファサード有限会社）による共著です。

ウェブサイト制作の現場において，Movable Typeはサイト全体を一元的に管理するCMSとしての利用が一般化しました。しかし，簡単なお申し込みフォームの機能を付加するというだけで，別個にシステムを開発するケースが見られます。そこで着目したいのが，カスタムフィールドなどバージョン5/5.1から強化された機能です。ウェブシステムとしての活用可能性が拡大しています。本書ではイベント受付システムや不動産検索サイトなど，迅速に費用対効果の高いサイトを制作するテクニックを紹介します。

書籍案内：Movable Typeによる実用サイト構築術 ― ウェブシステムとしての活用ノウハウ｜gihyo.jp ... 技術評論社

メールフォームは誰でも思いつくけど、Chapter 3の「イベント受付システム」は面白い。プラグインでCSVをダウンロードできるようにすればMovable Typeだけで完成してしまう。Chapter 4の「グルメ情報サイト」はMTCSのカスタマイズをお考えの方にもおすすめです。

作成されたテーマをダウンロードし実際にコードや動作を確認できます。

著書「Movable Type 5.1　プロの現場の仕事術」もよろしくお願いします。

一年ぶりに参加するMTのイベント！楽しみです。

日時

2011年6月25日（土）12:30開場　13:00開演　18:30終了（予定）

場所

（株）毎日コミュニケーションズ　東京本社　マイナビルームA
〒100-0003　東京都千代田区一ツ橋1-1-1　パレスサイドビル9階東コア

募集人数

120名（予定）

参加費

3,500円（テキスト代込み）

懇親会参加費

1,000円

＊既に受付は終了しているようです。

本日より、Movable Type 5.1 の正式出荷を開始いたします。

「Movable Type 5.1」では、カテゴリ並び替え機能の追加、記事一覧のフィルタ機能の強化など、これまでコミュニティからの要望が多かった機能を最新技術で実装、コンテンツ管理システム（CMS）としてさらに便利に使いやすくなります。

本日より「Movable Type 5.1」を出荷開始 : Movable Type News - Six Apart

Movable Type 5.1 の主な機能紹介ビデオがYouTubeで公開されています。ぜひ御覧ください。

アットスタイルで販売・配布のMT5テーマはMT5.1でも問題なく利用出来ます。引き続きよろしくお願いします。

たった今試してびっくりした。

sort_by="user_custom"を記述していないMT5.0用の「テーマ1071」を適用したMovable Type 5.1rc2でカテゴリを並び替えしてみた。

Cat1・Cat2の順に並ぶはずである。ところがCat2・Cat1の順に並んでいる。

もちろん並べ替えて再構築すると、並べ替えを反映して出力される。

Movable Typeの最新バージョン5.1のリリースと、以前にもご紹介した書籍『Movable Type 5.1　プロの現場の仕事術』の刊行を記念し「MTDDC Meetup TOKYO 2011」が開催されます。

日時

2011年6月25日（土）12:30開場　13:00開演　18:30終了（予定）

場所

（株）毎日コミュニケーションズ　東京本社　マイナビルームA
〒100-0003　東京都千代田区一ツ橋1-1-1　パレスサイドビル9階東コア

募集人数

120名（予定）

参加費

3,500円（テキスト代込み）

懇親会参加費

1,000円

なんと！受講者全員に書籍『Movable Type 5.1　プロの現場の仕事術』をプレゼント。

お申し込みは（株）毎日コミュニケーションズのサイトからどうぞ
http://book.mycom.co.jp/event/mt0625.shtml

毎日コミュニケーションズのMovable Type 5.1向けの書籍「Movable Type 5.1 プロの現場の仕事術」（6月末発売予定）を福島県在住の國分亨さん・原一宣さん・赤井なつみさんのピンチヒッターとして少しだけお手伝いさせいただくことになりました。

なお6月25日(土)に東京・竹橋のマイコミセミナールームで書籍と連動したイベントも行われます。

すごい「Movable Typeドリームチーム2」のメンバーと内容の詳細は以下のページでご確認ください。
「Movable Type 5.1 プロの現場の仕事術」6月25日(土)先行発売: 世界中の１％の人々へ

Movable Type 5.1 Beta 3 を公開

とりあえずダウンロードした。今日は博多で打ち合わせがあったので、JRの車内でMacBook Airのローカルにインストール。

Flash切ってました

Movable Type 5.1 Beta 2を公開します。開発チームはすでに120件のケースを実装、715件のバグを修正済みです。Beta 2時点でアクティブなケースは、こちらのページでご確認いただけます。なお、Movable Type 5.0x からの詳しい変更点、修正点は Beta 3で公開を予定しています。

Movable Type 5.1 Beta 2 を公開

早速アップデート

テーマ1061をインストールしてみた。私の環境だけかもしれませんが、Beta 1ではMTTopLevelCategoriesで動かなかった（mt:TopLevelCategoriesでは動いた）ので放置していたsort_by="user_custom" アトリビュートも動く。

Movable Type 5.1 Beta 1 を公開

Movable Type 5.1 のベータを開始します。ベータ期間の約３ヶ月、皆様のフィードバックで、さらにブラッシュアップしていければと思います。

Movable Type 5.1 Beta 1 を公開

注目の新機能はこんな感じらしい...

• カテゴリー、フォルダの並び替え
• 一覧画面のソートやフィルタ機能の強化と、Ajaxによる速度向上
• 投稿画面のユーザビリティ向上
• マルチブログ環境でのテンプレート編集と、MTタグの強化
• Internet Explorer 8, Safari 最新版, Firefox 最新版をサポート

Macのローカルにインストールしたので試してみます。

スクリーンショットを使って解説します。

インストールウィザードで「最初のウェブサイトを作成」する

ここではドメイン直下にブログを公開してみる。ウェブサイトURLとウェブサイトパスを書き換える。

ウェブサイトURL

first_website/ を削除

ウェブサイトパス

/first_website を削除

「インストールボタン」をクリック。完了したら「設定」を開く

ルートに公開設定さている事を確認。

ブログを作成する

ブログURL及びブログパスを空欄にする（自動的に挿入されたものは削除する）

「ブログの説明」などを記述し再構築する

ブログを確認する

誤ってウェブサイトを再構築した場合にブログがウェブサイトとして上書きされるので、ウェブサイトのテンプレートは削除しておく

数日前から、Yahooからレイオフされた社員にはDeliciousチームの全員が含まれているという噂が流れている。

Yahoo、サービスに大ナタ、Del.icio.us他多数を廃止する？

Del.icio.usデータの移転先に適当なところがない。良く考えてみるとソーシャルではなくともオンラインであれば良い。そこでクイックポストを利用したMTベースのブックマーク用ブログを作成することにした。

標準のクイックポストでは不足なので、以下のようにブックマークレットを作り替えてみた。

javascript:d=document;w=window;t='';if(d.selection)t=d.selection.createRange().text;else{if(d.getSelection)t=d.getSelection();else{if(w.getSelection)t=w.getSelection()}}void(w.open('【mt.cgiのURL】?__mode=view&_type=entry&blog_id=1&qp=1&title='+encodeURIComponent(d.title)+'&text='+encodeURIComponent('<ul>\n<li><a%20href="')+encodeURIComponent(d.location.href)+encodeURIComponent('">')+encodeURIComponent(d.title)+encodeURIComponent('</a></li>\n</ul>\n<blockquote>')+encodeURIComponent(t)+encodeURIComponent('</blockquote>'),'_blank',''));

【mt.cgiのURL】部分は書き換えてください。blog_id=1もかな？

既にDel.icio.us上にある600位のデータはhtmlでエクスポート。Yahoo!Bookmarksにインポートしてみるとタグがすっかりなくなっていた。さらにエクスポートしてタグがない状態ではあるがCSVに変換ができた。

現在CSVにタグとカテゴリを追加している。整理ができ次第、Movable Typeのブログ記事インポートフォーマットに変換する。

久しぶりのMovable Typeネタ

検索結果ページのタイトルに検索フレーズを追加する

ちょっと追加するだけで検索エンジンも拾ってくれるかもしれません。（Googleでは拾ってくれるようです）

デフォルトのsearch_results.mtmlの記述

<title><$mt:BlogName encode_html="1"$>: 検索結果</title>

mt:SearchStringを追加する

<title>「<$mt:SearchString$>」の検索結果:<$mt:BlogName encode_html="1"$></title>

本日、以下のMovable Type 無料テーマ（テンプレート）のアップデートを行ないました。

• MovableType 5 無料テーマ HTML5
• MovableType 4.2 無料テンプレート 2Column HTML5

変更されたテンプレート

html_head.mtml

ダウンロード時にお送りしたメールに掲載のURLより再ダウンロードしてください。

修正適用手順

1. html_head.mtmlを上書きアップロード
2. ダッシュボードから「デザイン」を開き、「HTMLヘッダー」テンプレートを選択し「テンプレートの初期化」
3. すべてを再構築

お手数をおかけいたしますが、よろしくお願い致します。

MT4LP5以来2年ちょっと、久しぶりにMTのイベントの参加しました。MT DDCは参加したことがなかったのですが、今回「テーマ編」ということで参加させていただきました。

朝6時過ぎに出発して、飛行機が少し遅れたおかげで、会場についたのが12時過ぎ（熊本からは遠いよね～）。すでにかなりの方が入室されてるようでした。会場のドア付近にOscarさんとlinkerのcremaさんを発見。その隣に座らせていただきました。

内容は

Movable Type 5 成長するプラットフォーム

金子順さん (シックス・アパート株式会社)

Movable Type 5.1の予定実装の解説。かなり使いやすくなりそうです。Movable Type 5.1は来年の初めころのリリースだそうで、今からワクワクしております。

テーマ機能を使って、便利にテンプレートを管理しよう

森和恵さん

DreamWeaverでのテンプレートの編集方法。DreamWeaverを購入したばかりなのであまり理解していませんが、DreamWeaverのテンプレート機能を利用して効率的にモジュールなどの編集ができるようです。

ウェブサイト／ブログを組み合わせたサイトのテーマ化

藤本壱さん

ウェブサイトとブログ間でのデータのやり取りのを効率的に行うノウハウ満載。一括で登録しておく方法、勉強になりました！

仕事に役立てるテーマ

蒲生トシヒロ (Dakiny)さん

テーマを利用する際の注意点など。これからテーマをつくってみようと思っている方がなかなか気づきにくいところを細かく解説。

テーマを使った手間いらずなサイト制作

荒木勇次郎さん

yamlの書き方。これだけのボリュームと詳細さはすごい。私も手描きでyamlを作成していますので、スライドの配布が待ちどうしい。公開されたようです。エクスポート系のプラグインも使ってみたい。

ライトニングトーク

飛び入りでHTML5のテーマを宣伝させていただきました。そのため私より前のLTは全く聞いてませんでした。すみません。舞い上がっちゃって私の後の方のもよく聞いてませんでした。

スピーカーのみなさま、シックス・アパートのみなさま、大変勉強になりました！ ありがとうございました。

先日より作成しておりました「HTML5のMovable Type 5テーマ」が完成しました。

無料配布いたしますが、未だ配布用ページが完成しておりません。ご希望の方は「お問い合わせ」よりお知らせください。

7月30日追記：配布用ページを作成しました。「MovableType 5 無料テーマ HTML5」

＊利用規約は「MovableType 4.2 無料テンプレート 2Column HTML5」と同様です。お申込みの際に名前・電子メール・テンプレート利用予定ドメイン・住所・電話番号をお知らせください。

極力装飾を入れずミニマルに徹底した。パイプやパンくず等CSSで表現できるものには画像を利用していない。前回お知らせした時には右サイドバーだったが、どうしてもバランスがとれない。左サイドバーに変更して、なんとか落ち着いた。

上部と下部のナビゲーションにはシークレットタグを用いてウェブページを追加することができる。現在ブログをひとつだけ作成しているが複数のブログで運営できる。

ウィジェットは以下のとおり

ウィジェットテンプレート

• OpenID対応
• カテゴリ
• クリエイティブコモンズ
• サイドバー フリーボックス
• タグクラウド
• フィード
• フォト
• ページリスト
• 最近のコメント
• 最近のトラックバック

「フォト」「最近のコメント」「最近のトラックバック」はウェブサイトのメインページとブログのメインページのみに表示できる。「ページリスト」は上部と下部のナビゲーションに追加した以外のウェブページを表示する。

先日より作業を行っている「HTML5のMovable Type 5テーマ」はこんな感じ。

現在、マークアップはほとんど終了した。テンプレートの構成はブログ向けとしたためにシンプルになった。

ウェブサイトテンプレート

インデックステンプレート

• JavaScript
• jquery.js
• RSD
• Site Map
• slimbox2.css
• slimbox2.js
• スタイルシート
• メインページ
• リセットスタイルシート
• 最新記事のフィード

アーカイブテンプレート

• ウェブページ

テンプレートモジュール

• HTMLヘッダー
• カテゴリ
• コメント
• サイドバー
• トラックバック
• ナビゲーション
• ナビゲーションリスト
• バナーフッター
• バナーヘッダー
• ブログ記事の概要
• ヘッダナビ
• ヘッダナビリスト

システムテンプレート

• コメントプレビュー
• コメント完了
• ダイナミックパブリッシングエラー
• ポップアップ画像
• 検索結果

ブログテンプレート

インデックステンプレート

• JavaScript
• RSD
• メインページ

アーカイブテンプレート

• ウェブページ
• カテゴリ別ブログ記事リスト
• ブログ記事
• 月別ブログ記事リスト（不要？）

テンプレートモジュール

• HTMLヘッダー

システムテンプレート

• コメントプレビュー
• コメント完了
• ダイナミックパブリッシングエラー
• ポップアップ画像

HTMLヘッダーは、ウェブサイトとブログで共通化できないこともないが、一部区別したいところがあったので別になっている。レイアウトや細かいデザインはこれから。

MovableType 5（MT5 MTOS5）テーマ1030 とMovableType 4.2 無料テンプレート 2Column HTML5を元にして、HTML5でマークアップしたテーマを作成中

MovableType 5（MT5 MTOS5）テーマ1030 とは全くの別物。

まだ検索以外のシステムテンプレートとサイドバーには手をつけていない。なかなか進まないが今月中に完成させたい。

先日のニュースリリースで面白そうなのでベータテストに登録していた。

シックス・アパートが、ブログ／メディア向けの ソーシャルメディア相互連携ツール「zenback」を発表

zenbackは、ブログ記事のテンプレートにスクリプトコードを埋め込むことで利用できます。ブログの記事の下や横に、

• その記事に関係する自分のブログ記事
• その記事に関係する他のzenbackユーザーのブログ記事
• その記事についての最新のTwitterのつぶやき
• その記事についてのはてなブックマーク
• その記事の最新のアクセス元（リファラ）

を表示します。

zenback

zenbackによって、今までは１つ１つ独立している印象だった「ブログ」が、他のブログや他のサービスとゆるやかにつながり、大きなソーシャルの輪となっていきます。

zenback

このブログの個別ページに実装してみました。

記事のすぐ下にテンプレートタグで表示している「関連記事」は新しいものから拾ってきますが、zenbackではランダムに古い記事からも（件数は指定できる）表示されているようです。

気になったらzenbackベータテストへお申込み！

昨日までの「MovableType 4.2 無料テンプレート 2Column HTML5」の簡単な解説でメインカラムがほぼ終了しましたので、本日はサイドバーについて解説します。

グローバルナビゲーションを設けておらず、主となるナビゲーションをカテゴリとしてnav要素でマークアップした。＊ブログにより違うかもしれない。
TrackBackとPoweredをaside要素、その他をsection要素でマークアップした。

また、ブログ記事リストなどと同様に「Recent Entries」と「Archives」はul要素ではなくol要素でリスト化した。

<nav>
<h2>Categories</h2>
<ul>
<li>カテゴリー</li>
</ul>
</nav>
<section>
<h2>Recent Entries</h2>
<ol>
<li>ブログ記事</li>
</ol>
</section>
<section>
<h2>Archives</h2>
<ol>
<li>月別アーカイブ</li>
</ol>
</section>
<section>
<h2>Tags</h2>
<ul>
<li>タグ</li>
</ul>
</section>
<section>
<h2>Comments</h2>
<ol>
<li>ブログ記事タイトル</a>
<div><span>コメント投稿者 投稿月日</span></div>
</li>
</ol>
</section>
<aside>
<h2>TrackBacks</h2>
<ol>
<li>ブログ記事タイトル</a>
<div><span>送信者</span></div></li>
</ol>
</aside>
<section>
<h2>Photo</h2>
<ol>
<li>サムネイル</li>
</ol>
</section>
<section>
<h2>Feed</h2>
<ul>
<li>Atom</li>
</ul>
</section>
<aside>
<h2>Powered by </h2>
<ul>
<li>Movable Type</li>
<li>@Style</li>
</ul>
</aside>
<section>
<h2>Search</h2>
<ul>
<li>検索フォーム</li>
</ul>
</section>

コメントとトラックバックの「┗」はCSSの:before擬似要素で表示した。

div.comment-author span:before , div.ping-name span:before {
    content: " ┗ ";
}

昨日の「MovableType 4.2 無料テンプレート 2Column HTML5」の簡単な解説でコメントフォームについてやり残していましたので続きです。

コメントフォームでinput要素type属性の値に新しく加えられたemailとurlを利用した。

<label for="comment-email">電子メール</label>
<input type="email" value="">
<label for="comment-url">URL</label>
<input type="url" value="" >

引き続き、「MovableType 4.2 無料テンプレート 2Column HTML5」の簡単な解説です。

ブログ記事について

ブログ記事リストではないのでol要素でリスト化する必要はない。divで余白の調整、ブログ記事全体をarticleとする。前々回の解説のように「ブログ記事のタイトル」と「メタデータ」をheader要素とした。
＊余白の調整もarticle要素に任せて良いかもしれない。

タグ・トラックバック・コメントはセクションを分けた。それぞれのタイトルをheader要素でマークアップ。

他のブログから受けたトラックバックの内容はaside要素とした。コメントごとにarticle。コメントとトラックバック時刻はメタデータと同様にtime要素とした。

コメントフォームも解説すると長くなるので次回に。

<article>
<header>
<h2>ブログ記事のタイトル</h2>
<ul>
<li>メタデータ</li>
</ul>
</header>
ブログ記事の本文
ブログ記事の続き
<section>
<h3>タグ:</h3>
<ul>
<li>エントリータグ</li>
</ul>
</section>
<section>
<header>
<h3>トラックバック</h3>
<p>トラックバックURL</p>
</header>
<aside>
<h4><$MTPingBlogName$> -
<a href="<$MTPingURL$>"><$MTPingTitle$></a> (<a href="#ping-<$MTPingID$>">
<time datetime="<$MTPingDate format_name="iso8601"$>"><$MTPingDate format="%x %k時%M分"$></time></a>)</h4>
<p><$MTPingExcerpt$> <a href="<$MTPingURL$>">続きを読む</a></p>
</aside>
</section>
<section>
<header>
<h3>コメント</h3>
</header>
<article>
<header>
<h4><$mt:CommentAuthorLink$><time pubdate="pubdate" datetime="<$mt:CommentDate format_name="iso8601"$>"><$mt:CommentDate$></time></h4>
</header>
コメント本文
</article>
<h3>コメントする</h3>
コメントフォーム
</section>
</article>

ユーザーの方から「MovableType 4.2 無料テンプレート 2Column HTML5」でコンテナの幅を調整したいというご要望がありましたので、予定を変更してCSSでの調整を解説します。

コンテナやカラムの幅の調整方法

Layout部分36行め以降のheader#branding・div#content・footer#copyで全体の幅を指定し、div#mainとdiv#subでカラムの幅を調節します。＊ノーマルな状態ではメインコンテンツには468pxのバナーがぴったりと入るように設計されています。

740pxの幅を960pxに広げ、メインコンテンツに640pxが入るように調整する例

640px+20px+20px（div#main .innerの左右padding）=680px（div#main）
960px（全体の幅）-680px（上記数値）-2px（IE用調整）=278px（div#sub）

サイドバーが48px増えてるが、このままではアイテムのサムネイルが横に3つ入らずおかしな余白ができる。3つ並べるには240px必要となるのでdiv#sub .innerのpadding-leftを2px減らす。

header#branding {
    color: #333333;
    background-color: #ffffff;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    width: 960px;
    overflow: hidden;
}
div#content {
    font-size: 100%;
    color: #333333;
    background-color: #ffffff;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: 960px;
}
div#main {
    font-size: 80%;
    color: #333333;
    background-color: #ffffff;
    text-align: left;
    padding-bottom: 20px;
    width: 680px;
    float: left;
}
div#sub {
    font-size: 100%;
    color: #333333;
    background-color: #ffffff;
    text-align: left;
    margin-bottom: 20px;
    width: 278px;
    float: right;
}
footer#copy {
    font-size: 100%;
    color: #333333;
    background-color: #ffffff;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: 960px;
    clear: both;
}

/* サイドバー余白調整 */
div#sub .inner {
    line-height:1.5;
    padding-left: 18px;
    padding-right: 20px;
}

恒例、「MovableType 4.2 無料テンプレート 2Column HTML5」の簡単な解説です。

ブログ記事の概要

「HTML5のセクショニングをどうするか」が一番悩んだ。

「ブログ記事の概要」全体をarticle要素でマークアップ。＊それぞれの「ブログ記事の概要」は初回の解説のようにol要素でリスト化している。

ブログ記事のタイトルと各メタデータはheader要素。さらにsection要素で区切り、エントリータグ。「続きを読む」をfooter要素でマークアップ。

<article>
<header>
<h2>ブログ記事のタイトル</h2>
<ul>
<li>メタデータ</li>
</ul>
</header>
ブログ記事の本文
<section>
<h3>タグ:</h3>
<ul>
<li>タグ</li>
</ul>
</section>
<footer>
続きを読む
</footer>
</article>

「ブログ記事」テンプレートは「トラックバック」「コメント」「コメントフォーム」があるのでさらに複雑になる。次回解説の予定。

今回もMovableType 4.2 無料テンプレート 2Column HTML5の簡単な解説です。

ブログ記事のメタデータについて

各々のデータをリスト項目として取扱い、セパレータに文字を使わずCSSの:before擬似要素で表示。IEでも表示させるためにIE9.jsが必要となる。

投稿時間をtime要素・pubdate属性・datetime属性でマークアップ。datetime属性のフォーマットをMTEntryDate format_name="iso8601"とした。

<ul class="entry-meta">
    <li><time pubdate="pubdate" datetime="<$MTEntryDate format_name="iso8601"$>"><$MTEntryDate format="%x"$></time> <MTIfNonEmpty tag="EntryAuthorDisplayName"><$MTEntryAuthorLink show_email="0"$></MTIfNonEmpty></li>
<MTUnless name="hide_counts" eq="1">
    <li><a class="permalink" href="<$MTEntryPermalink$>" title="Permalink to this entry:<$MTEntryTitle$>">個別ページ</a></li>
    <MTIfCommentsActive><li><a href="<$MTEntryPermalink$>#comments" title="Comments for:<$MTEntryTitle$>"><$MTEntryCommentCount singular="コメント(1)" plural="コメント(#)"$></a></li></MTIfCommentsActive>
    <MTIfPingsActive><li><a href="<$MTEntryPermalink$>#trackbacks" title="Trackback for:<$MTEntryTitle$>"><$MTEntryTrackbackCount singular="トラックバック(1)" plural="トラックバック(#)"$></a></li></MTIfPingsActive>
</MTUnless>
</ul>

前回の引き続きMovableType 4.2 無料テンプレート 2Column HTML5の簡単な解説です。

今回は・・・

banner_header.mtmlのheaderについて

h1要素にはMTBlogName、副題としてh2要素にMTBlogDescriptionを利用、これらをhgroup要素でグループ化。

ブログの説明「MTBlogDescription」を記述されない方も多いことから、<mt:If tag="BlogDescription">とし、MTBlogDescriptionがある場合のみh2要素を出力。見出しをグループ化するhgroup要素だが1個以上のh1～h6要素があればよいのでh1のみでも問題はない。

<header id="branding">
<hgroup>
<h1><a href="<$MTBlogURL$>" accesskey="1" title="<$MTBlogName encode_html="1"$>"><$MTBlogName encode_html="1"$></a></h1>
<mt:If tag="BlogDescription"><h2><$MTBlogDescription$></h2></mt:If>
</hgroup>
</header>

メインページとブログ記事リスト

メインページとブログ記事リストはol要素でマークアップ。ブログ記事リストという位なのでリストにするのは当然かも知れない。新しい順に並ぶのでul要素ではなくol要素が適当だろう。

<div id="main">
<ol class="semantic-list">
<MTEntries lastn="5">
<li>
<$mt:include module="ブログ記事の概要"$>
</li>
</MTEntries>
</ol>
</div><!-- / main -->

次回に続く（はず）

MovableType 4.2 2Column HTML5の解説

• MovableType 4.2 2Column HTML5の解説（その1）

MovableType 4.2 無料テンプレート 2Column HTML5は、リリースから約1ヶ月経過し少しずつダウンロードして頂いております。

HTML5は初めてという方もいらっしゃるようなので、数回にわたって（簡単に）解説し（ていきたいと思い）ます。

まずは基本形。

<!DOCTYPE html>
<html lang="<$MTBlogLanguage$>">
<head>
<meta charset="<$MTPublishCharset$>">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<![endif]-->
<script src="<$MTLink template="javascript"$>"></script>
<link rel="stylesheet" href="<$MTLink template="Reset_Stylesheet"$>">
<link rel="stylesheet" href="<$MTLink template="styles"$>">
<title><$MTBlogName encode_html="1"$></title>
</head>
<body>
<header>
<hgroup>
<h1><a href="<$MTBlogURL$>" accesskey="1" title="<$MTBlogName encode_html="1"$>"><$MTBlogName encode_html="1"$></a></h1>
<mt:If tag="BlogDescription"><h2><$MTBlogDescription$></h2></mt:If>
</hgroup>
</header>
<div id="content">
<div id="main">
<ol>
<MTEntries lastn="5">
<li>
<$mt:include module="ブログ記事の概要"$>
</li>
</MTEntries>
</ol>
</div><!-- / main -->
<div id="sub">
<div class="inner">
<$MTWidgetSet name="サイドバー"$>
</div>
</div><!-- /sub -->
</div><!-- /content  -->
<footer>
<p><small>Copyright &copy; 2010 yourdomain, All Rights Reserved.</small></p>
</footer>
</body>
</html>

主要なところだけ抜き出していますが、XHTMLから比べると非常にシンプル。

http://html5shiv.googlecode.com/svn/trunk/html5.jsはIEでHTML5の新要素section要素やarticle要素をブロック要素として振るまえるようにし、http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.jsでCSSを少しまともに解釈出来るようにします。IE9に期待を込めて<!--[if lt IE 9]>としました。

header要素とfooter要素でコンテンツ部分との分離を行います。今までaddress要素でマークアップしていたCopyrightはfooter内のsmall要素に変更。
＊HTML5でsmall要素は、見栄えをコントロールするプレゼンテーションモジュールからセマンティックな「細目を表す注釈」へと変更になったので注意が必要です。

次回に続く（はず）

先日より作成しておりました「MovableType 4.2 無料テンプレート 2Column HTML5」をリリースしました。

HTML5でマークアップしチョコっとCSS3を使ったMovableType 4 .2専用テンプレートです。

詳細は「MovableType 4.2 無料テンプレート 2Column HTML5」およびデモブログでご確認ください。

追記：MT5用のテーマ「MovableType 5 無料テーマ HTML5」も！

そろそろHTML5で作ってみようと思い、やってみた。

「メインページ」「ブログ記事リスト」サイドバーの「最近のブログ記事」「アーカイブ」にはolで番号を入れてみた。ブログ記事とウェブページのbrとimgの /はそのままでも良いのだが、気持ち悪いのでregex_replaceとreplaceで消した。

まだHTML5の要素をよく理解していないので、大いに間違っている所もあると思う。

5月1日追記：少し変更したが、ブログ記事のアウトラインが変だ。まだまだ変更する予定

5月9日追記：ブログ記事のアウトラインも変更。まだまだ変更する予定！

関連情報　

• MovableType 5 無料テーマ HTML5
• HTML5でマークアップしたMovable Type 5 テーマをリリースいたしました

私にとっての2冊目の著書「Movable Type 5実践テクニック」がソフトバンククリエイティブより、3月26日に発売されます。

著者：蒲生トシヒロ、藤本壱、小野崎直昭、難波田実香、柳泰久、柳谷真志、丹羽章

監修：シックス・アパート株式会社
出版社：ソフトバンククリエイティブ
定価：2980円（税込）

新機能であるテーマをメインとして「Movable Type 5はこんなことができるんだ！」ということをトコトン詳しく解説しています。

サンプルサイトにて、この書籍用に作成された3種類の配布テーマを公開しています。

ActionStremsを利用して取得した情報をウェブサービスごとにウィジェット化。

中規模企業サイトのカスタマイズベース。カスタムフィールドの機能を最大限に使用。商社や卸業、製造業向け。

カタログサイトなどに、強力な検索機能を実装できます。カートを装備すれば本格的な運営も可能

これらのテーマは実際の商用ウェブサイトでも使えるように「クリエイティブ・コモンズ・ライセンス 表示・継承 2.1」で配布します。

よろしくお願いします。

Movable Type 5で、ウェブサイトを「配下のブログ」のポータルとする場合、検索はすべてのブログにまたがった検索結果をウェブサイトの検索結果テンプレートで表示したい。

デフォルトのパラメータ

<input type="hidden" name="IncludeBlogs" value="<$mt:BlogID$>" />

パラメータにウェブサイト配下すべてのブログIDを渡す

<input type="hidden" name="IncludeBlogs" value="<$mt:WebsiteID$><mt:WebsiteHasBlog><mt:Blogs include_blogs="site">,<$mt:BlogID$></mt:Blogs></mt:WebsiteHasBlog>" />

この内容を使用してウェブサイトに検索モジュール（ウィジェットでも可）を作成

<form method="get" action="<$mt:CGIPath$><$mt:SearchScript$>">
<input type="hidden" name="IncludeBlogs" value="<$mt:WebsiteID$><mt:WebsiteHasBlog><mt:Blogs include_blogs="site">,<mt:BlogID></mt:Blogs></mt:WebsiteHasBlog>" />
<input type="hidden" name="limit" value="<$mt:SearchMaxResults$>" />
<label for="search">このサイトの検索</label>
<input type="text" size="15" id="search" name="search" value="<$mt:SearchString$>" />
<input type="submit" value="Search" />
</form>

ウェブサイト配下のブログからウェブサイトの検索モジュールをインクルードする

<mt:BlogParentWebsite>
<mt:SetVarBlock name="website_id"><mt:WebsiteID></mt:SetVarBlock>
<mt:Include module="検索" blog_id="$website_id"$>
</mt:BlogParentWebsite>

注意：ウィジェットで作成した場合はmoduleの部分をwidgetに変更すること

Movable Type 5テーマの記述に誤りがありましたので修正いたしました。

メインページのテンプレートにおいて<MTBlogs>のinclude_blogs="site"モディファイアが不足しており、テーマ1001のアイテムサムネイルをクリックしてもテーマ1002へ移動しておりました。

<MTBlogs include_blogs="site">

修正し正しく動作しております。ご迷惑をおかけいたしました。

ウェブサイトの配下のブログやウェブサイトの直下にブログを作成した場合には、MT4.2のテンプレートセットプラグインがそのまま利用可能です。

MT4.2で行っていた通り、テンプレートセットプラグインをpluginsディレクトリにアップロードします。

「ブログテーマの一覧」を開くとインストールしたテンプレートセットプラグインが現れますので、選択し、再構築を行うと適用されます。

参考情報1（スクリーンショット付き解説）：Movable Type 5 ウェブサイトの直下（ルート）にブログを公開する

参考情報2：ウェブサイトの直下（ルート）にブログを公開する

• ウェブサイトに存在するブログのコンテンツをポータルウェブサイトとして構築します。
• 配下のブログにも同じデザインが設定できます。また、「プロフェッショナルブログ」「クラシックブログ」などの独立したデザインのブログもウェブサイトに含めることができます。
• MovableType 5の新機能「テーマ」を利用して設置が簡単！コピー・ペーストの作業は必要ありません。
• 「会社概要」「プライバシーポリシー」「特定商取引法による表示」のウェブページ、お問い合わせなどのテンプレートは自動的に作成されますので、編集するだけでOK!
• トップページには新着記事1件の本文と最近の記事5件のタイトルをタブで分割して掲載できます。
• サイドバーのパーツはウィジェットとして登録されています。自由に配置していただけます。また、ウェブサイト用・ブログ用の2種類のウィジェットを装備しており入れ替えも自由
• もちろんLightbox・Carouselが利用できます。

MovableType 5（MT5 MTOS5）テーマ[アットスタイル]

＊今回のテンプレート開発に当たり、mtde.infoのapstar様にご協力いただきました。ありがとうございました。

ベータテスト開始時より作成しておりましたMT5のテーマ（テンプレート）の第一弾がほぼ完成しました。

• ウェブサイトとブログを同一のデザインで作成することができます。
• ウェブサイトでは「メインページ」「会社概」「特定商取引法」「プライバシーポリシー」のウェブページを自動的に作成します。
• ウェブページにシークレットタグを追加することでナビゲーションに追加できます。
• 「お問い合わせ」「お問い合わせありがとう」のページはテンプレートにより自動的に作成されます。
• Carouselでアイテムのサムネイルを表示します。
• LightBoxを利用可能です。
• ブログのサイドバーはウィジェットによりブログ用のパーツに入れ替えが可能
• ウェブサイト配下のブログにオリジナルテーマでなくクラシックブログを利用してもウェブサイトの動作は問題なし

Movable Type 5（MT5）のリリース日（11月26日）に販売開始の予定です。

Movable Type 5.0 RC1 を公開

早速、インストールした。

様々な問題点が改善されており、エックスサーバーでも問題なく画像のアップロードが可能となりました。

RC１ リリースノート

作成中のテーマを適用してみた。

現在のところ、動作には問題なし。

Movable Type 5の製品リリースが11月後半となるようです。

7月に発表いたしました最新ウェブサイト管理ソフトウェア「Movable Type 5」につきまして、製品品質等の最終確認を継続中のため、当初予定していた10月中の出荷開始を延期することとなりましたので、お知らせいたします。

現在のところ、出荷時期は11月後半を予定しています。

Movable Type 5 出荷延期のお知らせ

これに伴いアットスタイルで開発中のテンプレートも11月後半以降のリリースとなります。

MT5のテンプレートを作成中ですが、以下のような内容になりそうです。

• ウェブサイトとブログのデザインを統一
• ウェブサイトと違うデザインのブログも作成可能とする
• デザインが違っていてもウェブサイトとして機能する
• 会社概要などのページはウェブページを自動的に作成する
• ブログにもウェブサイト（ウェブページなど）の情報を掲載する
• 検索結果とタグ検索はウェブサイトにて表示する
• ブログのウィジェットはウェブサイトの情報・ブログの情報を自由に変更できる
• LightboxやidTabs・Carouselなども実装する

ウィジェットはこんな感じ...

現在のところ、ほぼ思うとおりの動作をするところまで完了しています。

乞うご期待！

ベータプログラムへの沢山のフィードバックをもとに、多くの機能を洗練したMovable Type 5.0 Beta 3を公開します。管理画面のユーザーインターフェースを見直し、操作性を向上しました。また、バージョンアップしたときのウェブサイトの自動作成方法を変更しています。Beta ページからダウンロード可能です。

Movable Type 5.0 ベータ３を公開

早速、ローカルとXREAにインストールした。管理画面のUIが少し変わっているようです。

Beta 3 リリースノート

作成中のテーマを適用してみましたが、問題なし。

その他をもう少し検証してみます。

テーマのフォルダの中に以下の画像を放り込む

thumb.png

400×300

thumb-medium.png

240×180

thumb-small.png

120×90

theme.yamlに以下を記述

thumbnail_file: thumb.png
thumbnail_file_medium: thumb-medium.png
thumbnail_file_small: thumb-small.png

MT5で追加されるMTタグの利用方法にあるように、ブログでウェブサイトのテンプレートを利用できる。

例えばウェブサイトの「ナビゲーション」モジュールを使用する場合にはmt:WebsiteIDを指定するために以下のように記述する。

<mt:SetVarBlock name="website_id"><mt:BlogParentWebsite><mt:WebsiteID></mt:BlogParentWebsite></mt:SetVarBlock>
<mt:Include module="ナビゲーション" blog_id="$website_id">

ただし「ナビゲーション」モジュールを利用しているだけなので、内容はブログ内のメインページ・ウェブページへのリンクとなる。これをウェブサイトのメインページ・ウェブページにするには、外側にmt:BlogParentWebsiteを指定する。

<mt:BlogParentWebsite>
<mt:SetVarBlock name="website_id"><mt:WebsiteID></mt:SetVarBlock>
<mt:Include module="ナビゲーション" blog_id="$website_id">
</mt:BlogParentWebsite>

動作やその詳細確認のために「余分なdivを削除しCSSを空にした」テンプレートを作成してみた。

プロフェッショナルウェブサイトのテンプレートはMT4.1と同様の分割となっているので、MT4.2に準じて分割のやり直し、また、内容はよく確認していないがmt.jsがMT4.2と同じ動作をするようなので、コメント周りもMT4.2からそっくり移植。

こんな感じです。

9月26日追記：色々と追加中のため公開できなくなりました。ご了承ください。

先日、Movable Type 5.0 ベータ1をMacローカルにインストールしたが、こんどはXREAのサーバーにインストールしてみた。

テンプレートをインストールできるのか？

いつものようにpluginsディレクトリにテンプレートセットをアップロードし、ウェブサイトの下にブログを作成。

そのまま使える。

そこで、テンプレートを変えてみる。MT4のように「テンプレートの初期化」ではできない。テーマより変更する。

これもOK

しかし、ブログはウェブサイトの下にしか作れないので、MT4.2のようなテンプレートではあまり意味がないのかな...

Movable Type 5は、コンテンツとデザインを連携し、ウェブサイトの『テーマ（目的）』を最短距離で実現します。多くのノウハウが蓄積された強力なテンプレート言語と、カスタムフィールドなどのカスタマイズを組み合わせてテーマを作成、配布。また、ウェブサイト単位のコンテンツ管理や、更新履歴の保存など、CMSとしての基盤を熟成しています。個人のブログから、企業ホームページ、多数のメンバーで運営するソーシャル・メディアまで、大きく成長するウェブサイト運営を実現します。

Movable Type 5.0 のベータテストを開始しました

エアコンが動作せず「午後の仕事休もうかな？」と思ってたところ、Twitterでリリースのお知らせがあった。なんとかエアコンが動くようになったので、Macにインストールしてみた。

「Movable Type 5 BETA ドキュメント」ではデータベース環境は以下の通りですが、SQLiteでイントールできた。

必要インストール環境（ウェブサーバー， DB）と、ブラウザ動作環境

• MySQL バージョン5.0 以上
• Oracle Database 11g (Movable Type Enterprise のみ)
• Microsoft SQL Server 2008 (Movable Type Enterprise のみ)

ダッシュボード

「プロフェッショナル・ウェブサイト」を使うと複数のサイトの下に複数のブログを作成して一括管理できる。

新機能の詳細については「Movable Type 5 の新機能 」や藤本さんの「Movable Type 5 β1リリース」などをご覧ください。

jQuery Carouselを利用し新着アイテムには画像のサムネイルを表示します。

新製品情報や制作実績のポートフォリオとして利用することができます。表示するカテゴリを特定したり、表示件数の変更も可能です。

8月28日現在、以下の6アイテムをリリースしています。（Slimbox 2・idTabsも実装）

• テンプレート 694
• テンプレート 695
• テンプレート 696
• テンプレート 697
• テンプレート 698
• テンプレート 699

Macのローカルにインストールしてみた。

新機能についてはThe blog of H.Fujimotoの藤本さんがMovable Type 4.3（英語版等）リリースに詳細をエントリーされている。

以下のページよりダウンロード

• MT4.3 Professional
• MTOS 4.3

早速、一番の目玉であろうページ分割を行ってみた。

以下のページが参考になる。

Pagination for Static Templates

小粋空間の荒木さんが（優しい）日本語で、修正箇所も含めて記事にされているので参考にした。

Movable Type 4.3 の新機能（スタティックページのページ分割）

用意した記事数が少なかったので、2件で分割してみた。

ページを移動すると「ログ」に残るので、「タグ」検索と同様ログが膨れ上がると思われる。

MovableType 4.2（MT4.2 MTOS4.2）テンプレート@Style2.0バージョンのテンプレートセットにjQueryライブラリのSlimbox 2プラグインを実装し、手軽にLightboxを利用いただけるようにいたします。

実装済みのMovableType テンプレート 686 をご覧ください。

只今、テンプレートデモ用のブログに実装作業中でございます。よろしくお願いいたします。

7月29日追記：実装完了しました。MovableType 4.2（MT4.2 MTOS4.2）テンプレート@Style2.0バージョン

昨日（7月27日)リリースしたMovableType 4.2 無料テンプレート 2Column 2ndテンプレートセットにLightboxを装備してみました。

昨年位からprototype.jsではなくjQueryで実装することが多くなっています。Lightbox用のプラグインはSlimbox 2を利用。

テンプレートセットとローディング画像などをアップロードするだけでLightBoxが利用できます。

rel="lightbox"が面倒なのでJunnamaさんのLightBoxプラグイン(改良版)を利用すれば手間いらず。

リリースの予定は未定です。

2008年8月にリリースしたままになっておりました無料テンプレートを修正してリリースの予定です。

• 装飾のまったく無いMovableType 4 .2専用テンプレートです
• meta要素を適切に出力可能です
• サイドバーの各パーツはウィジェットとして登録しています
• サイドバーのPhotoは当該ブログ記事にリンクしています

未だダウンロードページを作成しておりません。すぐに利用されたい方は、お手数でございますが、メールその他でお知らせください。

7月27日：公開しました。

7月17日にMovable Type 4.3 Beta1がリリースされていた。MT5が発表になっている時点でのMT4.3ベータ版なので「何か意味があるのか？」と思いながらインストール。

特別変わっているところはない。MT4.2からのバグフィックスのような感じだろうか。MT4.3a1ではタグ検索時のinclude_blogs="all"も改善されているらしい。

ダッシュボードのブログ記事編集画面の下部よりアイテムのアップロードができるようだ。

MT4.2用としてリリースしたテンプレート682をインストールしてみると、問題なく動く。

今後MT4.3・MT5と楽しみは続く...

2009年7月8日、Movable Type のメジャーバージョンアップであるMovable Type 5 が発表されました。

Movable Type 5 のベータ版は8月上旬、正式出荷は10月を予定しています。

ウェブサイト管理の新標準、「Movable Type 5 」を発表しました

「Movable Type 5」は、既存のブログ・ソフトウェア「Movable Type 4」をさらに機能強化し、個人のブログから多数のメンバーで運営するソーシャル・メディアまで、様々なシーンでのウェブサイト構築・運営・管理を支援する"ソーシャル・パブリッシング・プラットフォーム"として進化しました。これまでのバージョンで熟成した、安定したコア・アーキテクチャ、強力なテンプレート言語、安全なユーザー管理、柔軟なプラグイン拡張をベースに、ウェブサイト全体のコンテンツやデザイン、ユーザー管理を目的にあわせて柔軟にカスタマイズできるようになり、さらに更新しやすく、効果の高いウェブサイト構築・運営・管理が可能となります。

ウェブサイト管理の新標準、「Movable Type 5 」を発表しました

MT4ユーザー優待価格・MT3ユーザー優待価格も設定されているようです。プロフィールライセンスは、ユーザーライセンスに統合、ユーザー数無制限の『サーバーライセンス』 (1サーバー・無制限ユーザー　12万6,000円／税込)が新設されたことにより多くのユーザーで利用可能になったようです。

期待します！

本日より Movable Type 4.261 の出荷を開始致します。Movable Type 4.261 は、Movable Type 4.26 で発見されたいくつかの問題を修正したバージョンです。Movable Type 4.26 でのセキュリティ修正も含みますので、Movable Type 4.26 より前のバージョンをお使いの場合は、アップデートを推奨します。

• アップデートスクリプトが動作しなかった問題
• スケジュールタスク実行時に処理は実行されるが、エラーの出力される問題

早速アップグレード

「マルチブログのタグクラウドでエラー発生？」でも記事をエントリーしてるが、4.25から複数のブログをinclude_blogsで串刺しにした場合の検索結果で利用するテンプレートが変わっているようだ。

4.24まではdefault.tmplで検索結果表示だったものが、それぞれのブログの「検索結果のテンプレート」で表示される。

K君が作成したサイトはMovable Type 4.25を飛ばしてMovable Type 4.26に期待していたので、4.26にしてみると<MTTags include_blogs="all">で「不正な要求です」は表示されないが「テンプレートモジュールがない」エラー発生。それぞれのブログに「検索結果のテンプレート」を作成したので問題はなくなったが、サイドバーの構成の見直しを残したままだ。

昨日（6月12日）Movable Type 4.26がリリースされました。

Movable Type 4.26 の出荷を開始します

本日より Movable Type 4.26 の出荷を開始致します。Movable Type 4.26 では、多くのバグフィクスと、mt-wizerd.cgi において発見されたクロスサイトスクリプティングの脆弱性対応行っています。本バージョンは脆弱性の修正も含まれておりますので、アップデートを推奨します。

Movable Type 4.26 の出荷を開始します

小粋空間さんでも書かれていますが、アップグレード時にプラグインを新しいアプリケーションディレクトリへアップロードすることをお忘れなく。

テンプレートセットも同様です。

アップロードを忘れるとダッシュボードの「システムテンプレート｣がなくなったり、テンプレートの初期化ができなくなってしまいます。

お忘れなく...

メインページとCSSのみ完成しました。次回リリースのMT4.2用テンプレート656はこんな感じです。

3カラム・980pxの大胆なレイアウトです。作業途中なので、表示していませんが、メインページにはおススメの2記事を表示、サイドバーにはフリースペースを設けています。

5月24日：656テンプレートリリースしました。

桜のシーズンなので、K君が作ったサイトを見に行ってみた。タグクラウドをクリックすると「不正な要求です」と表示された。

先日このサイトはMovable Type 4.25にアップグレードしており、タグクラウドの部分も以下のような記述で3つのブログを串刺しにしていた。

<MTTags include_blogs="all">

include_blogs="1,2,3"の様にコンマ区切りだとうまく動作するが、defaultテンプレートでの表示ではなかったのでレイアウトに問題発生。

Movable Type 4.24までは正しく動作していたので、どうもおかしい。未だ解決しておらず、とりあえずMovable Type 4.24にダウングレード。

どうしたものか...

3月27日追記

タイトルが「マルチドメイン...」となっておりました。「マルチブログのタグクラウドでエラー発生？」に変更しました。

シックスアパートより回答を頂きました。

ご報告いただいた現象について、再現することを確認いたしました。
バグデータベースに登録の上、修正を検討いたします。

メインページのCSSのみ完成しました。次回リリースのMT4.2用テンプレート647はこんな感じです。

来週は構築案件の制作を開始しますので、リリース日は未定です。

3月16日追記：少しアレンジしてリリースしました。

Movable Type 4.25 RC3 の提供を開始

Movable Type 4.25 では、様々なバグフィクス、セキュリティ強化に加え、モーションブログを作成するためのテンプレートセットや、それに関する新機能を追加。また、プラグインとして提供されていたアクションストリーム機能を強化してバンドルしています。

モーションブログではテキストやリンクだけではなく、画像やムービー、オーディオなどのコンテンツも簡単に公開、表示を行えます。また、アクションストリーム機能では Twitter や Flickr, Youtube などでのアクティビティや、ブログ内でのアクティビティ集めたライフストリームを作成できます。

Movable Type 4.25 RC3 の提供を開始

早速、インストールしてみた。

モーションブログの使い方が、よくわからないので、Twitterで嘆いてみら、Dakinyさんから色々と教えていただいた。（ご面倒をおかけしました）

本日、MovableType 4.2 無料テンプレート 2Column、及び有料テンプレートの検索フォームにおいて検索結果のページが分割されない問題を発見しました。
＊タグ検索の場合には問題はありません。

サイドバー又はバナーヘッダーの検索フォームに以下の1行を追加いただくようお願いいたします。

<input type="hidden" name="limit" value="<$mt:SearchMaxResults$>" />

修正前の記述例

<form method="get" action="<$MTCGIPath$><$MTSearchScript$>">
<input type="hidden" name="IncludeBlogs" value="<$MTBlogID$>" />
<label for="search" accesskey="7">このサイトの検索</label>
<input id="search" name="search" size="15" value="" tabindex="8" />
<input type="submit" value="Search" tabindex="9" accesskey="z" />
</form>

修正後の記述例

<form method="get" action="<$MTCGIPath$><$MTSearchScript$>">
<input type="hidden" name="IncludeBlogs" value="<$MTBlogID$>" />
<input type="hidden" name="limit" value="<$mt:SearchMaxResults$>" />
<label for="search" accesskey="7">このサイトの検索</label>
<input id="search" name="search" size="15" value="" tabindex="8" />
<input type="submit" value="Search" tabindex="9" accesskey="z" />
</form>

無料テンプレートにつきましては、すでに修正したテンプレート一式の圧縮ファイルをアップロードしました。差し替えてご利用くださいますようお願いいたします。

カスタマイズはどうしよう？重要な覚書。

「プロフィール」ページはmt-cp.cgiによって動的に生成される。「プロフィール」のテンプレートは「グローバルテンプレート」の「システムテンプレート」にある。

「グローバルテンプレート」と同名のブログのテンプレートがある場合ブログのテンプレートを呼び出すが、ブログのテンプレートには新しい「システムテンプレート」は作成できない。

このため、コミュニティ掲示板を違った内容（デザイン・構成）で作成したい場合に各々の「プロフィール」のページを個別にカスタマイズすることは不可能ではないか？

カスタマイズ前の覚書

トップレベルカテゴリにはトピックを作成しない。

コミュニティに参加登録したユーザーはサブカテゴリにトピックを作成できるがトップレベルカテゴリにはトピックを作成できない。また、管理人などのユーザーがトップレベルカテゴリにトピックを作成してもアーカイブには表示されない。

そろそろ掛からなきゃ、カスタマイズ！テンプレート構造の覚書

アーカイブインデックス

ブログ記事リスト

ブログ記事

またまた続くはず…

カスタマイズする前に！テンプレート構造の覚書

メインページ

次回に続くはず…

株式会社ベイリーフ様がKnowledge Base Templatesetをリリースされました。

Movable Typeで作るナレッジベースシステム、『Knoeledge Base Templateset』を発表

QUICK CARTのFAQに利用してあるものと同じようだ。2週間ほど前にQUICK CARTを確認中に初めてFAQを見た時にはうまく動かなかったが、その直後からページ遷移もなく非常にスムースに閲覧できた。

面白いテンプレートだし気になっていたところ、Movable Typeプロフェッショナル・スタイルでご一緒した株式会社ベイリーフの森様より献プラグイン（？）していただいたので早速インストールしてみた。

これからどのように利用しましょうか...

Movable Type4.2では検索結果のページ分割ができますが、検索結果が1ページだけの場合にもページ数が表示されてしまいます。

MTTotalPagesを利用して不要な"1"という数字を表示しないようにしてみた。

検索結果がない場合もページは生成されるのでページ数に0や負はあり得ない。そこでページ総数が1ページではない場合に表示すればよいので、<MTUnless name="foo" eq="1">を使います。

<MTSetVarBlock name="Seach_Count"><$MTTotalPages$></MTSetVarBlock>
<MTUnless name="Seach_Count" eq="1">
検索結果のページ分割部分
</MTUnless>

デフォルトテンプレートでは（MovableType 4.2 無料テンプレート 2Columnも全く同じ）以下のような記述です。

<MTSetVarBlock name="Seach_Count"><$MTTotalPages$></MTSetVarBlock>
<MTUnless name="Seach_Count" eq="1">
<div class="content-nav">
<mt:IfPreviousResults><a href="<$mt:PreviousLink$>" rel="prev" onclick="return swapContent(-1);">&lt; 前</a>&nbsp;&nbsp;</mt:IfPreviousResults><mt:PagerBlock><mt:IfCurrentPage><$mt:Var name="__value__"$><mt:Else><a href="<$mt:PagerLink$>"><$mt:Var name="__value__"$></a></mt:IfCurrentPage><mt:Unless name="__last__">&nbsp;</mt:Unless></mt:PagerBlock><mt:IfMoreResults>&nbsp;&nbsp;<a href="<$mt:NextLink$>" rel="next" onclick="return swapContent();">次 &gt;</a></mt:IfMoreResults>
</div>
</MTUnless>

お試しあれ

本日、MovableType 4.1 無料テンプレート 2Column、MovableType 4 無料テンプレート 2Column及び有料テンプレートのコメントフォームにおいてInternet Explorer7をご利用の場合にCaptchaが表示されない問題が発見されました。

お手数でございますが、「コメント入力フォーム」モジュールの48行目付近を以下のように修正をお願いいたします。

【修正前】

<p id="comments-open-captcha">
</p>

【修正後】

<div id="comments-open-captcha">
</div>

無料テンプレートにつきましては、すでに修正したテンプレート一式の圧縮ファイルをアップロードしました。差し替えてご利用くださいますようお願いいたします。

お待たせしました！MovableType4.2専用の2カラムのテンプレートをリリースいたしました。

テンプレートのNO.が前後しますが、まずは522テンプレートと同じデザインの622テンプレート。

MovableType 4.2用テンプレート一覧

よろしくお願いいたします。

昨日、半日ぽっかりと空いたので522テンプレートを使ってMovable Type 4.2用テンプレートを作成してみた。未だ完成しておりませんが、こんな感じです。見た目は522と全く同じ。

現在、継続して作業ができません。リリースまでしばらくお待ちください。

おまたせしました!本日 Movable Type の最新版、バージョン 4.2 のをリリースしました。コミュニティから寄せられたアイデアやソースコード、ユーザーからのフィードバック、そして、素晴しいチームが生んだ Movable Type 4.2 は、これまでよりも速く、安全です。また、今回のバージョンアップでは、様々な機能を追加しました。

Movable Type 4.2 出荷開始