ブログ記事一覧はこちらです。

WordPressの画像差し替え・ブロック複製の基本操作ガイド

WordPress画像差し替え・ブロック複製の基本操作ガイド WordPressの使い方
お役に立てたら、一杯のコーヒーで執筆者を応援しませんか?

お役に立てたら、一杯のコーヒーで執筆者を応援しませんか?

寄付する

WordPressでホームページを自分で更新したい初心者の方へ。この記事では、画像を入れ替えたり、3カラムなどのブロックを丸ごと複製して新しい情報を追加したりする基本操作を解説します。すぐ実践できるよう、実際の編集画面を使った図解で丁寧に手順を紹介。カラムの複製方法などについて詳しく説明しており、サイトのコンテンツ更新がスムーズに行えるようになります。

編集画面(ブロックエディター)を開く

WordPressで画像を差し替えたり、ブロックを複製したりするには、まず対象の記事の「編集画面」を開きます。まだログインしていない方は、まず管理画面へログインしましょう。

ログイン方法や管理画面の全体図をもっと詳しく知りたい方は、以下の記事を参考にしてくださいね。

WordPress記事作成の第一歩 :ログインから投稿完了までの簡単ガイド

「固定ページ」または「投稿」の編集画面を開く

WordPressにログインした後、ダッシュボードの左メニューから「固定ページ」または「投稿」の一覧から行います。

  1. 左メニュー →「固定ページ」または「投稿」 をクリック
  2. 編集したいページの一覧が表示されます
  • 新しい記事を作成する場合 → 「新規追加」
  • 既存の記事を直す場合 → 記事名の下にある 「編集」 をクリック

この操作で、画像ブロックを編集できる ブロックエディター画面 が開きます。

「投稿ページ」:ブログの記事やニュースなど、頻繁に追加・更新する記事
「固定ページ」:会社概要やプライバシーポリシーなど、滅多に更新しないページ

ブロックエディター画面です

画像ブロックの基本操作

ここからは、WordPressの固定ページ・投稿記事でよく使う 画像ブロックの編集方法 を解説します。
「新しく画像を追加する方法」と「画像を差し替える方法」の2つを覚えておくと、ページ内の写真をいつでも最新の状態にできます。

新しい画像ブロックを追加して設定する方法

ページ内に新しく画像を挿入したい場合の手順です。

【画像の設定手順】

  1. 新しい画像ブロックを追加する:編集したい場所で「+」(ブロックを追加)ボタンをクリックし、「画像」ブロックを選択して追加します。
  2. 画像のアップロード/選択
    追加された画像ブロック内の「アップロード」「メディアライブラリ」の中から選択します。
  3. 画像を選ぶ
    ・WordPressにすでにある画像を使う → メディアライブラリから選択
    ・新しい画像を使う → 「ファイルをアップロード」 からPC内の画像を選択
  4. 「画像を設定」ボタンをクリックします。
  5. これで画像がページに挿入されます。
    挿入後は、ブロックのメニューから 「削除」「置換」 などの操作も可能です。

↓画像を選択する際は、軽量化されているか確認してくださいね♡

目安: 1枚あたり100KB~300KB程度を目安に軽量化することをおすすめします。(画像の大きさや用途によりますが、極端に重い1MB以上の画像は控えたほうが良いです。)

これで画像の設定が完了です。

既存の画像を新しい画像に差し替える方法

すでに配置されている画像を、新しい画像に置き換える手順です。

【画像差し替え手順】

  1. 変更したい画像にカーソルを合わせる
  2. 上部に表示されるツールバーの 「置換」 をクリック
  3. 「メディアライブラリ」または「アップロード」から新しい画像を選択

これで画像の差し替えが完了です。

画像が準備できたら、次は文字の入れ方や装飾です。

WordPressブロックエディターの使い方|初心者が最初に覚える「タイトル・本文の入力」基本操作

WordPress|テキスト装飾とリンク設定(太字・色・URL)

ブロックの複製方法

「同じレイアウトや構成をもう一つ作りたい」という時に便利なのが ブロックの複製機能 です。特に、画像とテキストが横に並ぶ カラムブロック(3カラムなど) をそのままコピーしたい時に非常に役立ちます。複雑なレイアウトを一から作り直す必要がなくなり、作業時間を大幅に短縮できます。

↓この機能を使って、新しいコンテンツを効率的に追加していきましょう♡

【手順】
ここでは、画像とテキストが3つ横に並んだブロック(3カラム)を例に説明します。①〜⑤までの部分をクリックしていきます。

これで複製が完了です。

↓補足です:ブロックとブロックの間にスペースを開けたい場合♡

複製したブロックとブロックの間に “余白” を入れたい時は、スペーサー機能 が便利です。

  1. 隙間を入れたい位置に「+(ブロックを追加)」アイコンをクリック
  2. 「スペーサー」を選択
  3. 追加したスペーサーをクリックし、
    ・マウス操作で高さを調整
    ・右側の設定欄で数値を指定、どちらでも幅を自由に変えられます。

テキスト(文章)の編集と保存

ここまで、画像の入れ替えブロックの複製方法について見てきました。次に、すでに設置されている文章を書き換える手順と、編集内容をウェブサイトに公開するための重要な操作をご案内します。

既存の文章を書き換える方法

設置されている文章(見本のテキストなど)は、クリックしてそのまま編集できます。詳細な手順は、こちらの記事で紹介しています。

編集内容をサイトに反映させる方法(更新・保存)

画像や文章を編集した後は、必ず右上にある 「更新」ボタン をクリックして、変更内容をサイトに反映させます。作業途中で公開したくない場合は、「下書き保存」 を使えば編集途中の状態を保存できます。

まとめ

この記事では、画像の差し替えやブロックの複製方法を解説しました。 特にブロックの複製は、サイトの統一感を出しつつ、効率よく情報を追加できる魔法のような機能です。

「一から作らず、あるものを活かす」ことで、ブログ更新のハードルがグッと下がります。画像と複製を使いこなして、あなたらしい素敵なページに仕上げてくださいね!

画像の扱い方がわかったら、次は記事の顔になる「アイキャッチ画像」を準備しましょう!

WordPress|アイキャッチ画像の設定から最適なサイズ・選び方まで

お役に立てたら、一杯のコーヒーで執筆者を応援しませんか?

お役に立てたら、一杯のコーヒーで執筆者を応援しませんか?

寄付する
ニュースレターを購読する

メルマガ登録をお願いいたします。

今日も一緒に言葉を学んで、相手を思いやる言葉遣い、適切な言葉遣いでコミュ力を上げていきましょう♡

WordPressの使い方