【SWELL】有料プラグイン級|テーブルブロックの新機能紹介(ver2.6.0)

料理レシピ向けカスタマイズ

WordPressテーマSWELLのアップデート情報です。
version2.6.0でテーブルブロック(表)に、便利な機能が追加されました。

この記事ではテーブルブロックに追加された新機能と、その使い方を解説していきます。

この記事を書いた人
  • IT業界22年のベテラン エンジニア
  • WordPressで企業サイトの構築しています
  • 取り扱いWordPressテーマは300個オーバー
SWELLマニアの かんた です
目次

SWELLのテーブルブロックに追加された新機能

【概要】SWELLのテーブルブロックについて

【有料プラグイン級】SWELLのテーブルブロックに追加された新機能!

追加された新機能の紹介です。

テーブルブロックの新機能

  1. 背景にアイコンを表示できる
  2. セル単位で背景色を指定できる
  3. リストを設置できる
  4. インラインボタンを設置できる
かんた

それぞれの詳細と使い方を解説します。

【新機能】背景にアイコンを表示できるようになった

まずはサンプルです↓


商品A

商品B

商品C
機能A少し古い普通最新機能
機能B非対応制限付き使用可
性能A200[単位]500[単位]1000[単位]
性能B500[単位]1000[単位]800[単位]
デザイン普通良い微妙
価格5,000円10,000円15,000円
各製品の比較

この機能、有料プラグインで9,800円するSIMPLE BLOG DESIGNと、ほとんど同じです。

かんた

SWELLユーザーなら無料でこの機能が使える!

使い方

背景にアイコンを設定する手順についてです。

かんた

テーブルブロックを挿入した状態から解説します。

操作内容

背景にアイコンを設置したいセルにカーソルを合わせます。

セル背景」をクリック。

背景アイコン」から表示したいアイコンを選択。

アイコンを選択後、エディターの適当な箇所をクリックしましょう(クリックすることで、セル背景設定オプションが消えます)。

アイコンを設定したセルにカーソルを合わせます。

テキストを入力すれば作業完了です!

【新機能】セルごとに背景色を設定できるようになった

まずはサンプルです↓

フリープラン
0円
プレミアムプラン
1000円/月
機能A
機能B
機能C
制限あり
機能D
機能E
機能F

使い方

特定のセルに背景色を設定する方法についてです。

かんた

テーブルブロックを挿入した状態から解説します。

操作内容

任意のセルにカーソルを合わせます。

セル背景」をクリック。

好みの色を選択。

選択した色が反映されます。

保存のボタンはありません。

エディターの端っこなど、セル背景の設定オプション以外の部分をクリックすると、設定オプションが消えます(設定は保存された状態です)。

【新機能】リストを設置できるようになった

テーブル内にリストを設置したサンプルです↓

商品特徴価格評価

商品A
xxxが便利
xxxもできる
xxxはできない
1000円

商品B
xxxが便利
xxxもできる
xxxはできない
1000円

商品C
xxxが便利
xxxもできる
xxxはできない
1000円
各製品の比較

テーブルブロック内にリストブロックを設定している構成ではありません。

使い方

テーブルブロック内にリストを追加する方法についてです。

かんた

テーブルブロックを挿入した状態から解説します。

操作内容

リストを表示するセルに、任意のテキストを入力。

入力したテキストを選択。

ツールバーの「テーブル内書式」から「リスト風」を選択。

リストスタイルを選択。

【新機能】インラインボタンを設置できるようになった

まずはサンプルです↓


商品A

商品B

商品C
機能A少し古い普通最新版
機能B非対応制限付き使用可
性能A200[単位]500[単位]1000[単位]
性能B500[単位]1000[単位]800[単位]
デザイン普通良い微妙
価格5,000円10,000円15,000円
購入する購入する購入する
各製品の比較

ver2.6.0未満ではブログパーツを使いボタンブロックを設置することができました。今回のアップデートでは、インラインボタンをテーブル内に設置できるようになりました。

使い方

テーブルブロック内にインラインボタンを設置する方法についてです。

かんた

テーブルブロックを挿入した状態から解説します。

操作内容

ボタンを設置したいセルをクリック。

セル内に、ボタンとして表示するテキストを入力。

入力したテキストを選択する。

ツールバーのSWELLアイコンをクリックし、「インラインボタン」をクリック。

ボタンが表示されるので、好きなデザインを選択する。

ペン」のアイコンをクリック。

URL」にリンク先ページのURLを入力する。

初心者

インラインボタンを中央に設定する場合は?

かんた

以下2つの方法があるよ!

操作内容

ツールバーから「テキストの配置アイコン」をクリックし、「カラムを中央配置」を選択。

この方法を使うと、インラインボタンだけでなく上下のセルも中央揃えになります。

操作内容

テーブルブロックを選択し、画面右側のブロックオプションの「テーブル全体の中央揃え設定」をクリックし、「垂直・水平」もしくは「水平方法だけ」を選択。

この方法を使うと、インラインボタンだけでなくテーブルブロック全部のセルが中央揃えになります。

プリセットされている「パターン」を使う方法

パターンにプリセットされているから初心者でも安心

機能がたくさんあると、使い方を覚えるの大変ですよね?

そんなユーザー向けに、オシャレに装飾済みのテーブルがプリセットされています。

プリセットされているテーブル一覧

メリットデメリット
メリット
メリット
メリット
メリット
デメリット
デメリット
デメリット
デメリット

プリセットされているテーブルを使う方法

操作内容

左上の「プラス」のアイコンをクリック。

パターン」をクリック。

[SWELL]テーブル」をクリック。

装飾済みのパターンが一覧表示されます。

好みのデザインのテーブルを選択しましょう!

エディター内に表示されたテーブルの中身を自由に編集すればオシャレなテーブルが出来上がります。

かんた

パターンから設定したテーブルの設定オプションは自由に変更できます。

まとめ

SWELLのテーブルブロックに追加された新機能を紹介しました。
ぜひお試しください!

公式 WordPressテーマ「SWELL」

よかったらシェアしてね!
  • URLをコピーしました!
目次