WordPressテーブルブロックの使用方法

WordPressテーブルブロックを使用すると、投稿またはページのテーブルを作成できます。 これは、表形式のデータを表示するのに最適です。 使い方は簡単で、ウェブサイトのデザインに合わせてスタイルを設定できます。

この記事では、テーブルブロックについて詳しく見ていきます。 投稿とページに追加する方法、その設定とオプション、ベストプラクティス、よくある質問について説明します。

投稿またはページにテーブルブロックを追加する方法

ブロックを追加するブロックインサーターをクリックして、テーブルを検索します。 テーブルブロックが表示されたら、それをクリックしてコンテンツに追加します。 または、画面の左上にあるインサーターを使用するか、 / tableと入力してEnterキーを押します。

これにより、列と行の数を指定できるテーブルブロックが追加されます。 テーブルに必要な列と行の数を入力し、[テーブルの作成]をクリックします。

テーブルが画面に表示され、セルにコンテンツを追加したり、下部にキャプションを追加したりできます。 デフォルトのスタイルは、使用しているWordPressテーマによって異なります。 例として、Twenty Twenty-OneWordPressテーマを使用しています。

テーブルブロックの設定とオプション

設定とオプションを見てみましょう。

テーブルブロックツールバー

テーブルをクリックすると、テーブルブロックツールバーがテーブルの上に表示されます。

ブロックタイプまたはスタイルの変更

これにより、テーブルをグループに追加し、レイアウトの列数（テーブルの列ではない）を設定し、テーブルに必要なスタイルを選択できます。 スタイルには2つのオプションがあります。 デフォルトのスタイルの背景は無地ですが、Stripesは1行おきに灰色のストライプを追加します。 オプションにカーソルを合わせると、プレビューが表示されます。

配置を変更する

テーブルを左、中央、右、幅広、または全幅に設定します。 ワイド幅とフル幅は、すべてのテーマでサポートされているわけではありません。 この例では、幅を広く設定しました。

列の配置

各列の配置を個別に選択します。 それらを左、中央、または右の位置合わせに設定します。 この例では、左の列を右に設定し、残りを中央に設定しました。

太字と斜体

太字と斜体の設定は、強調表示したテキストを調整します。 表またはキャプション内のテキストは、太字、斜体、またはその両方にすることができます。 すべてのセルを個別に選択する必要があります。

リンク

表またはキャプション内の任意のものへのリンクを追加します。 この例の時計名とキャプションへのリンクを追加しました。 URLを入力すると、以前に使用したURLをWebサイトで検索し、それらを提案として提供します。

その他のテーブルオプション

これにより、いくつかのオプションを含むドロップダウンボックスが開きます。 次の各オプションが上の画像に追加されています。

インラインコード–コードとしてスタイル設定されたテキストを表示します。

インライン画像–メディアライブラリを開きます。ここで画像を選択して、カーソルの位置にインラインで配置できます。 画像を選択して幅を変更できます。

キーボード入力–コンテンツにキーボードタグを追加して、キーボード入力を定義します。 ブラウザのデフォルトの等幅フォントで表示されます。

取り消し線–強調表示したテキストに線を引きます。

下付き文字–強調表示したテキストを下付き文字として作成します。

上付き文字–強調表示したテキストを上付き文字にします。

テキストの色–強調表示したテキストの色を変更できます。 事前に作成された色から選択するか、カラーピッカーツールを使用して色を選択するか、16進コードまたはRBGコードとして値を入力できます。

テーブルの編集

[テーブルの編集]オプションは、行と列を挿入または削除できるドロップダウンボックスを開きます。 選択した行または列の前後に追加します。 これにより、いつでもテーブルのサイズを簡単に変更できます。 この例では両方を追加しました。

ブロックオプション

[テーブルブロックオプション]ボタンをクリックすると、ドロップダウンボックスが開き、選択できるオプションが増えます。 テーブルオプションは次のとおりです。

その他の設定を非表示–このオプションは、右側のサイドバーを非表示にして、ワークスペースをすっきりさせます。

コピー–テーブルブロックをクリップボードにコピーします。 その後、そのページまたは投稿内の任意の場所に貼り付けることができます。

複製–テーブルの下にテーブルブロックの複製を作成します。

前に挿入–テーブルブロックの前にブロックのスペースを挿入します。

後に挿入–テーブルブロックの後にブロックのスペースを挿入します。

移動先–ブロックエディタ内に青い線を配置します。 矢印キーを使用して、行を上下に移動できます。 テーブルブロックを移動する場所に青い線が表示されたら、Enterキーを押すと、ブロックが自動的に新しい場所に移動します。

