WordPressで画像を綺麗に貼付ける方法

20170414B

こんにちは!
週末は久々関西に遠征してきました。
久々の友達と遊べてインファクトの京都オフィスにも行けてとても充実しました。
地方に行っても会ってくれる友達がいるので一人旅も楽しいです

今回は画像の貼付けやリンクについて説明していきたいと思います。
画像によってブログの印象も変わってきますので注意して画像を準備するようにしましょう。
※こちらの記事は2014年7月30日に公開したものを最新の情報に変更しアップいたしました。

画像の準備

使用する画像は見やすいように幅600pxで作成しています。
アイキャッチの画像は600×400pxで統一します。
これはOGPを意識したものになります。
詳しくはこちらの記事をご覧ください!

ソーシャルメディア・SNSに欠かせないOGP設定ちゃんとやってますか?

600px以上の画像は縮小して表示させるのでこの後紹介していきます。

またできればファイル名を気をつけて設定しましょう。
英数字で分かりやすいものにすることで、画像検索にひっかかりやすくなります。

画像の貼付けについて

簡単な基本操作からいきます。
画像の貼付けはまずツールバーの上のメディアを追加をクリックします。
20170414b01
ファイルをアップロードというタブをクリックし、アップロードするファイルを選択又は画面上にドロップします。
20170414b02

アップロードすると右下にこのような項目が出てきます。
wpsg03
基本的にフルサイズ(元の画像サイズそのまま)で挿入します。
wpsg04
クリックすると大きい画像は小さく記事内に挿入することができますが画像をかなり小さく挿入したい時以外使いません。
ここでサイズを変えてしまうと画像サイズが自動で変わってしまいぼやけたり、くずれてしまう可能性がありますのでフルサイズで挿入するようにして下さい。
サイズを確認して投稿に挿入ボタンを押せば完了です。
20170414b03

表示画像のサイズを変更する

画像が大きいので小さく表示するよう設定します。

画像をクリックすると左上に画像を編集マークが出てくるので鉛筆のアイコンをクリックします。
隣にあるアイコンをクリックすると画像を削除できます。
20170414b04

画像の編集画面が出てきます。
サイズの部分のタブを開きます。
20170414b05

カスタムサイズを選択します。
20170414b06

サイズの設定をする画面が出てきます。
20170414b07

サイズを修正します。
左右の比率はそのままになるので幅を600pxに修正します。
20170414b08

設定したら「更新」をクリックします。
20170414b09

小さく表示されるようになりました。
20170414b10


表示は小さくなりましたが、元の画像はそのままなので大きい画像は重いままです。
ページを早く表示させたい場合は元の画像を小さくしてからアップするようにしましょう。

 

画像を新しいウィンドウで開く

記事に貼付けた画像を新しいウィンドウで開く方法です。

画像の編集アイコンをクリックします。
20170414b11

画像のリンク先を「メディアファイル」に設定して更新して完了です。
20170414b12
逆にリンクを繋げたくないという方は画像をクリックしツールバーのリンクを外すボタンを押せばリンクが外れます。
20170414b13
逆にリンクを繋げたくないという方は画像をクリックしツールバーのリンクを外すボタンを押せばリンクが外れます。
他のサイトに繋げたい場合もリンクボタンは使えるので色々試してみてください。

おわりに

大きい画像を入れても画像は重いままですのでなるべく画像を軽くしてアップするように心掛けましょう。
またフルサイズで画像を貼付けることで綺麗に貼付けできます。
選択する際に「中」等のサイズにすると劣化した画像が貼付けられてしまう場合もあるので気をつけましょう。

  • シェア
  • twitter
The following two tabs change content below.
名畑かなえ
株式会社インファクトのディレクターです。
フロントエンジニアだった知識を活かしてお客様のためになるような情報発信、制作を行なっております。また日本だけでなくベトナムスタッフとも連携して業務をとりまとめております。
好きなことは、自分で1から考えるものづくり。本の装丁が気になったり布ものやお菓子を自分でデザインして注文するのが好きです。
やっぱりはちみつなしでは生きてゆけない。
  • twitter
  • このエントリーをはてなブックマークに追加
  • Pocket
PAGE TOP
LINE it!