[Marsedit] ドラッグ&ドロップでリンク付きの画像を挿入する方法 

ブログ作成を快適に、効率よく進める便利アプリ、それがMarseditです。

MarsEdit – the blog editor for WordPress, Tumblr, Blogger and more.
カテゴリ: ソーシャルネットワーキング
現在の価格: ¥4,000

 

でも、カスタマイズしないといくつか使いにくい部分もあったりします。
その一つが画像挿入の際。挿入自体はドラッグ&ドロップで簡単にできるのですが、そのままアップするとリンクが貼られていない状態でアップされてしまいます。

このままだと、画像をクリックしてもなんのアクションもなし……
かといってWordPressの管理画面から再度エディットするのも効率が悪いですよね。
ということで、今回はMarseditのドラッグ&ドロップだけで画像リンクを挿入する方法を紹介します。

いくつかの設定を変更する

Marseditで画像を挿入する時には、「Media Manager」を起動(command+2キーで呼び出し可能)して、挿入する画像を選択します。任意の場所のドラッグ&ドロップすると、Upload Utility(挿入画面)が表示されます。

 

25

この時、「Style」の部分がデフォルトでは「Unaligned」になっています。他のプルダウンを選択しても、センター寄せか左寄せなどを選択できるだけで、画像リンクをはれる項目はありません。

ですので、この部分をカスタマイズします。

「Style」のプルダウン表示を出して、一番下の「Customize」を選択します。
新規のウィンドウが表示されるので、さらに一番下の「+」ボタンをクリックすると、

26

「Media Markup Templates」と表示されたフィードが表示されます。
ここの上段「Opening Markup」の部分に以下のソースを選択して貼り付けてください。

 

<a href="#fileurl#" title="#alttext#"><img src="#fileurl#" alt="#alttext#" title="#displayname#" width="700" height="auto" /></a>

 

この中で、「width=”○○”」の部分(今は例として700)が挿入する幅になりますので、ブログのデザインに合わせて変化させてください。例えば、700px、500px、350pxと別々の設定を入れておくと、後からプルダウンから選択するだけなので便利だと思います。高さは、幅に合わせて自動で変化するようにしています。

ちなみに、「alt=”○○”」は画像にマウスを乗せた時に表示される表示で任意のコメントを記載可能です。#で囲まれているのは、自動で画像の名前が入るようになっています。その後の「title」と合わせて、特に必要がないようなら消してしまっても問題ありません。

バリエーション
<a href="#fileurl#" title="#alttext#"><img src="#fileurl#" alt="#alttext#" title="#displayname#" width="500" height="auto" /></a>

幅500px、高さ自動変化バージョン

 

<a href="#fileurl#" title="#alttext#"><img src="#fileurl#" alt="#alttext#" title="#displayname#" width="350" height="auto" /></a>

幅350px、高さ自動変化バージョン

 

<img src="#fileurl#"  width="700" height="auto" />

幅700px、リンク無し、ポインタを乗せた時やタイトルの表示なしバージョン(画像が貼り付けられるだけ)

任意の名前を付けて保存

ソースを貼り付けたら、後からわかりやすいように任意の名前を付けて「OK」ボタンをクリックして保存します。次回から、画像をドラッグ&ドロップする際に、この「Style」のプルダウンから好みの幅を選択するだけです。

ちなみにボクの設定はこんな感じにしています。

27

自分でわかりやすいように名前を付けましょう。

さあ、これで終了です。
効率がまたまたさらにUPしたと思います。
これでWordPressの管理画面を開くことがまた少なくなりましたね。
少なくなったということは、サーバーにアクセスすることが無くなる=時間の短縮・サーバーの負担軽減ということで、いいことずくめです。

次回は、MarseditからSEO管理できるようにカスタマイズしてみます。

 

MarsEdit – the blog editor for WordPress, Tumblr, Blogger and more.
カテゴリ: ソーシャルネットワーキング
現在の価格: ¥4,000
Pocket
LINEで送る

1 Response

  1. Johne182 より:

    You have an incredibly nice layout for your blog, i want it to utilize on my site also . bagfeegbefkd

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>