メインコンテンツへ移動
読了時間:7分 (1477語)

Gutenbergエディターでテーブルを作成および管理

バナー・チャート

テーブルやチャートは、私たちがウェブサイトを持っているときに思っているよりも重要です。これにより、私たちが価格、計画、会社の軌跡などを表示する方法が本当に簡単になります。

 作成したテーブルを検索するのは、ショートコードをコピー/ペーストする必要があるため、非常に面倒です。しかし、すべてのテーブルを検索するためのブロックがあればどうでしょうか? WP Table Manager を使用すると、使いやすいGutenberg WordPressエディターでそれができます。

WP Table Manager は、ブロック内に検索ボックス付きの表を追加できるGutenbergエディタのブロックを追加します。.

 

クライアントのウェブサイトのための堅牢なテーブル管理ソリューションをお探しですか?

プライステーブルから製品比較まで、このプラグインはデータを明確にユーザーフレンドリーに表示するための機能を提供しま゙す。
競合作るためのエッジドを手に入れる

プラグインを今すぐ入手

 

Gutenberg 用のこのプラグインを使用して WordPress テーブルを作成する

この投稿では、 WP Table Manager を使用して価格比較表を作成します。まず、表の作成方法について説明します。.

まず、 テーブル マネージャー > すべてのテーブル、このセクションで + 新規作成 > テーブルを、テーブル エディターが開きます。テーマを使用すると作業が非常に簡単になるので、テーマを選択して、 テーマ > テーマの選択を

 

 

テーマのすべてのオプションが表示されるので、価格比較表に適したテーマを選択します。.

 

 

OKをクリックします(テーブル内のすべてのデータが削除されることに注意してください)。.

テーマを追加したので、ほぼすべての作業が完了しました。.

 

 

必要なのは、テーブルをニーズに合わせて簡単な調整を行い、適応させることだけです。多くの行を削除し、それらの多くを編集します。これらは、Excelを使用しているかのようにクリックして入力を開始するだけで編集できます。.

削除するには、行をクリックして右クリックし、 削除をクリックします。

 

 

セルを編集する場合は、クリックするだけで、コンテンツをカスタマイズするために使用できる高度なエディタが開きます。.

 

 

さらにテーブルをカスタマイズしたい場合は、セルの色を変更することができます。上部のツールを使用して、変更したいセルの色を変更するだけです。.

 

 

テーブルは自動的に保存されるため、手動で保存する必要はありません。.

テーブルを作成した後、Gutenberg Editorブロックを使用して投稿に追加できます。.

に移動すると 投稿 > 新規追加、Gutenbergエディターが表示されます。そこで、 WP Table Manager ブロックを選択します。

 

 

これにより、カテゴリと表が表示される検索フィールドが追加され、表をクリックするだけで表を追加できます。.

 

 

テーブルが追加され、投稿を公開するだけで、テーブルがそこに表示されます。テーブルをクリックして投稿/ページを公開するのと同じくらい簡単です。.

 

 

以上で、10分もかからずに価格表を作成して投稿しました。とても簡単ですよね?

 

WordPressで WP Table Manager を使用してチャートを作成する

はい、表からチャートを作成するオプションもあります。さらに嬉しいことに、チャートセクションには専用のGutenbergブロックがあるため、投稿を作成する際に簡単にチャートを見つけることができます。.

に移動します [テーブル マネージャー] > [すべてのテーブル]。グラフに反映させたいデータを含むテーブルが作成されているはずです。このグラフを作成するための情報を含むテーブルが準備されています。

良い方法としては、作成したいテーブルの種類ごとにカテゴリを作成することです。たとえば、ここでは「チャート」というカテゴリを作成しました。.

カテゴリの作成は非常に簡単です。そのためには、 [+ 新規作成] > [カテゴリ]

 

 

最後に、カテゴリのタイトルを入力し、親カテゴリ(これがサブカテゴリの場合)を選択し、 完了をクリックします。

 

 

では、チャートを作成するテーブルに移動しましょう。5カ国の人口に基づいてテーブルを追加しました。.

 

 

グラフを作成するには、グラフに追加したいセルを選択し、 「グラフ」>「データからグラフを作成」をクリックする必要があります。

 

 

 ここで、右側のメニューで作成されたチャートが表示され、チャートをカスタマイズするためのツールが表示されます。.

 

 

この例では、円チャートを使用します。.

 

 

右側のパネルの下部で、各フィールドの色を選択して、使用しているテーマに合うように色を設定できます。.

 

 

に進み 「投稿」>「新規追加」 、投稿を作成して、作成した新しいグラフを追加しましょう。

Gutenberg Editorで、「WP Table Manager Chart」ブロックを検索して投稿に追加します。.

 

 

これにより、検索フィールドが開き、使用可能なすべてのチャートを確認できます。.

 

 

ご覧のとおり、利用可能なすべてのカテゴリ、テーブル、チャートが表示されます。そのため、すべてのカテゴリを整理しておく必要があります。次に、追加するチャートをクリックします。この例では、「人口チャート」です。.

 

 

ご覧のとおり、ショートコードは自動的に追加されるため、公開するだけですべて完了です。.

 

 

しかし今、チャートのデータを更新したい場合はどうなるでしょうか? 新しいチャートを作成すべきでしょうか? いいえ!テーブルの中のデータを編集するだけで、チャートは自動的に更新されます。.

