プラグイン

”横スクロール対応”の表が作れるプラグイン「Flexible Table」のカスタマイズ方法

wordpress プラグイン Flexible Table カスタマイズ方法 画像
WEB Creator

Flexible Tableは、WordPressで簡単にテーブルを作成し、カスタマイズできる便利なプラグイン。

初心者でも直感的に操作でき、デザイン性の高い表を素早く作成することができます。この記事では、Flexible Tableの導入方法、使い方、そして活用する際のポイントを詳しく解説します。

Flexible Table Blockをインストールしよう

Flexible Table Blockを検索する

ナビゲーションメニューの「プラグイン」(①)→「新規プラグインを追加」をクリックし(②)、右上の検索ボックスに「Flexible Table Block」と入力する(③)。

Flexible Table Blockをインストールする

表示された「Flexible Table Block」プラグインの「今すぐインストール」をクリックする。

プラグインを有効化する

インストールが完了したら「有効化」をクリックして、プラグインを有効にする。

Flexible Table Blockの使い方

Flexible Table Blockを挿入する

上部にある「+」マークをクリックし(①)、ブロック挿入ツールを表示させ、Flexible Table Block(②)をクリックする。

テーブルを作成する
  • ヘッダーセクション、フッターセクションのON/OFFを選択する
  • 必要な列と行の数を指定する
テーブル内容を編集する

セルをクリックして、必要なデータを直接入力する。

デザインを整える

特定のセルや行に色やフォントを設定する。

スマホでスライド表示に対応させる

スマホでの閲覧時に表が画面に収まらない場合、スライド(横スクロール)表示を有効にするととっても見やすくなります。

特に5カラム以上の表はスマホでの表示が厳しくなってくるので、スライド表示への切り替えがおすすめです。

  1. 作成した表をクリックする
  2. 右サイドバーの「テーブル設定」をクリックする
  3. 「モバイル表示でスクロールする」にチェックを入れる
  4. 「テーブルの横幅」と「テーブルの最大値」を設定する

Flexible Tableカスタマイズ方法

列と行を増やしたい

表を作成後に行や列を追加することができます。

セルの上や横にある「・(点)」をクリックすると、追加で挿入することができます。

セルのカラーを変更したい

セルのテキストや背景のカラーを変更して目立たせるとさらに見やすい表になります。

  1. カラー変更したいセルをクリックする
  2. 右サイドバーの「セル設定」をクリックする
  3. セルのテキストカラーや背景カラーを決める

複数セルのカラーを一括変更したい

  1. 表左端の「>」をクリックする
  2. 右サイドバーの「複数セル設定」をクリックする
  3. セルのテキストカラーや背景カラーを決める

セルの幅を変えたい

  1. 表上の「下矢印」をクリックする
  2. 右サイドバーの「セルの幅」で調整する

テキストを中央揃えにしたい

  1. 変更したいセルをクリックする
  2. 右サイドバーの「セルの設定」をクリックする
  3. 「セルの配置」で真ん中の「中央揃え」を選択する

カスタマイズ後の表

これまでご紹介してきたカスタマイズ方法で調整した表です。

プラン名初期費用月額料金特徴おすすめの方
ライトプラン0円1,000円基本機能のみ初心者向け
スタンダードプラン5,000円3,000円機能充実個人事業主
プロプラン10,000円5,000円高性能中小企業向け
プレミアムプラン20,000円10,000円フルサポート大企業向け

標準ブロックの「テーブル」はシンプルな作りなので、
カスタマイズしたい場合はFlexible Tableがとても便利ですよ♪

まとめ

Flexible Tableを使えば、煩雑なHTMLコードを使わずに、直感的な操作でテーブルを作成することができます。

レスポンシブ対応やカスタムデザイン機能が充実しているため、あらゆるデバイスで見やすいレイアウトを実現可能にしてくれるところが最大の魅力。

ブログやビジネスサイトで情報を整理する際、見やすいテーブルは訪問者の理解を深め、サイト全体の質を向上させます。

この機会にぜひFlexible Tableを導入してみてください。

ABOUT ME
記事URLをコピーしました