メイン

TOP > MTのプラグイン活用

MTのプラグイン活用

ようやくMovableType6.0.3最新版にアップグレードしました

メインPCもXPサポート終了の前日にWindows7に対応。
マルチブートとして空けておいた領域にWin7をインストール。
ようやく新OSにも慣れてきたところ。

そして当方サイト、MT3.3.5からようやく最新版Ver6.0.3にバージョンアップしました。

とは言っても、管理ページこそ変わったもののWebページはなんら変わりません。

今後、最新版テンプレートに対応、すなわちレスポンシブ対応デザインに変更する予定です。
またその過程などもお知らせできればと考えています。

MT3からMT6のアップグレードは稀だと思いますが、備忘録として簡単に記録しておきます。


続きを読む "ようやくMovableType6.0.3最新版にアップグレードしました" »

MTのレスポンシブデザインテンプレートの「カテゴリ別記事リスト」は動的ページ分割をする

MovableTypeのレスポンシブデザイン対応のテンプレート「Rainier」と「Eiger」、
このテンプレートのアーカイブテンプレート「カテゴリ別ブログ記事リスト」は、標準でページ分割をする。

検索やタグで使われている「mt-search.cgi」を使った動的ページ分割である。
ちなみに動的分割ページURLはとても長い。

具体的には、
・1ページ目:静的ページ アーカイブマッピングパスのURLが出力される。
通常URLは、category/sub-category/index.htmlもしくはcategory/sub_category/index.html

・2ページ目:動的ページ
hogehoge.com/mt/mt-search.cgi?IncludeBlogs=x&template_id=xx&limit=10&archive_type=Category&category=xx&page=2

・3ページ以降は、末尾URLのpage=3となり、以降ページ数に置き換わる。

ページナビゲーションは、記事下方に以下のようなリンクが表示される。

プラグインにより「カテゴリ別アーカイブページ」のページ送りナビゲーション

このURL出力は、テンプレートの開始12行にに書かれている。

続きを読む "MTのレスポンシブデザインテンプレートの「カテゴリ別記事リスト」は動的ページ分割をする" »

MT5.2で採用されたリッチテキストエディタTinyMCEで、テーブル(表組み)ボタンを拡張プラグインで追加する

plugin-fckeditor01.jpg

MovableType5.2では、リッチテキストエディタにTinyMCEが採用され、ようやく文字などの装飾関連が充実した。

とはいえ、文字色・背景色などの指定ができるようになったが、テーブル関連を指定するアイコンが存在しない。

ユーザにとって、以前から表組みをしたいという要望、例えば、

・画像を2列、3列で表示したい
・比較表を作成して分かりやすい説明を行いたい

など、使用シーンは多い。

これを実現させるには、拡張プラグインを追加する。
追加ではなくてデフォルトで採用して欲しかった機能である。
(なぜ、標準で搭載しなかったのか甚だ疑問だ)

続きを読む "MT5.2で採用されたリッチテキストエディタTinyMCEで、テーブル(表組み)ボタンを拡張プラグインで追加する" »

MT4のエントリー数のループ限界値「MTEntries」の続報・MT4のエラーメッセージ:「Can't call method "execute" on an undefined value ・・・」の対策の一案その2

MT4.22のエラーメッセージ

ブログ記事が2,000件を越えたため、再びMTでエラーが発生。

過去記事で、MT4の記事数が1000件を越えた場合のエラーの対処法についての回避策を書いた。

参考「MT4のエラーメッセージ:「Can't call method "execute" on an undefined value ・・・」の対策の一案

1000件の記事を出力すると表題にあるように、
「Can't call method "execute" on an undefined value ・・・」のエラーが出力される。

続きを読む "MT4のエントリー数のループ限界値「MTEntries」の続報・MT4のエラーメッセージ:「Can't call method "execute" on an undefined value ・・・」の対策の一案その2" »

MT5.13のアップグレードは通常のFTPアップロードだけでなく指定されたテンプレートの初期化もお忘れなく!

