WordPressにおけるメディア(写真・動画)の追加方法

メディアの追加方法

前回までで、投稿や固定ページの追加方法について解説してきました。写真や動画などのメディアを追加する場面もありましたが、今回はこの点について少しだけ深掘りしていければと思います。メディアの使い方や注意点についてまとめました。

メディアを追加する

ところで、そもそもメディアって何なのでしょうか?なんだか難しそうに聞こえますが、写真とかバナーなどの画像のことです。WordPressでは画像のことをメディアと呼んでいるので、本稿でもそれに倣って画像のことをメディアと呼んでいきたいと思います。

追加する方法

メディアを追加する方法について復習しておきましょう。2つの方法がありますが、せっかくなので両方ご説明しましょう。

記事投稿から追加する

本連載の第8回の記事でご紹介した方法です。記事投稿の編集ページをひらいたら、本文入力欄の上にある「メディアを追加」をクリックします。

「メディアの追加」を選択する

メディアを追加するダイアログが表示されるので、クリックして選択。右下の「投稿に挿入」ボタンを押します。

写真をドラッグアンドドロップする

これで画像の追加が完了です。

本文に画像が追加された

ライブラリから追加する

ちょっと背伸びをして、いままで解説してこなかった方法をご紹介します。本連載では初めて紹介する機能ですが、メディアの管理もし易くなります。おすすめです。

WordPressの管理画面をひらいたら、画面左側の「メディア」にある「ライブラリ」をクリックしてみてください。

ライブラリをクリックする

ライブラリが表示されました。

ライブラリ

HPで使っているメディアが一覧で表示されていますね。画面の上の方に「新規追加」ボタンがあるので、押してみましょう。

ドラッグしてメディアを追加する

ここからファイルを指定、もしくはドラッグアンドドロップすることでもメディアの追加ができます。

メディアを追加する時の注意点

メディアを追加する時の注意が一つあります。画像のファイルサイズです。キレイな画像は、それだけファイルサイズも大きくなってしまいます。画像のファイルサイズが大きいと、HPの表示に時間がかかるようになってしまうんです。

例えばiPhoneで撮った写真をアップロードするとしましょう。iPhoneのカメラはとても性能が良いので、写真のファイルサイズも大きいです。4MB(メガバイト)くらいはあります。さきほど追加した画像は30KBくらいでした。MBはKBの1000倍ですから、ちょっとこれではファイルサイズが大きすぎますね。

iPhoneで撮った写真を追加する時には、ファイルサイズを小さくしてくれるソフトを使うといいでしょう。

ファイルサイズを小さくできるソフト

ImageOptim

ImageOptim

Mac用のソフトです。ドラッグアンドドロップをするだけで、画像のサイズを小さくしてくれます。無料です。

ImageOptim

Caesium

Windows用のソフトです。Exifなどの写真情報も一緒に削除してくれます。無料です。

Caesium

メディアを編集する

今度は、追加した画像の編集をしてみましょう。さきほど出てきたライブラリ画面をひらいて、編集をする画像をクリック。ダイアログが表示されますので、左側の「画像を編集」をクリックしてください。

「画像を編集」をクリックする

画像の編集画面が表示されました。

画像の編集画面

この画面から、画像の編集を行っていきます。

縮尺の変更

画像の縮尺を変更してみましょう。

右上の方に、「画像縮尺の変更」が表示されていますね。

「画像縮尺の変更」エリア

ここの数字を変更すると、画像の縮尺を変更することができます。さきほどの画像は、サイズが570×380でした。横幅を「450」に書きかえて「縮尺変更」をクリックします。

縮尺を変更する

画像の縮尺が450×300に変更されました。変更したのは横幅なのですが、それに合わせて高さも自動で変更してくれています。

切り取り

次は、切り取りです。切り取りたい部分をドラッグしてください。

切り取る部分をドラッグ

編集画面の左上にある切り取りマークをクリックします。

切り取りを実行

これで切り取りが完了です。

ギャラリーを追加する方法

WordPressには、ギャラリーという機能があります。画像をまとめて表示する機能なのですが、投稿や固定ページで複数の画像を載せたい時にとても便利です。

投稿の編集画面で、本文の上にある「メディアを追加」をクリックしてください。

「メディアの追加」を選択する

ダイアログの左上にある、「ギャラリーを作成」タブを選択します。

「ギャラリーを作成」タブを選択

ギャラリーにする画像をクリックしてから、右下の「ギャラリーを作成」ボタンを押します。

「ギャラリーを作成」ボタンを押す

画像の設定や順序、キャプションを指定して、右下の「ギャラリーを挿入」ボタンを押してください。

「ギャラリーを挿入」ボタンを押す

本文にギャラリーが挿入されました。

ギャラリーが挿入された。

あとがき

次回はユーザーの管理方法です。運用を効率化してくれるだけでなく、HPを安全に使っていくことにもつながります。

事業用 #WordPress サイトをプロと3時間で作るワークショップ vol.15

毎回大人気のワークショップ、次回は10/21(土)14時に開催が決定しました。デザインも集客も妥協しないホームページを私たちとつくりましょう。

ファーストビュースタイル

コーナースタイル

カラー

※製品版では自由に配色を選べます

ヘッダー表示