この例では、ツバルの人口は11147です。画像のように、人口を20000に変更して、再度チャートを確認してみましょう。.

 

 

チャートが更新されたはずです。確認してみましょう。.

 

 

はい、魔法は完了しました。表内のデータを変更するだけで簡単に変更できる動的なチャートを作成しました。.

 

さらに、WordPressのデータベースからのテーブル

データベースからテーブルを作成するオプションもあり、データベースに変更があった場合はこのテーブルが自動的に更新されます。データベースに情報が保存されていて、それに基づいてテーブルやグラフを作成したい場合は、 [+ 新規作成] > [データベーステーブル]

 

 

これにより、データベースに含まれるすべてのテーブルが表示されるページにリダイレクトされるため、必要な列を選択するだけで、 WP Table Manager がテーブルを自動的に作成します。.

 

 

その後、テーブルに追加したい列を選択できるようになります。たとえば、ここでは著者のコメントタイプと電子メールのみを選択します。.

 

 

最後に、各列のタイトルを選択し、テーブルを作成するためのルールを追加します。.

 

 

次に、 テーブルを作成 テーブルは自動的に作成されます。たとえば、著者の電子メールが「」の場合にのみ変数を表示するなど、追加できる条件があることに留意してください。この電子メールアドレスはスパムボットから保護されています。表示するにはJavaScriptを有効にする必要があります。.”.

 

 

必要な数のルールを追加できます。「追加」をクリックするだけで、新しいルールを設定するための新しいボックスが追加されます。.

これで、データベースからテーブルを作成する方法が非常に簡単であることがわかります。.

 

新しいデザインにより、すべてがさらに簡単になります!

 

全てのウェブマスターへ!

クライアントのウェブサイトを WP Table Managerで強化しましょう。テーブル、チャート、スプレッドシートを簡単に管理・カスタマイズし、クライアントにダイナミックで魅力的なデータビジュアライゼーションを提供します。
今日すぐにお客様のウェブデザインサービスをアップグレードしましょう!

プラグインを今すぐ入手

 

WP Table Managerでテーブルの作成を開始する

これで、WP Table Managerを使用してテーブルを作成し、管理するのがいかに簡単であるかがわかりました。何をお待ちですか? WP Table Manager, what are you waiting for? Go ここ にアクセスし、メンバーシップを購入して、これらのテーブルを最もプロフェッショナルな方法で提供し始めましょう。

 

最新情報をお届け

ブログを購読すると、新しい更新情報があった際にメールでお知らせしますので、見逃すことはありません。.

関連記事

 

コメント 8

高度なテーブルブロックを中央に配置できません。ご助言ください。.

高度なテーブルブロックを中央に配置できません。ご助言ください。.
トリスタン 2020年5月20日(水) 06:54

デフォルトのツールが期待どおりに機能しない場合は、高度な列マネージャーを使用してテーブルを中央に配置できます。たとえば、3列のレイアウトを使用して、テーブルを中央の部分に配置します。これが役立つことを願っています。.

デフォルトのツールが期待どおりに機能しない場合は、高度な列マネージャーを使用してテーブルを中央に配置できます。たとえば、3列のレイアウトを使用して、テーブルを中央の部分に配置します。これが役立つことを願っています。.
ゲスト - ネイサン 2020年5月26日(火) 15:30

高度なテーブルブロックのフォントサイズを調整するオプションを追加していただけますか?これはクライアントからの一般的な要望であり、そうでなければ素晴らしい高度なテーブルブロックから私が見逃している唯一の機能です。.

高度なテーブルブロックのフォントサイズを調整するオプションを追加していただけますか?これはクライアントからの一般的な要望であり、そうでなければ素晴らしい高度なテーブルブロックから私が見逃している唯一の機能です。.
トリスタン 2020年5月27日(水) 05:49

了解しました!

了解しました!
ゲスト - サンダー 2020年6月9日(火) 12:40

テーブルセルにリストを含めることは可能でしょうか?

テーブルセルにリストを含めることは可能でしょうか?
トリスタン 2020年6月9日(火) 12:50

現在はできませんが、プラグインディレクトリのサポートフォーラムに機能リクエストを投稿することをお勧めします。.

現在はできませんが、プラグインディレクトリのサポートフォーラムに機能リクエストを投稿することをお勧めします。.

こんにちは!Advanced Tablesのバックエンドとフロントエンドでの表示が大きく異なることに気付きました。コメントにスクリーンショットを添付する方法やサポートにメールを送る場所がわかりません。これはなぜ起こっているのでしょうか?

こんにちは!Advanced Tablesのバックエンドとフロントエンドでの表示が大きく異なることに気付きました。コメントにスクリーンショットを添付する方法やサポートにメールを送る場所がわかりません。これはなぜ起こっているのでしょうか?
トリスタン 2020年6月15日(月) 12:31

テーマによってテーブルに自動的にスタイルが適用されることがあります。プラグインディレクトリのサポートフォーラムでサポートリクエストを送信してください。

テーマによってテーブルに自動的にスタイルが適用されることがあります。プラグインディレクトリのサポートフォーラムでサポートリクエストを送信してください。
既に登録済みですか? こちらからログイン
2026年5月16日(土)

キャプチャ画像