あなたは以下のような、表(テーブル)を記事の中に挿入したいと考えていませんか?
見出し1 | 見出し2 | 見出し3 |
コンテンツ1 | コンテンツ2 | コンテンツ3 |
このような表はプラグインを使うことで簡単に記事の中に挿入することができます。
この記事ではプラグインを活用して、記事に表を挿入する方法と表の装飾方法をお伝えしていきます。
目次
WordPressで表を作成するためのプラグイン「TinyMCE Advanced」
表を記事の中に挿入するためには、「TinyMCE Advanced」というプラグインが必須となります。
なので、まずは「TinyMCE Advanced」をインストールしましょう。
WordPressプラグインのインストール方法は以下の記事を参考にしてください。
以下の記事を参考に「TinyMCE Advanced」で表を使うためのボタンを追加してください。
表の用語解説
この記事では表の「ある部分」をそれぞれ正式用語で解説します。
なのでこの記事の中身が理解できるように、最低でも以下の3つの用語を頭に入れておいてください。
表を挿入する方法
表を記事の中に挿入する方法です。
表を挿入するには、記事エディタ画面にて以下のボタンをクリックします。
※まだ設定が完了していない方は以下の記事を参考に「」のボタンを追加してください。
このボタンを押すと以下のようになります。
「テーブルを挿入」→「挿入した表のセルの数」を選択してください。
これで表が挿入されました。
セル内への文字入力は、文字を入れたいセルをクリックし入力するだけになります。
3 x 4だと以下のようになります。
見出し1 | 見出し2 | 見出し3 |
りんご | 赤 | 青森 |
パイナップル | 黄色 | 沖縄 |
もも | ピンク | 山梨 |
6 x 2だと以下のような表になります。
1 | 2 | 3 | 4 | 5 | 6 |
あ | い | う | え | お | か |
この要領でまずは表を挿入してみてください。
表の編集方法
次に一度作った表を編集する方法になります。
行と列をあとから追加する方法
行を追加する方法
例えば、あなたが一度表を作って、後から行や列を追加したいときに使います。
まずは行の追加方法です。
挿入したい箇所の下の行のどこかのセルをクリックします。
次に「表」をクリックし、「行」→「行を上に挿入」をクリックします。
すると、3行だった表の一番上に新しい行が追加されます。
この要領で、下に行を追加するときは「行を下に挿入」をクリックしてください。
列を追加する方法
次に列を追加する方法になります。
列を追加するのも行と同様に、右もしくは左に列を追加したい箇所を選び、その列のどこかをクリックします。
次に「表」→「列」→「列を右に挿入」をクリックします。
すると、列が右側に挿入されました。
左側に挿入する時も同様に行なってください。
行と列を削除する方法
表を作成した後に、余分な行や列ができた場合は、削除が必要です。
削除方法は簡単です。
まずは削除したい行もしくは列のどこかのセルをクリックします。
次に「表」→「行 / 列」を選択し、「削除」をクリックします。
これで完了となります。
表の微調整をする方法
次に表の微調整を行います。
例えば、以下のように表の背景に配色して区別しやすくすることもできます。
見出し1 | 見出し2 | 見出し3 |
りんご | 赤 | 青森 |
パイナップル | 黄色 | 沖縄 |
もも | ピンク | 山梨 |
見出しとデータを区別してわかりやすくする
まずは、見出しの部分と中身の情報の部分をわかりやすく区別する方法です。
上記の表で言うところの、赤背景の部分になります。
まずは見出しにしたい行を選択し、「表」→「行」→「行のプロパティ」をクリックします。
次に「行の種類」→「ヘッダー」にしておきます。
そして、「詳細」をクリックし、「背景色」の赤枠の部分をクリックします。
カラーペレットが出てくるのでお好みの色を設定してください。
終わったら「OK」を押して終了となります。
列の幅の調整
次に列の幅の調整方法です。
列の幅を調整するときは、幅を変更したい列のどこかのセルをクリックし、「表」→「セル」→「セルのプロパティ」をクリックします。
そして、その列の横幅を「幅」の項目に記載します。
「OK」を押して完了となります。
表の中の情報の配置変更
次に表の中の情報の配置の変更方法です。
以下の表では見出しの部分が左寄せになっています。
これを中央揃えにしていきます。
以下のように配置を変更したい行 / 列を選択します。
そして、「中央揃え」をクリックします。
このように中央揃えにすることができます。
この要領で他のセルの配置も変更してみてください。
表の中身をリセットする方法
表をいじっていくうちに、配置や文字の太さ、色がバラバラになっていくことがあります。
そんなときは見栄えが悪いので元に戻したくなるかもしれません。
そんなときは、表をクリックし、エディタ下部の「table」をクリックします。
すると、表全体が選択されるので、「書式設定をクリア」をクリックします。
すると、表全体がリセットされます
これでリセットが完了です。
表を削除する方法
最後は表自体を削除する方法です。
先ほどのように表のどこかをクリックし、「table」をクリックします。
表全体が選択されたら、「Back Space」もしくは「delete」で削除してください。
これで表は削除されます。
まとめ
以上がWordPressのブログ記事における表の挿入方法となります。
特に表は大事なデータをまとめるのに役立ちますので、有効に活用して訪問者が見やすい生地作りに活用して見てください。
以下の記事では表(テーブル)以外にも、ブログ記事を装飾する方法を解説しています。ぜひご覧ください。