HTMLとして編集–このオプションはコードエディタに変更されるため、コンテンツをHTMLとして編集できます。

再利用可能なブロックに追加–このオプションは、テーブルブロックを再利用可能なブロックに追加して、任意のページまたは投稿で再び使用できるようにします。

グループ–これによりグループが作成されるため、すべてのブロックをまとめて調整できます。

ブロックの削除–このオプションはテーブルブロックを削除します。

テーブルブロック設定

テーブルブロックの設定は、他の設定と一緒に右側のサイドバーに配置されます。 サイドバーが開いていない場合は、右上隅にある歯車のアイコンをクリックし、テーブルブロックの任意の場所をクリックして設定を表示します。 アイコンと簡単な説明が付いた「表」という単語が表示されます。 [スタイル]、[色]、[テーブル設定]、および[詳細]のオプションも表示されます。 各タイトルをクリックして、設定を開きます。

スタイル

テーブルブロックスタイルを使用すると、ストライプのないテーブルとストライプのテーブルのどちらかを選択できます。 2つのスタイルの下にあるドロップダウンボックスでデフォルトのスタイルを設定することも、未設定のままにすることもできます。 スタイルはプレビューを提供します

色

色を使用すると、テーブルブロックのテキスト、グリッド、および背景色を制御できます。 事前に選択されたいくつかの色から選択するか、カラーピッカーからカスタム色を選択します。

テキストとグリッドには、1つを選択します。 背景には、単色を選択するか、グラデーションを作成します。 テキストと背景色の両方で、16進コードまたはRGBコードを入力できます。 背景のグラデーションは、線形または放射状にすることができます。 リニアには、方向を制御できる設定が含まれています。

上記の例では、テキストとグリッドに白を選択し、放射状のグラデーションに青の色合いをいくつか選択しました。

ストライプスタイルを選択した場合、背景色は背景のストライプ色を制御します。 ストライプは、単色またはグラデーションの背景にすることができます。

テーブル設定

テーブル設定には、オンとオフを切り替えることができるオプションがあります。 設定は次のとおりです。

固定幅–セルを同じサイズにするため、テーブルは一貫して見えます。 セルがコンテンツのサイズに適応して異なるサイズになるのを防ぎます。

ヘッダーセクション–太字のテキストで行を上部に追加します。 太線で他のセルから分離されています。 これらは離れており、列のラベルとして機能します。

フッターセクション–フッターとして機能する行をテーブルの下部に追加します。 太線で他のセルと区切られていますが、デフォルトではテキストは太字ではありません。 これは、情報の要約、合計の提供、または大きなテーブルのタイトルの繰り返しに適しています。

高度

Advanced Table Block設定には、HTMLアンカーのオプションとCSSクラスを追加するためのフィールドが含まれています。 アンカーは特別なURLとして機能するため、テーブルブロックに直接リンクできます。 CSSクラスフィールドを使用すると、カスタムCSSクラスを追加してブロックのスタイルを設定できます。 デフォルトでは、スタイル設定で選択したスタイルのクラスがあります。

テーブルブロックを効果的に使用するためのヒントとベストプラクティス

表形式のデータまたはコンテンツを表示する必要があるときはいつでも、テーブルブロックを使用してください。 それらを使用して列を作成しないでください。 これには、列ブロックが最適です。

段落ブロックを使用してテーブルのタイトルを追加します。

ヘッダーを追加して、行のタイトルを作成します。 わかりやすい明確なラベルを使用してください。

固定幅を使用して、テーブルをより洗練されたプロフェッショナルな外観にします。

読みやすくするために、大きなテーブルには[ストライプ]を選択します。

フッターを使用して、情報を要約したり、テーブルが大きい場合はタイトルを再度表示したりします。

テーブルブロックに関するよくある質問

テーブルブロックの最適な使用法は何ですか？

このブロックは、表やグラフを作成するのに最適です。

テーブルブロックを使用して列を作成できますか？

はい。ただし、列を十分に制御することはできません。 これには列ブロックを使用するのが最善です。

テーブルサイズは後で変更できますか？

はい。 テーブルのオプションを使用して、行または列を挿入または削除します。

結論

これがWordPressテーブルブロックの見方です。 これは基本的なテーブルを作成するための優れたブロックであり、Webサイトに合わせてある程度スタイルを設定することもできます。 このブロックは、ブロックエディタの利点の1つです。 このブロックで作成されたテーブルは単純ですが、うまく機能し、簡単に作成できます。

我々はあなたから聞きたい。 WordPressコンテンツでテーブルブロックを使用していますか？ コメントであなたの経験について教えてください。

Seahorse Vector /shutterstock.com経由の注目の画像