WordPress初歩4-編集画面での画像編集-
はじめに
WordPressによるBlog記事編集中のメモ。
「編集画面での画像編集」の大まかな流れとしては下の通り。
記事編集および投稿は以下レンタルサーバーでのWordPress環境を使用。
シン・レンタルサーバー![](https://www16.a8.net/0.gif?a8mat=3T8P7I+7KOKM2+CO4+1HLFVM)
![](https://www19.a8.net/0.gif?a8mat=3T8P7I+7KOKM2+CO4+1HMIGH)
その他、環境整備に関する新情報。
同系列WordPress特化型レンタルサーバー
WordPress専用クラウド型レンタルサーバー『wpX Speed』![](https://www14.a8.net/0.gif?a8mat=3TCZ0D+AL1GPM+CO4+ZQFQA)
![](https://www18.a8.net/0.gif?a8mat=3TCZ0D+AL1GPM+CO4+ZRXQP)
同系列安定型レンタルサーバー
格安ドメイン名取得サービス『Xserverドメイン』![](https://www14.a8.net/0.gif?a8mat=3TCZ0D+ALMWBE+CO4+15OK2A)
![](https://www19.a8.net/0.gif?a8mat=3TCZ0D+ALMWBE+CO4+15WWZL)
その他キャンペーン中WordPress対応レンタルサーバー
ロリポップ公式サイト![](https://www17.a8.net/0.gif?a8mat=3TCZ0D+AM8BX6+348+64Z8Y)
![](https://www17.a8.net/0.gif?a8mat=3TCZ0D+AM8BX6+348+6E71D)
ドメイン管理に関しては
格安ドメイン名取得サービス『Xserverドメイン』![](https://www19.a8.net/0.gif?a8mat=3TCZ0D+ALMWBE+CO4+15OK2A)
![](https://www13.a8.net/0.gif?a8mat=3TCZ0D+ALMWBE+CO4+15WWZL)
![](https://www18.a8.net/0.gif?a8mat=3TCZ0D+ANF74Q+348+1C1W8I)
![](https://www14.a8.net/0.gif?a8mat=3TCZ0D+ANF74Q+348+1BRTKX)
![](https://www19.a8.net/0.gif?a8mat=3TCZ0D+AMTRIY+50+2HHVNM)
![](https://www17.a8.net/0.gif?a8mat=3TCZ0D+AMTRIY+50+2HTO1D)
各流れについては下画像を用いて以降に書いていく。
![使用画像](https://nemunori.com/wp-content/uploads/2023/05/kamiman.png)
WordPress初歩4-編集画面での画像編集-
ブロック選択
デザイン変更対象のブロックを選択するとブロック上と画面右にメニューが表示される。
![画像ブロック選択でメニュー表示](https://nemunori.com/wp-content/uploads/2023/05/wp_20230519editimage1_500_260.PNG.png)
切り抜き
上メニューから切り抜きを選択する。
![画像の切り抜き](https://nemunori.com/wp-content/uploads/2023/05/wp_20230519editimage2_500_377.PNG.png)
以下の編集が可能。
- 縦横比
- ズーム
- 回転
処理後の画像は新たな画像としてメディアライブラリに保存される。
縦横比
![画像の縦横比](https://nemunori.com/wp-content/uploads/2023/05/kamiman-edited.png)
枠からはみ出ている分は切られる。
ズーム
![画像のズーム](https://nemunori.com/wp-content/uploads/2023/05/kamiman-edited-3.png)
そのままの大きさで表示範囲を狭めるだけ。
拡大と勘違いしそうになるが大きくはならない。
回転
![画像の回転](https://nemunori.com/wp-content/uploads/2023/05/kamiman-edited-4.png)
![画像の回転](https://nemunori.com/wp-content/uploads/2023/05/kamiman-edited-5.png)
![画像の回転](https://nemunori.com/wp-content/uploads/2023/05/kamiman-edited-6.png)
90度区切りで回転可。
デュオトーンフィルター
上メニューからデュオトーンフィルターを選択し以下を行う。
- 影(暗い部分の色)の設定
- ハイライト(明るい部分の色)の設定
![](https://nemunori.com/wp-content/uploads/2023/05/wp_20230519editimage3_500_482.png)
白黒にすると所謂モノトーン。
サイズ
フルサイズとサムネイルサイズがある。
![サムネイルサイズ](https://nemunori.com/wp-content/uploads/2023/05/kamiman-150x150.png)
ちょっと小さくなる程度。
何か意味があるかもしれない。
寸法
以下のやり方で画像の大きさを変えられる。
- 比率選択
- 数値入力
- 画像回りの〇をドラッグ
![画像の寸法変更](https://nemunori.com/wp-content/uploads/2023/05/kamiman-150x150.png)
比率かドラッグでの変更が楽。
画像上にテキスト
![画像上にテキスト](https://nemunori.com/wp-content/uploads/2023/05/kamiman-150x150.png)
画像:画像上にテキスト
背景画像のようにも使える。
まとめ
WordPress編集画面内で、画像の大きさや色トーンの調整が可能。
繊細な画像編集機能では無い分、ラフな感覚で記事やページに画像を合わせる事ができ、雑なニートと相性が良い。
細かく作り込む場合はWordPressでの画像編集に拘らず、画像アプリを使ったほうが速い。
よろしく。