WordPressで表作成!商品紹介・一覧表示が出来るプラグインTablePressの使い方

こんにちは!来客メディアコンサルタントの佐藤旭です。

この記事では、WordPressで簡単に表作成が出来、尚且つソート機能も付いている商品紹介・一覧表示が出来るプラグインTablePressの使い方について解説します。

WordPressで、複数のアイテムを同じページ表示させる際に普通のテーブルだと物足りないことがありませんか?

例えば、並び替え(ソート)が出来たら・・・便利ですよね。

表示だって、ただ上から順番に並んでいるだけでは面白くないですもんね。
今回紹介するプラグインTablePressは、そんな悩みを解決できます。

手軽にスタイリッシュでユーザビリティの高いアイテム一覧ページがあれば、それだけでサイト訪問者は利便性を感じてくれるのではないでしょうか。

スポンサーリンク

TablePressの良い所・悪い所

早速インストールする前に、まずは『TablePress』は実際に使ってみてどうか?

という事についてリアルな感想をお伝えします…。

良い所はPCでみる分にはかなり使いやすい

このプラグインはPCで閲覧する方にとってはかなり使いやすいと思いました。

ソート機能もあり、表が綺麗にまとめられるのでそこが一番良い所かなと。

悪い所はスマホ表示が良くない

対してスマホでの表示が良くないです。
下の画像の様に、かなり詰まってしまいます。

色々と検証した所、画像がレスポンシブ対応していませんでした。
ですので、画像を使う場合はスマホで表示される事を予め計算したサイズで掲載する必要があります。

WordPressで表作成!商品紹介・一覧表示が出来るプラグインTablePressの使い方

工夫次第だとは思うのですが、列は2。増やしても3位かなと。言った所でした。

 

なので、情報量が多い表だとスマホでは詰まった表示になるのでお勧めしない。
スマホも意識するのなら2~3列でシンプルな活用がお勧め。

と言うのが、実際に使ってみての感想です!

拡張プラグインは一応あります

レスポンシブ対応させる場合は拡張機能が必要で『Responsive Tables』をダウンロードしてインストールする事で出来る。

と言う記事が複数あったので試したのですが、「画像は依然としてレスポンシブ対応しない」…つまりは、画像のサイズに従って表示される為、結局の所は見にくのは改善されません。

参考記事はこちら⇒【WordPressプラグイン】TablePressの表をレスポンシブ対応に!

WordPressプラグイン『TablePress』インストール方法

と言う訳で、WordPressプラグイン『TablePress』のインストール方法です。

【ダッシュボード】⇒【プラグイン】⇒新規追加で表示される画面の検索ボックスで【TablePress】と検索すると出てきます。

【TablePress】プラグインが表示されたら、【いますぐインストール】と書かれた箇所をクリックしてインストールして下さい。
有効化を忘れずに行って下さいね。

TablePressプラグインアイコン

このアイコンが目印です!

利用するための準備はこれで完了です。

TablePressの設定と使い方

と言う訳で早速設定して使えるようにして行きましょう!

 

インストールが完了したら【ダッシュボード】⇒【TablePress】⇒【新しいテーブルを追加】で新規作成ページを開きましょう。

tablepress02

下図の様な新しいテーブルの作成ページが表示されました。

ここでは、後から分かるようにそのテーブル名と説明文を決めて下さい。
また、行と列の数もここで決めることが出来ます。
因みに、全て後から変更も可能ですのでご安心ください。

tablepress03

【テーブルを追加】をクリックで、再生ページに切り替わります。

下図の様に、項目を埋めてゆきます。
ディフォルト(初期状態)では、1行目は見出しになっています。

文字はそのまま入力、リンクや画像を挿入する場合は、そのままアドレスを直接入力でもできますし、同じサイトないのでデータ上から引っ張ってくる場合は、クリックだけで挿入できる便利なボタンもついています。

tablepress04

 

【テーブルの操作】をメインで使う事になります。

ワンクリックで簡単に挿入できるぽ単は、青く囲っています。

先にボタンをクリックして、次に、挿入したいセルをクリックすると、どのリンクや画像なのか選択画面が表示されます。

後は、選択して完了です。

tablepress05

 

行と列の操作も色分けしてみましたので参考にしてみてください。

プレビューで確認を行った後、問題がなければ、保存をして下さい。

記事内に作成したテーブルの挿入する方法

テーブルの挿入は、まず同ページ右上にある【ショートコード】(例:table id= /)をコピーします。

次に、挿入したいページにそのコードをペーストすれば完了します。

tablepress06

まとめ

とても簡単なのに、本格的なテーブルを作ることが出来ます。

また、直接作りこむこと以外に、CSVやHTML、Excel形式のファイルなどを読み込ませることもできます。

Excelの方が慣れているという方は、先にExcelで作成して、それを読み込ませるという使い方も出来ます。
使いやすい方法で作成できるのも嬉しいポイントですよね。

ただし、スマホでの表示があまりよくありません…。
その点だけ注意し、実際にスマホでの表示がどうなるのかを確認しながら設置するのがお勧めです!

あなたがブログ集客できない原因はこれです!
あなたがブログ集客できない3つの理由と改善策
「ブログを更新しているのに集客ができない…。」
とお悩みのあなた。もしかしたらこれが原因では!?
 
今すぐ無料でダウンロードして原因を特定して改善させましょう!
 

あなたがブログ集客できない原因はこの3つのうちどれかでは!?
あなたがブログ集客できない3つの理由と改善策

集客用にブログを立ち上げて更新しているのになぜか全くお問い合わせが来ない…。」

とお悩みの個人事業主・一人会社の社長のあなた!

その原因はこの3つのうちのどれかですよ!

 

集客ブログは一見すると複雑に感じられるかもしれませんが、これまでの7年間で200以上のブログ指導をしてきた中で実は集客ができないブログには共通する3つの事がある事がわかりました。

つまり、あなたも3つ全てもしくはいずれかが原因になっていると言う事です。
それが一体何で、どのようにして改善させると良いのか。今すぐチェックしてみませんか?

 

メルマガのご購読、特典の受け取りは全て無料です!

 

今すぐ詳細ページをご確認ください。