今回はwordpress.comのブログ記事に
画像を追加する方法をご案内します．
手を動かしながら作業していきますので
直感的にご理解いただけると思います．
また wordpressに特徴的な「ブロック」の概念にも
記事の中でふれていきます．
実際に手を動かしながら読んでいただけると、
wordpress.comでの記事制作が、身近になり、
一段と楽しくなってくると思います．
どうぞ最後までお付き合いください．
あくまで初心者向けの解説になります．
下記の条件を前提にしています．
- wordpress.comの有料プランに加入している．
- 独自ドメイン名を取得済み．
- 独自ドメインのメールアドレスを設定済み．
- 記事の追加方法を理解している．
とはいえ、画像の追加やブロックの概念は
無料プランの場合でも同じですから、
ご参考にしていただけると思います．
まだwordpressに記事を追加したことがない、
という方は、こちら（↓）の記事を先にご覧ください．
→ wordpress.comに記事を新規投稿する方法
** リンクはこの記事とは別のタブで開きます．
記事に画像を追加する方法
はじめに、既存の記事に画像を追加してみましょう．
まだ記事が一つもない方は、
先ほどのリンクから記事を追加する方法を参照して、
記事を追加してください．簡単なもので構いません．
下書きした記事があれば、それでもだいじょうぶです．
それと、あらかじめ掲載したい画像を
PC上に保存しておいてください．
上記の準備が整ったら、画像を追加していきましょう．
画像を追加する記事の編集画面を表示してください．
手順を簡単に復習すると、
– ダッシュボードを表示
– 左のメニューから投稿 > 投稿一覧を選択
– 編集したい記事のタイトルにカーソルを移動 > 編集
です．
もし忘れてしまっていたら、次の記事で確認してください．
記事の下の方、「記事を再編集する方法」という項目で
ご説明しています．
→ wordpress.comに記事を新規投稿する方法
さて、記事の編集画面が表示されたら、
画像を挿入したい箇所をクリックして、カーソルを
入れてください．
その上でエンター（リターン）キーを押すと、
カーソルが下に移動し、そのカーソルの右に薄い字で
「ブロックを選択すには「/」を入力」
という文字列が出ていると思います．
** もしこの文字列が出ない場合は、
もう一度エンター（リターン）キーを押してください．
文字列が表示されたら、その行にカーソルを移動してください．
矢印キーでも移動できます．
表示されている通り、「 / 」を入力してみましょう．
カギカッコはいりません．
/（半角スラッシュ）のみ打ち込んでください．
すると、こんなポップアップが出てきます．
この中の「画像」を選択します．
すると、次の図のような「ブロック」が、
カーソルのあった場所に挿入されます．
これが画像を挿入するためのブロック＝画像ブロックです．
ちなみに、この画像ブロックに対して、
これまで使ってきたような文章を打ち込むブロックは、
段落（paragraph）ブロックと呼ばれています．
今回は「/」を入力して画像ブロックを選択・挿入したわけですが、
何も選ばずにリターン（エンター）をおしつつ書き進めると、
ブロックは自動で段落ブロックになります．
段落ブロックの話はまた後のほうで出てきますので、
頭の隅においておいてください．
画像ブロックの話に戻りましょう．
青く表示されている「アップロード」をクリックします．
すると、PC上にある画像を選択するウインドウが表示されます．
掲載したい画像を選んでください．
ウインドウに表示されたPCの階層によっては、
お目当ての画像が出ていない場合もあります．
階層を切り替えて探してください．
画像を選択すると、その画像は手元のPCから
wordpress.comのサーバーにコピーされます．
同時に、さきほどの画像ブロックには、
アップロードした画像が表示されます．
これが、画像を掲載する最も基本的な方法です．
流れをおさらいすると、
– 記事の中でエンター（リターン）をおして
-「ブロックを選択すには「/」を入力」を表示させ、
-「/」を入力してポップアップメニューから画像を選ぶ．
簡単ですね．
この流れを繰り返せば、ひとつの記事のなかに
複数の画像を掲載できます．
画像掲載、別の方法
もうひとつ、別の方法もご案内しておきましょう．
慣れると、こちらのほうが簡単かも知れません．
wordpressの記事の要素は、見えないブロックの中に入っています．
空の行の箇所は、ブロックの境目となっている可能性があります．
試しにお手元の編集画面で、空白行のあたりでマウスカーソルを
ゆっくり縦に動かしてみてください．ゆっくりです、ゆっくり．
下の図のような、青いラインと「＋」マークが表示されたら、
そこはブロックの境目です．
空白行であっても、この青ラインが表示されない場合もあります．
そういう箇所は、記事作成時に「shift＋エンター（リターン）」で
改行したところで、前後の文とともにひとつのブロック内の空行です．
記事作成時にエンターだけで改行した場合は段落ブロックが生成され、
空白行の前後の文は、それぞれ別々のブロックに別れています．
こういうブロックの境目にカーソルがあたると、
上のような青いラインが表示されるわけです．
このあたりを忘れてしまった、という方は、
あとでこちらの記事で確認してみてください．
→ wordpress.comに記事を新規投稿する方法
また脱線してしまいました．話を先に進めましょう．
青いラインの真ん中にある「＋」をクリックすると、
下の図のようなポップアップが表示されます．
この中から、「画像」を選ぶと画像ブロックが挿入されます．
挿入されたら、先ほどやったと同じように、PC上の画像を選択してください．
ちなみに、画像ブロックに画像をドラッグ＆ドロップしても
アップロードできます．
「ドラッグ＆ドロップって何？」という方は検索してみてください．
この方法ですと、文章を最初に全部打ち込んだ後で、
画像を入れたい箇所に挿入していけるので、
人によっては作業しやすいかも知れません．
そのほかのブロックについて
ここまで、画像の挿入についてご案内してきました．
ご案内したように、記事に画像を挿入するには、
まず画像ブロックを挿入し、そこに画像をアップロードする
という流れになっています．
一方、通常の文章は段落ブロック内に掲載する
ことになっています．
さきほど少しふれましたね．
このように、wordpressでは記事の要素によって、
異なるブロックを用いる仕様になっています．
さきほどのポップアップを思い出してください．
段落や画像のほかにも、見出し、リストなどさまざまな種類の
ブロックがあることがわかります．
さらに、ここで下に表示されている黒帯の
「すべて表示」を選ぶと、
記事編集画面の左サイドにこういう（↓）欄が現れます．
よかったら実際に表示してみて、
ブロックの種類の多様さを実感してみてください．
とはいえ、日常的に使うのは
- 段落ブロック
- 画像ブロック
- 見出しブロック
- リストブロック
- 引用ブロック
くらいで、とりあえず事足りると思います．
見出しブロックは、いまご覧いただいている私の記事でも
時折挿入している太字の見出しです．
リストブロックは、上でブロックの種類を黒丸でリストした
ところで使っているものです．箇条書きする際に使います．
引用ブロックは
吾輩は猫である．名前はまだない．
のように、引用文であることを明示する場合に利用します．
そのほかのブロックについて興味がある方は、
こちらの方が上げている動画が参考になりそうなので
紹介させていただきます．
【WordPress】2022年版ブロックエディタの使い方総まとめ – YouTube
https://www.youtube.com/watch?v=zgQmnmIHocM
とはいえ、初心者の方はともかく記事本文と画像で
まずひとつ、記事を作ってみてください．
ブロックの扱いに慣れてきたら、
必要に応じてその他の種類のブロックも試していけば
よろしいかと思います．
なぜブロックが必要なのか？
さて、「そもそも」の話ですが、
「なぜブロックなどという面倒な設定が必要なの？」
「普通のメモ帳やワードみたいにどんどん書いていけたらいいのに．」
と感じる方もいらっしゃるでしょう．
ウエブページはHTML（エイチティーエムエル）という
マークアップ言語によって実現されており、
直接扱うには一定の専門知識が必要になります．
それを一般の人にも使えるようにした仕組みが、
wordpressのブロックエディタというわけです．
（** 「グーテンベルク」とも呼ばれています．）
私たちは通常意識することはありませんが、
ブロックそれぞれに、そのブロックの種類に対応したHTMLが、
内部で設定されています．
ご案内してきたようにやや扱いに癖があり、
慣れるまで少し練習が必要ですが、
情報発信をする際に、HTMLやCSSを学ばなくてよいのは
大きなメリットです．記事を作りながら慣れていってください．
ブロックの種類を使いこなせるようになると、
自由度も大きくなり、使いこなしている実感も得られるでしょう．
おわりに
今回は画像の挿入方法をご案内しました．
記事後半では wordpress特有の「ブロック」という
仕組みと種類についても触れました．
ここまでお付き合いただいた方々は、
すでに段落ブロックと画像ブロックを
使えるようになっていると思いますので、
どんどん記事を追加、あるいは書きだめていってください．
ひととおり流れをおさえたら、
「習うより慣れろ」のメンタルで、
手を動かしながら憶えていくほうが早いです．
後からいくらでも編集し直せるので、
アイディアの段階で下書き保存しておくのもオススメです．