【まずはこれを覚えよう】WordPressの代表的なブロック紹介

最新のWordPressは、様々な役割を持つブロックがあります。

ブロックを選び、組み合わせることで、ページを作ることができます。

ブロックの種類は非常に多く、標準ブロックだけでも100種類以上が存在します。

しかし、実際によく使うブロックは限られています。

まずは基本の5種類を覚えておけばOKです。

今回はWordPressの5つの代表的なブロックと、使い方を解説します。

目次

ブロックの挿入方法

まずは、ブロックの挿入方法を解説します。

固定ページ、または投稿から、ブロックを挿入したいページのブロックエディターを開きます。

→固定ページの開き方の詳細

ブロックエディター上で、ブロックを挿入したい箇所を選び、クリックします。

WordPressのブロックインサーターボタン

左上の「青いプラスボタン(ブロックインサーターボタン)」をクリックします。

WordPressのブロックインサーター画面

すると、ブロックの選択ウィンドウが開きます。

使いたいブロックをクリックすると挿入されます。

画面が違う・項目がない時は?

WordPressには様々なバージョンや制作方法があります。
今回の記事で紹介する方法は、最もベーシックな方法で作られたホームページの編集方法です。

画面が違う場合や、説明の項目がない場合は、特殊な方法でホームページが作られた可能性があります。制作を依頼した制作者にお問い合わせください。

ムロタプロダクトでも、ホームページの情報変更作業も承っています。困った場合はお気軽にお問い合わせください。

→お問い合わせはこちら

代表的な5つのブロック

今回紹介するのは以下の5つのブロックです。

  1. 段落ブロック
  2. テーブルブロック
  3. 画像ブロック
  4. ボタンブロック
  5. リストブロック

それぞれの役割と使い方を解説します。

①段落ブロック

WordPressの段落ブロック

段落ブロックは、文章を入力するのに使うブロックです。

最も使用頻度が高いブロックと言えるでしょう。

使い方はWordなどの文章作成ソフトと同じ感覚で、文章を入力したり削除をすることができます。

WordPressの段落ブロックのスタイル設定

右側の設定パネルでは、文字のスタイルを変更することができます。

文字色や背景色、文字のサイズを変更することができますよ。

WordPressの段落ブロックのパネル

ブロックの近くのパネルでは、文字揃えや、太文字、斜線も変更できます。

②テーブルブロック

WordPressのテーブルブロック

テーブルブロックは、表を簡単に追加できるブロックです。

WordPressのテーブルブロックのカラム数と行数の設定

テーブルブロックをクリックすると、カラム数(列数)と行数を指定して、表を作成することができます。

WordPressのテーブルブロックの3×3テーブル

今回は3×3の表を作ってみました。

WordPressのテーブルブロックに文字入力

表のセルをクリックすると、カーソルが表示されますので、テキストを入力してください。

枠線の色を変更するには?

WordPressのテーブルブロックの枠線変更

テーブルブロックの枠線の色を変更するには、右側の設定ウィンドウを使います。

設定ウィンドウ上部の右の「スタイル」を選択します。

「枠線」の項目から、枠線の色と枠線の幅を変更することができます。

列、行の追加や削除は?

WordPressのテーブルブロックの列や行の追加

列や行の追加や削除をするには、テーブルブロック近くのパネルの「表を編集」をクリックします。

列や行の追加や削除が簡単に行えます。

③画像ブロック

WordPressの画像ブロック

画像ブロックは、画像を挿入するためのブロックです。

すでにホームページで使ったことがある画像を挿入する場合は、メディアライブラリを選択してください。

新しい画像を挿入する場合は、「アップロード」を選択して、パソコンのフォルダーから画像を選びます。

右側の設定ウィンドウからは、画像の枠線や、角丸の設定を行うことができます。

④ボタンブロック

WordPressのボタンブロック

ボタンブロックは、ボタンを追加できるブロックです。

別ページに飛ばすURLを設置したり、参考サイトに飛ばす際に使えます。

WordPressのボタンブロックのテキスト追加

ボタンブロックの「テキストを追加」をクリックして、自由に文章を入力できます。

WordPressのボタンブロックのリンク入力

URLはボタンブロック近くのパネルの「リンク」をクリックします。

「検索またはリンクを入力」にURLを入力して、エンターキーを押せば完了です。

⑤リストブロック

WordPressのリストブロック

最後に紹介するのは、リストブロックです。

リストブロックは、箇条書きを簡単に作れるブロックです。

WordPressのリストブロックの例

情報を分かりやすくまとめる時によく使います。

WordPressのリストブロックのインデント

パネルのインデントから、箇条書きを階層にすることもできます。

まとめ:基本の5つのブロック

今回は使用頻度が非常に高い5つのブロックを紹介しました。

これらのブロックになれることで、WordPressでできることが劇的に増えます。

また、5つのブロックに慣れたら、以下のブロックも触ってみてください。

  • 見出しブロック
  • 引用ブロック
  • ギャラリーブロック
  • メディアとテキストブロック
  • スペーサーブロック

これらのブロックも使用頻度が高めです。

少しずつ使えるブロックの数を増やしてみてくださいね。

ホームページ制作受付中

伴走型のホームページ制作サービスを行なっています。集客に強いホームページをあなたとともに作り上げます。また、スキルマーケット「ココナラ」でも出品中です。合わせてご活用ください。