1. TOP
  2. WordPressの記事で表を作成する方法【TinyMCE Advanced】

WordPressの記事で表を作成する方法【TinyMCE Advanced】

WordPress この記事は約 4 分で読めます。
table

WordPressに表を挿入する事ができれば、訪問者様により分かりやすく情報を伝える事ができます。

しかし、WordPressの表を挿入するにはデザインやHTML等の知識が必要になります。

今回は簡単に表を挿入するために、プラグインを利用した表の作成方法を解説します。プラグインを利用すれば視覚的に表を作成する事ができるので、とても便利です。

1. TinyMCE Advanced をインストールしよう

まずは『 TinyMCE Advanced 』をインストールしましょう。もちろんプラグインなので無料で利用できます。

・WordPress表作成プラグイン『TinyMCE Advanced』のインストール方法

TinyMCE Advancedを利用してWordPressに表を作成すれば、

13
このように表を作成する事が可能です。

2. 表を挿入しよう

まずはWordPressで記事投稿画面に行きます。

『ビジュアルエディタモード』を選択し、『テーブル』⇒『テーブルを挿入』を選択。

1
表の上でマウスを移動させる事により、縦長の表や、

2
横長の表を作成する事ができます。

3
今回は試しにランキング形式の表を作成してみようと思うので、『4×4』の大きさで表を作ってみようと思います。下に表の大きさを示す数字も表示されるので、そちらも参考にして下さい。

4
大きさが決まったら、そのまま『左クリック。』

3. 表を広げよう

クリックすると、投稿画面上に表が挿入されます。すごく分かりにくいんですけど見えますかね?オレンジの枠内です。

5
四隅に 『□』 印がありますので、マウスでクリックしたまま広げましょう。

6
これでやっと表っぽくなりました。続いて中身を完成させていきましょう。

4. 表に文字入力しよう

まずは表に基礎となる文字を入力しましょう。

7
ここから表を分かりやすくするように編集を進めて行きます。

5. 表の編集方法

ここから具体的な調整方法に移ります。

8
まずは画像の通り、セルを選択します。

9
セルを選択したら、『テーブル』⇒『表のプロパティ』をクリック。

5-1. 一般設定 – 表のプロパティ

一般設定では、以下の7つの項目を設定する事が可能です。

10
・幅:セルの横幅を調整します。
・高さ:セルの高さを調整します。
・セルのスペース:セルとセルの間のスペースを調整します。
・セルのパディング:余白を調整します。
・枠線:枠線の太さを調節します。
・キャプション:セルの上部に大見出しを付けます。
・配置:文字を寄せる事ができます。

キャプションと配値以外は、全て半角の数字を入力するだけで大丈夫です。色々数値を入力してみて試すのが良いでしょう。

5-2. 詳細設定 – 表のプロパティ

11
詳細設定では、枠線の色や背景色を簡単に変更する事ができます。色を変更したい場合は、赤枠内のタブをクリックしてみて下さい。

12
キャンパス内の、『○』を動かせば視覚的に色を選択する事ができるし、『♯』の枠内に文字コードを入力すれば、希望する色を指定する事ができます。各色にはインターネット上で文字コードというのが割り当てられており、興味のある場合は『 HTML 色 』のキーワードでネット検索してみて下さい。分かりやすいサイトが色々と出てきます。

6. 個別のセル設定

13
サラッと作ったので本当に簡単な表ですが、このように太字にしたり、中央に揃えたり、各セルの幅を調節したりすることができます。

14
簡単な装飾であれば定番の文字編集機能を利用する事もできますし、

15
セル単体の詳細設定を行いたい場合は、編集したセルを選択し、『テーブル』⇒『セル』⇒『セルのプロパティ』をクリックすると、

16
このようにセル単体も編集する事が可能です。こちらも一般設定と詳細設定があるので、細かく設定をする事が可能です。

ちょっと手間を加える事が将来のアクセス増に貢献します

はっきり言って、表なんかわざわざ作らなくても良いと思うんですよね。カッコを付けたり、太字にしたらちゃんと見やすく編集できますからね。

けど、表を作るべきデータを提示する場合は、表を作った方が訪問者さんにとっては分かりやすく情報を受け取る事ができます。

表を作ったからってアクセス数が10%上昇する訳ではないですが、このような小さな積み重ねが満足度の向上に繋がります。そして満足度が上昇すれば、滞在率などの数値も上昇し、結果的にSEOでも強くなり、アクセス増に繋がります。

これを機に、再度過去のコンテンツなどを見直してみるのも良いかもしれません。

\ SNSでシェアしよう! /

次世代ビジネス研究所の注目記事を受け取ろう

table

この記事が気に入ったら
いいね!しよう

次世代ビジネス研究所の人気記事をお届けします。

  • 気に入ったらブックマーク! このエントリーをはてなブックマークに追加
  • フォローしよう!

運営者紹介 運営者一覧

次世代ビジネス研究所

次世代ビジネス研究所

大学卒業後、某企業へ就職。
その後サラリーマン生活を経て、脱サラ・起業。
気まぐれで独り言を不定期更新。

関連記事

  • sitemap

    Google XML Sitemaps でサイトマップを自動作成する方法

  • source

    W3 Total Cache の使い方と初期設定・インストール方法

  • Two andalusian horse in desert dust against dark background

    STINGER PLUS+(スティンガープラス)のダウンロード方法 | おすすめWordPress無料テーマ(テンプレート)

  • website

    WordPressでメニューバーを表示させる方法と編集・設定手順【グローバルナビゲーション】

  • sitemap

    PS Auto Sitemap の使い方と初期設定方法 | サイトマップ自動作成プラグイン

  • book

    WordPress 目次の作り方-自動作成プラグイン Table of Contents Plus の設定方法