HTMLタグの記述しなくても簡単に綺麗な表が作成できるプラグイン「TablePress」の設定方法




The following two tabs change content below.

山田ゆうすけ@WEBマーケター

本職は広告代理店で広告やマーケティングの仕事をしているWEBマーケター。阪神ファンでガンバ大阪が好きな典型的な関西人。数年前までITスキルがほぼ0だったが、そこからWEBデザインやプログラミングなどITスキルを学び、月収が10万円以上アップした経験から、スキルアップを目指す方にはまずはITスキルを学ぶことを推奨している。

TablePressとは

このプラグインは、HTMLタグを使わずにワードプレスで表を作ることができるプラグインです。

CSSの設定もまとめて出来るので、色をつけたり、装飾することも可能ですので、何かを比較したいけど文章だと長くなるけれど表を使うとすっきりするという場合に非常に効果的です。

表のデザインを変えるだけで、サイトの見た目が大きく変わるので、ユーザーからも分かりやすいサイトだと思っていただけます。

これから「TablePress」のインストール方法や設定方法について解説していきます。

TablePressのインストール方法

ダッシュボードの画面を開いてください。

左メニューの【プラグイン】にマウスカーソルを合わせてください。

【新規追加】という項目が出てきますので、クリックします。

プラグインを追加の画面が出てきます。

画面の右上をご覧ください。

【プラグインの検索】という所があります。

ここに、TablePressと入力してください。

入力すると自動で検索して表示します。

【今すぐインストール】をクリックし、【有効化】をクリックします。

クリックするとTablePressを使うことができます。

TablePressの使い方について

ダッシュボード画面の左メニューにあるTablePressにマウスカーソルを合わせ、【新しいテーブルを追加】をクリックします。

新規追加について

【テーブルの名前】は分かりやすい名前にしておいた方がいいです。

そのため【説明】も同じで、分かりやすい名前を入力します。

テーブルの行は横のマスの数です。列は縦のマスの数です。

この設定が終わったら、【テーブルを追加】をクリックします。

【テーブルの内容】に内容を書いてください。

赤丸のところにチェックをしています。

他のところも同じですが、下に【テーブルの操作】がありますが、削除したり追加したりできます。

Excelなどのようにセルを結合したい場合には、各項目に#colspan#と入力します。

これだけでもいいのですが、モバイル端末から見る方は画面の横幅が狭いのでDataTable JavaScriptライブラリ機能】の赤丸にチェックを入れます。

入力が終わったら【変更を保存】をクリックしてください。

インポートとエクスポートとプラグインのオプション

インポートはエクセルなどのファイルから、TablePressに自動で入力します。

エクスポートは、CSVファイルをダウンロードし、Excelなどで使用できます。

プラグインのオプションは、カスタムCSSを入力します。これにより、いろんな色や文字の位置などを変更できます。

CSSはトップの項目の背景だけシルバーにしました。

入力が終わったら【変更を保存】をクリックしてください。

全てのテーブルについて

ここまで入力をし、全てのテーブルのタブをクリックします。

名前を付けたテーブルにマウスカーソルを近づけ、【ショートコードの表示】をクリックします。

右上にショートコードが出ますのでそのショートコードをコピーします。

投稿または固定ページをクリックし貼り付けます。

テキストモードでもビジュアルモードでも問題ありません。

【投稿】をクリックします。

記事を表示させると、このようにテーブルが表示されます。

以上、「TablePress」の解説となります。

まとめ

いかがでしたでしょうか?

今回は、「TablePress」のインストール方法や設定方法について解説しました。

このプラグインを使用することで簡単に表を作ることができます。

最近のワードプレスのテーマであれば綺麗な表が作れる機能が付いているテーマもありますので、もしお使いのテーマに表作成機能がない場合は、このプラグインを設定して使ってみてください!

スポンサーリンク





あなたの”学び”につながったらシェア!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

ABOUTこの記事をかいた人

本職は広告代理店で広告やマーケティングの仕事をしているWEBマーケター。阪神ファンでガンバ大阪が好きな典型的な関西人。数年前までITスキルがほぼ0だったが、そこからWEBデザインやプログラミングなどITスキルを学び、月収が10万円以上アップした経験から、スキルアップを目指す方にはまずはITスキルを学ぶことを推奨している。