SWELL:ボックスメニューの使い方や出来ること

SWELL:ボックスメニューの使い方や出来ること

この記事がお勧めな方

  • SWELL(スウェル)のボックスメニューの使い方を知りたい方
  • SWELL(スウェル)のボックスメニューで出来ることを知りたい方
  • SWELL(スウェル)のボックスメニューがどんな感じか知りたい方

SWELLのボックスメニューはこんな感じです。

SWELL:ボックスメニュー表示

ブロックツールの「ボックスメニュー」を選択することで「ボックスメニュー」を表示することができます。

SWELL:ボックスメニュー

SWELL:ボックスメニューで出来ること

SWELL:ボックスメニューの設定
① スタイルボックスメニューのスタイル変更が可能
② カラー設定テキストとアイコンのカラー設定が可能
③ 設定テキストとアイコンの並びやアイコンサイズなどの設定が可能
④ デバイス制限スマホとPCで表示制限が可能
⑤ ブロック下の余白量ブロック下の余白量の設定が可能

① スタイル

ボックスメニューのスタイルを2種類から変更することができます。

SWELL:ボックスメニュー(スタイル設定)

標準

スタイル:「標準」はこんな感じです。

SWELL:ボックスメニュー(スタイル設定:標準)

塗り

スタイル:「塗り」はこんな感じです。

SWELL:ボックスメニュー(スタイル設定:塗り)

② カラー設定

カラー設定ではテキストとアイコンの色を設定することができます。

SWELL:ボックスメニュー(カラー設定)

テキストカラーの変更

テキストカラーを変更するとこんな感じです。

SWELL:ボックスメニュー(カラー設定:テキストカラーの変更)

アイコンカラーの変更

アイコンカラーを変更するとこんな感じです。

SWELL:ボックスメニュー(カラー設定:アイコンカラーの変更)

③ 設定

「設定」ではアイコンとテキストの並びやアイコンサイズを設定することができます。

SWELL:ボックスメニュー(設定)

アイコンとテキストの並び

アイコンとテキストの並びを「縦並び」もしくは「横並び」に設定することができます。

SWELL:ボックスメニュー(設定:アイコンとテキストの並び)

ボックス間の余白

ボックス間の余白を設定することができます。

ボックス間の余白を設定するとこんな感じです。

SWELL:ボックスメニュー(設定:ボックス間の余白)

アイコンサイズ

アイコンサイズを変更することができます。

アイコンサイズを変更するとこんな感じです。

SWELL:ボックスメニュー(設定:アイコンサイズの変更)

列数

列数を変更することができます。

列数を変更するとこんな感じです。

SWELL:ボックスメニュー(設定:列数の変更)

④ デバイス制限

スマホとPCで表示制限をすることができます。

SWELL:ボックスメニュー(デバイス制限)

⑤ ブロック下の余白量

ブロック下の余白量を設定することができます。

SWELL:ボックスメニュー(ブロック下の余白量)

ボックスにアイコンや画像を設定する方法

ボックスメニューにアイコンや画像を設定するにはまず設定したい個別のボックスをクリックします。

SWELL:ボックスメニューの個別ボックスを選択

画面右側にアイコン設定が表示されるので、そこからアイコンや画像を設定することができます。

SWELL:ボックスメニュー(アイコン設定)

画像の設定

ボックスメニューに画像を設定するには「アイコン設定」の「画像」で表示したい画像をアップロードします。

ただ、私がこの記事を執筆時点で画像をアップロード使用と思いましたが、うまくアップロードできませんでした。

何かの不具合かもしれません。

うまくアップロードできない場合は一度画像ブロックで登録したい画像を表示させて「メディアライブラリ」に登録してみてください。

WordPressメニューの「メディア」から新規追加でも構いません。

メディアライブラリに登録された画像に関しては正常に表示されました。

画像を表示するとこんな感じです。

SWELL:ボックスメニュー(画像を設定した例)

アイコンの設定

ボックスメニューにアイコンを設定することができます。

SWELLではアイコンの種類も豊富で簡単に活用できるのが本当に便利です。

アイコンを表示するとこんな感じです。

SWELL:ボックスメニュー(アイコンを設定した例)

SWELL(スウェル)のボックスメニューの実際表示はSWELL(スウェル)で作成したサンプルサイトでも確認することができますので、そちらも参考にしてみてください。

→ SWELLで作成したサンプルサイト(ボックスメニュー)

ブログの記事を書くのにAIライティングツールを利用すると効率を上げることができます。

ハムタ
ハムタ
パパくま
パパくま

現在は多くのAIライティングツールがあります。

そのほとんどが無料お試しでの利用が可能です。

お試し期間が限定のツールもありますが、中には機能制限はありますがずっと無料で利用できるツールもあります。

無料お試しがずっと可能なAIライティングツールをまとめてみたので、是非試してみてください。

無料お試しがずっと可能なAI記事作成ツール
無料お試しがずっと可能なAIライティングツール

2024/10/12    ,

「記事作成にAIを活用してみたいなぁ」 「でも料金はかけたくないなぁ」 そんな方に無料お試しがずっと可能なAIライティングツールをいくつか紹介します。 もちろん無料お試しなので、機能をフルに使用するこ ...

SWELLの購入とインストール方法

SWELLの設定関係

SWELLの使い方

SWELLのデザインカスタマイズ