WordPressでブログ記事を書いていると、記事内に表を作って設置したいと思うことがあると思います。
今回はそんなとき、プラグインを使わないで表を記事内に挿入する方法を紹介していきましょう。
プラグインを使用しなくてもかなり融通の効く、使い勝手のいい表が作成できます。
一方でプラグインを使って表を記事内に表示するには「TablePress」というプラグインがおすすめです。
こちらの記事で紹介していますので、よろしければ参考にしてください。
ビジュアルエディタを拡張して表を作成しよう
プラグインの「TinyMCE Advanced」をインストールしてビジュアルエディタを拡張し、そこにある表作成機能を使う方法です。
「TinyMCE Advanced」のインストールがまだの方は、こちらの記事を参考にしてください。
それでは「TinyMCE Advanced」をインストールした後、表を作成する方法を説明していきます。
1. WordPressの「設定」より「TinyMCE Advanced」を選択します。
2. 「TinyMCE Advanced」の設定画面で、「表作成」のアイコンをツールバーへドラッグ＆ドロップで移動させます。
3. 「ビジュアル」モードになっていることを確認して「表作成」のアイコンをクリックします。
4. プルダウンメニューが表示されますので、一番上の「テーブル」にカーソルを合わせます。
5. 「何行 x 何列」の表を作りたいかの指定ができますので、マウスカーソルで大きさを指定してクリックすると表が作成されて、表示されます。
6. 表を作成してからも行や列を挿入したり、削除したりの修正が可能です。
行や列を挿入する場合、カーソルがある行や列の上下や左右に挿入されます。
7. 表、行、セルのプロパティで指定した範囲の設定が行なえます。
表のプロパティではセルの中を「右寄せ、中央寄せ、左寄せ」に設定したり、表を作成している枠線の種類を変えることができます。
行のプロパティでも、行単位で「右寄せ、中央寄せ、左寄せ」に設定したり、表を作成している枠線の種類を変えることができます。
同じく、セルのプロパティでセル単位の設定変更が可能です。
また、表の中に新たに表を加えることができます。
新たに表を加えたいセルにカーソルを置いたまま、「表作成」をクリックすれば、作成できます。
ワードで表を作ってコピペで貼り付けよう
こちらの方法は、マイクロソフトのワードでの表作成がなれている場合、一番簡単ではないでしょうか。
ワードで表を作成した後、Wordpressの「ビジュアル」モードにコピペするだけです。
非常に便利な反面、後々に修正をしたい場合、Wordpress上で修正をすることはできないという欠点があります。
HTMLで表を直接、書き込もう
「テキスト」でHTMLを入力します。
表を作るHTMLはtable ~ /tableダグです。
基本はこちらのHTMLになります。
<table>
<tbody>
<tr>
<td>;AAA</td>
<td<1,000</td>
</tr>
<tr>
<td>BBB</td>
<td>2,000</td>
</tr>
</tbody>
</table>
このHTMLはサイトではこのように表示されます。
| AAA | 1,000 |
| BBB | 2,000 |
HTMLで行や列を増やしたいときには「<tr>～</tr>」や「<td>～</td>」で囲まれている部分を増やせば簡単にできます。
行の場合は「<tr>～</tr>」、列の場合は「<td>～</td>」の部分を加えてください。
ちなみに、HTMLでのその他装飾を調べるには、一番最初に説明した「TinyMCE Advanced」で拡張したビジュアルエディタを使うと便利です。
そこで表を作成したあと、「ビジュアル」モードから「テキスト」モードに切り替えると、装飾を加えるためにタグやコードが書かれている
HTMLを見ることができます。
そこで一つ一つ、どの様なタグやコードを加えれば、どんな装飾ができるのかを確認して、勉強していくのが一番の近道でしょう。
最後に
いかがでしたでしょうか？
プラグインを使わずに簡単に表を作成する方法を紹介しました。
これらの方法がめんどくさい、複雑でわかりにくいというのであれば、プラグインをインストールして表を作る方法もあります。
そちらの解説はこちらの記事でしていますので、よろしければ、参考にしてください。
