2011年9月20日

Movable Typeで携帯サイト向けに画像を縮小表示する「ImageSizeModifierプラグイン」

Movable Typeで携帯サイト向けに画像を縮小する「ImageSizeModifierプラグイン」を公開します。

1.目的

スマホサイト向けのページは「jQueryでスマホサイト向けに画像サイズを縮小する方法」で紹介した通り、jQueryで画像サイズの変更が可能ですが、携帯サイトではJavaScriptが使えないキャリアがあるため、再構築によるページ出力時にimg要素のwidth属性を書き換えて、画像を縮小表示します。

変更可能なimg要素の属性は、次のルールで並んでいる必要があります。

  • src属性の後方にwidth属性・height属性あること
  • width属性・height属性の順序は不定。ただし属性間に別の属性が含まれないこと
  • alt属性はimg要素の直後かsrc属性の直後のみ許容
  • width属性またはheight属性の前のclass属性・style属性は許容。ただしclass属性・style属性の順に並んでいること
  • width属性・height属性の後方の属性は何でも許容

下は上記ルールを許容する例です。

<img src="..." width="..." height="..."
<img alt="..." src="..." width="..." height="..." 
<img src="..." alt="..." height="..." width="..."
<img alt="..." src="..." class="..." style="..." height="..." width="..."
<img alt="..." src="..." width="..." height="..."  class="..." style="..."

MTのデフォルト機能を使って記事に挿入した画像のimg要素が縮小されることは、バージョン5.12で確認しています。

すいませんが携帯サイトでの表示は未確認です。

2.機能

  • ブログ記事に記述されているimg要素のwidth属性値・height属性値について、ページ再構築時にプラグインで指定したサイズに変換します。
  • 画像サイズを変更するテンプレートをプラグインで指定できます。

3.価格

  • 個人無償版/有償版での非商用利用/Movable Type Open Source:無償
  • 有償版での商用利用:1050円/1サーバ(事前に動作確認してください)

無償でご利用の場合も、プラグインのご利用についてご支援・ご賛同くださる方からの寄付をお待ち申し上げます。

4.プラグインのダウンロード

下記のリンクからプラグインアーカイブをダウンロードし、任意のフォルダに保存してください。

修正履歴

2011.09.20 初版
ImageSizeModifier_0_01.zip(MT4.x/MT5.0x/MT5.1x対応)

5.プラグインのインストール

プラグインアーカイブを解凍し、pluginsフォルダ配下にあるImageSizeModifierフォルダをpluginsディレクトリにアップロードしてください。

管理画面の「システム」→「プラグイン」でプラグイン設定画面を表示し、「ImageSizeModifier」が表示されればOKです。

プラグイン設定画面

6.プラグインの設定

プラグインを利用したいウェブサイトまたはブログ管理画面の「ツール」→「プラグイン」→「ImageSizeModifier」→「設定」でプラグイン設定画面を表示し、次の項目を設定します。

  • テンプレートID:画像の幅を変更するテンプレートID。複数ある場合はカンマで区切る(カンマ前後の半角スペースは許容)
  • 画像の幅:img要素のwidth属性に設定したい値。height属性値は比率を保った値を自動設定します

プラグイン設定画面

7.注意事項

このプラグインは、出力するページに含まれるすべてのimg要素に対して適用します。適用対象にしたくないimg要素は、1項に掲載している属性の並び順を変更してください。

また、変換後にはimg要素のsrc属性・width属性・height属性以外の属性は削除されます。

Comments [0] | Trackbacks [0]
2011年9月 8日

Movable Type 5のテンプレート編集画面でタブ文字が入力できる「TextareaTabEnablerプラグイン」

Movable Type 5のテンプレート編集画面でタブ文字が入力できる「TextareaTabEnablerプラグイン」を公開します。このプラグインはMT5.0/MT5.1で動作します。

1.機能

Movable Typeのテンプレート編集画面でタブ文字が入力できます。

タブ文字挿入前のカーソル位置
タブ挿入前のカーソル位置

タブ文字挿入後のカーソル位置
タブ挿入後のカーソル位置

注:このプラグインを利用する場合、「InvalidateCodeMirrorプラグイン」と併用し、CodeMirrorを無効にしてください(CodeMirrorの切り替えボタンで無効にするだけでは、本プラグインは正常に動作しません)。

2.価格

  • 個人無償版/有償版での非商用利用/Movable Type Open Source:無償
  • 有償版での商用利用:1050円/1サーバ(事前に動作確認してください)

無償でご利用の場合も、プラグインのご利用についてご支援・ご賛同くださる方からの寄付をお待ち申し上げます。

3.プラグインのダウンロード

下記のリンクからプラグインアーカイブをダウンロードし、任意のフォルダに保存してください。

修正履歴

2011.09.08 初版
TextareaTabEnabler_0_10.zip(MT5.0x/MT5.1x対応)

4.プラグインのインストール

プラグインアーカイブを解凍し、pluginsフォルダ配下にあるTextareaTabEnablerフォルダをpluginsディレクトリにアップロードし、mt-static/pluginsフォルダ配下にあるTextareaTabEnablerフォルダをmt-static/pluginsディレクトリにアップロードしてください。

システム管理画面の「ツール」→「プラグイン」でプラグイン設定画面を表示し、「TextareaTabEnabler」が表示されればOKです。「InvalidateCodeMirror」も
同様にインストールしてください。

プラグイン一覧画面

テンプレート編集画面を開き、テキストエリアでタブ文字が入力できることと、入力した内容が保存できることを確認してください。

2011.09.15
4項の説明に誤りがありましたので修正しました。

Comments [0] | Trackbacks [0]
Now loading...
ギターに入った猫
IT転職は【Green】Web/インターネット業界の求人に強い転職サイト グリーン
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

Categories
Monthly Archives
2014年
2013年
2012年
2011年
2010年
2009年
2008年
2007年
2006年
2005年
2004年
2003年
BlogPeople
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
Powered by
Movable Type 5.12