MT5.13のアップグレードは、通常のアップグレード方法であるファイルの上書き(FTPアップロード)だけではなくテンプレートの初期化が必要だ。

この作業が必要な環境は、ブログのコメント認証、あるいはコミュニティ機能を利用している場合である。
(詳細:「5.13、5.07、4.38 へのアップグレード後に必要な作業」)

上記の条件に当てはまらなくても、念のため対応しておくほうが得策だ。

必須の作業は、以下の4点。

(1)JavaScriptテンプレートの初期化(必須)
(2)グローバルテンプレートの初期化(必須)
(3)コミュニティブログのテンプレート変更(必須)
(4)クラシックブログ(ウェブサイト)とPicoテーマのコメントプレビュー(必須)

しかし、コニュニティブログやコミュニティ掲示板を使用していない場合は、(1)と(4)のみになる。
MTOSの場合は、コニュニティブログやコミュニティ掲示板は作成できないので、必然的に(1)と(4)のみになる。

ちなみに、作成出来るウェブサイト、ブログの種類を確認するには、

ナビゲーション(左上MobableTypeロゴの下の▼メニュー)の[システム]>デザイン>テーマで確認できる。

MTOSの場合は、3種類

MTOSの利用可能なテーマ

続きを読む "MT5.13のアップグレードは通常のFTPアップロードだけでなく指定されたテンプレートの初期化もお忘れなく!" »

MT5.13へのアップグレードでIE9環境での管理画面の不具合がようやく改善される(デスクトップ動画あり)

mt5.13のブラウザ環境(Movabetype.jpより抜粋)
2012年2月にリリースされた最新版MT5.13では、ようやくIE9に対応した。

セキュリティアップデートということではあるが、やはりIE9対応という新機能は朗報だ。

これまでMovableTypeの管理画面の操作とブラウザとの相性が問題となる不具合が多くなってきていたところ
IE9+MT5.12以前の組み合わせが多い。


確かにMovable Type.jpのMT5の「必要インストール環境と、ブラウザ動作環境」には、MT5.12以前の対象ブラウザにInternet Explorer 9は書かれていない。

続きを読む "MT5.13へのアップグレードでIE9環境での管理画面の不具合がようやく改善される(デスクトップ動画あり)" »

MT5とjQueryMobileでスマートフォン対応~その6Googleアナリティクス

jQueryMobileの画面遷移は、デフォルト設定ではAjax遷移しています。
Javascriptで画面が切り替わるので、普通にGoogleアナリティクスのトラッキングコードを設置していてもうまく機能しないので、正確なカウントができなくなります。

なので、通常のトラッキングコードをAjax遷移でも機能するように、コードに変更を加えます。

参考にしたサイトは、「jQuery MobileでGoogle Analyticsを使うために気をつけなければいけないこと

今回作成したスマホサイトは、jQueryMobileでのリンクはデフォルト設定をやめて、直リンクでのリンクが多かったのですが、一部リストの画面遷移はAjaxを利用しています。

直接読み込みの設定方法は、リンクタグには、rel="external"をつけてAJAX を使用せず、完全なページ読み込みを使用しています。

さて設定後は、Googleアナリティクスのデータは以下のように、Ajaxで遷移したURLも取得できています。
ドメイン/sp/以下が、スマートフォンサイトなので、

コンテンツ>サイトコンテンツ>ディレクトリで、/spの第2階層でのリストです。
「/&ui-page=0-1」などですね。

続きを読む "MT5とjQueryMobileでスマートフォン対応~その6Googleアナリティクス" »

MT5とjQueryMobileでスマートフォン対応~その5ブログ記事

ブログ記事を表示させるテンプレートです。

通常は1ブログ記事のタイトルと本文、続きの内容を表示します。

スマートフォン用のアレンジとして、

1.[続き]を「続きを読む」のバーを配置して、クリックすると以降の記事が下に表示される。
 jQuery Mobileの「Collapsible content markup」の機能

