【MarsEdit】LightBox風プラグインで大きなサイズの画像を表示する方法

せっかくLightBox風プラグインを使っているのに、「MarsEdit」で記事を編集すると写真の拡大表示をしてくれない、というジレンマがありました。

調べてみると、解決方法があったので参考にして設定しました。

設定方法

「Edit Settings」を起動

設定したいブログの上で右クリックでコンテキストメニューを表示。
そこから「Edit Settings」を選択します。


イメージのサイズ設定を変更

「Image Size」の項目を「Defaults To Full Size」にします。
これで登録した写真のサイズを変更しないようにできます。


記事作成で「Media」を選択

記事を作成するときのウィンドウで「Media」を選択します。


「Media」の「Style」をカスタム

写真をどれか選び、右下にある「Style」メニューから「customize」を選択します。


テンプレートを追加

「Media Markup Templates」で下にある「+」ボタンを押します。


テンプレートを編集

テンプレート編集画面で「Opening Markup」の部分に以下を入力します。
widthの「hoge」の部分は好きに設定できます。「500」とか「600」とか記事の幅を設定するなどしましょう。

「Name」はテンプレート名なのでお好みで。

これでLightBox風プラグインの効果が最大限に引き出せるし、
「MarsEdit」も思う存分使えます♪

注意点「元画像の大きさをほどほどに」

注意することとしては、元の画像の大きさを大きすぎないようにすること。
その画像のサイズがそのまま表示されてしまいます！

それに画像のデータ量も大きくなりますので、ブログ記事の表示速度が低下します。特にモバイルのときなんかが。サーバーの容量も圧迫されますよ。

▼参考にさせていただきました。