Otoblogを読んでもらえばわかると思いますが、僕ブログで表を結構使うんです。
今回はブログで使う表の作り方を紹介します。
ワードプレスで表を作るときはプラグインをインストールせよ
ワードプレスでブログを書く僕が表作成する時にTinyMCE Advanced(WPのビジュアルエディタを拡張するプラグイン)を使っています。
ブログを書くときは見出しとかを直接調整したいのでHTMLのタグ打ちで記事書いてるんですけど、表を書くときはビジュアルエディタが便利です。なぜなら下のような表ですが
| A店 | B店 | C店 | |
| たけしくん | １００ | ７００ | ３００ |
| 山田くん | ５００ | ９００ | ２００ |
この表をHTMLで記載すると
ナニコノカオスワケワカンナイ
さらに表に色をつけたりするとさらに訳わかんなくなります。
そこで役に立つのがTinyMCE Advancedってわけです。
表の作り方
プラグインをインストールする
まずワードプレスの管理画面からプラグイン→新規追加で右上の検索ボックスにTinyMCE Advancedと打ち込んで、インストール→有効化してください。
実際に表を作る
いつもGoogleのスプレットシートで表を作ってからコピーしてビジュアルエディタで編集しています。ビジュアルエディタから生成することもできるようになってはいるのですが、うまく表示されないことが多いので表計算ソフトを使ったほうがいいです。（公式……よぉ……）
1.表計算ソフトで表を作る 枠線や割り付けは意識しないで大丈夫です。
2.作った表をビジュアルエディタに貼り付ける
3.編集するセルをドラッグして右上のテーブル(表のマーク)をクリック、セル→セルのプロパティを選択して表を編集します。
今回は、一般の横配置を中央、縦配置をMiddle、詳細の枠線の色を#000000、背景色は基本は#ffffffで、表の頭は#00dff7、横は#00ebe3にしています。
そのほかにも文字の色やサイズ、フォントなども変えることもできますが、長くなるので今回は割愛します。
そして完成した表がコレ↓
| 山田くんの家 | 智くんの家 | |
| 友恵ちゃんの家 | １km | １００km |
| 佳子ちゃんの家 | ８０km | ２km |
まとめ
という感じで、ワードプレスにプラグインを入れたら簡単に表が作れるっていう話でした。
ワードプレスって初心者がいきなり使うとプラグインだーテーマだーでわけわからなくなりますよね。ちゃんと調べて使わないとサーバーが重くなってサイトのPV数激減なんてことも……
ってならないように、プラグインを入れるときは事前に検索してレビューを確認してから使うことをお勧めします。