2.下部に、ナビゲーションボタン3つを配置
 次のブログ記事、前のブログ記事、HOME(TOPページ)
 前後に記事がない場合は、ボタンは配置しない

3.画像の縮小
 MTのファイルのアップロードでアップした写真をwidthで縮小する。

■作成するブログ記事

MTスマートフォン用ブログ記事ページ

続きを読む "MT5とjQueryMobileでスマートフォン対応~その5ブログ記事" »

MT5とjQueryMobileでスマートフォン対応~その4カテゴリ別ブログ記事リスト

カテゴリ別のブログ記事リストを表示させるテンプレートです。

通常はカテゴリ別のブログ記事のタイトルと本文を最新順に表示するテンプレートです。

これを、スマートフォン用にアレンジしています。

■作成するカテゴリ別ブログ記事リスト

スマートフォン用カテゴリ別ブログ記事リスト

左図:リストが5件以下の場合

右図:リストが6件以上の場合

最新5件のリスト(タイトル名)を表示、6件目以降は、「次のカテゴリリスト」として、これを押すと、下にそれ以降のリストが表示されます。

この6件目以降の「次のカテゴリリスト」は、jQuery Mobileの「Collapsible content markup」の機能を利用しています。

参考:jQuery Mobile>デモページ>Collapsible content markup

すべてのリストを読み込んでいますが、ブロックごとに表示をコントロールしています。
スマートフォン用のWikipediaのサイトに近い表示方法です。

これをMTタグのMTEntriesのモディファイアと、カテゴリリストのカウントでコントロールしています。

続きを読む "MT5とjQueryMobileでスマートフォン対応~その4カテゴリ別ブログ記事リスト" »

MT5とjQueryMobileでスマートフォン対応~その3スマートフォンページへの切り替え

前回の項で、スマートフォン用のトップページが生成されました。
しかし、スマートフォン用のトップページのURLは、正確には「http://ドメイン/sp」

http://ドメイン/ にアクセスすると、アクセス媒体を認識して、スマートフォン用のトップページに切り替える仕掛けになっています。

■スマートフォンでドメインにアクセス

スマートフォンページへの切り替えメニュー
スマートフォンと判断して、メッセージウィンドウが表示されます。

「このサイト「(サイト・ブログ名)」にはスマートフォン用のサイトがあります。 表示しますか?」

 OK→スマートフォン用トップページ、URLを「http://ドメイン/sp」に移動
 キャンセル→PC用のトップページ

が表示されます。

上記の振り分けを行うために、インデックステンプレートのメインページにコードを追加します。

■テンプレートの設定

インデックステンプレート>「メインページ」テンプレートに以下のコードを追加

<head>部に追加します。
今回はiPadは、PCとして認識させるのでiPadでアクセスした場合は、メッセージウィンドウは出ません。


1:  <script type="text/javascript">
2: if (document.referrer.indexOf('sp-sample.com') == -1 &&
  ((navigator.userAgent.indexOf('iPhone') > 0 &&
  navigator.userAgent.indexOf('iPad') == -1) || 
  navigator.userAgent.indexOf('iPod') > 0 || 
  navigator.userAgent.indexOf('Android') > 0)) {
3:   if(confirm('このサイト「サイト・ブログ名」にはスマートフォン用のサイトがあります。\n表示しますか?')) {
4:          location.href = 'http://sp-sample.com/sp/';
5:      }
6:  }
7:  </script>

保存と再構築を行うと完了です。

PCとスマートフォンの切り替えページを判断する方法は、

・PHPによる振り分け
・.htaccesに設定

などの方法があります。

今回は、MTのスタティックページ(HTMLページ)、管理ページのみで行える方法を利用しています。
用途に応じて使いわけを行いましょう。

Powered by FeedBurner

RSS2.0

タスクマザー(taskmother)
  中野 治美

〒921-8836
  石川県野々市市末松町3-570
     i-BIRD 214(S-1)

TEL・FAX:076-236-2084