悩む人ブロックエディタでSWELL専用機能の使い方について詳しく教えてほしいです。
こういった悩みにお答えします。
本記事で解決できること
- ブロックツールバーで使えるSWELL専用機能の使い方
- WordPress標準搭載のブロックをカスタマイズしたブロックの使い方
- SWELL専用のカスタムブロックの使い方
是非、最後までご覧ください。
はじめに
（アイコン）にカーソルを乗せてみて下さい。記事へのリンクが貼っている場合は画像が浮き上がります。
SWELLのブロックエディタの使い方【ブロックツールバー】
ブロックツールバーとは
ブロックエディタでブロック編集時に表示されるのがブロックツールバーです。
ブロックツールバーを拡張する
（SWELL設定）を選択すると、「ブロックツールバーの表示設定」が開きます。
既に拡張はされていますが、以下が非表示になっています。
- テキスト色
- 背景色
チェックを付けると追加されます。
ブロックツールバーの機能を解説【SWELL専用機能に絞って紹介】
WordPressの標準機能
SWELL専用機能
ブロックツールバーから、「デバイスコントロール」を設定できます。
スマホサイズでのみ表示する
PCサイズでのみ表示する
サイドバーの「デバイス制限」から、デバイスコントロールを設定することもできます。
表示例
ブロックツールバーから、「ブロック下の余白量」を設定できます。
ブロック下の余白量：3em
ブロック下の余白量：6em
サイドバーの「ブロック下の余白量」から、ブロック下の余白量を設定することもできます。
「さらに表示」の中身を見る
インラインコード
インライン画像
キーボード入力
ハイライト
上付き
下付き
打ち消し線
脚注
言語
「SWELL装飾」の中身を見る
「ショートコード」の中身を見る
記事内広告
スマホだけ改行
PCだけ改行
アイコン
評価用スター
HTML挿入
サイドバーから設定できます。
サイズ：「S M L XL XXL」から選択できます。
単位：「px em rem」から選択できます。
ブロックツールバーから設定できます。
サイズ：「XS S L XL」から選択できます。
単位：「px rem em % vw vh」から選択できます。
サイドバーから設定できます。
ブロックツールバーから設定できます。
サイドバーから設定できます。
ブロックツールバーから設定できます。
「オプション」の中身を見る
コピー
複製
前に追加
後に追加
スタイルをコピー
スタイルを貼り付け
グループ化
ロック
名前を変更
パターンを作成
移動
HTMLを編集
削除
この先で登場するアイコンの意味
※ 画像にカーソルを乗せると説明文が表示されます（PCのみ）。今、試しに下記の
にカーソルを乗せてみて下さい。説明文が表示されます。
：記事なし- ：関連記事
- ：記事公開予定
- ：SWELL専用機能「デバイスコントロール」のみ使える
- ：SWELL専用機能「ブロック下の余白量」のみ使える
- ：SWELL専用機能「ボーダー設定」が使える ※ 以下、参照
- ：SWELL専用機能「スタイル」が使える ※ 以下、参照
- ：SWELL専用機能なし
ボーダー設定
スタイル
SWELLのブロックエディタの使い方【WordPressに標準搭載されているブロックをカスタマイズした代表的なブロック】
SWELLのブロックエディタの使い方【SWELL専用のカスタムブロック】
SWELLのブロックエディタの使い方【WordPressに標準搭載されているブロック】
テキスト
メディア
デザイン
ウィジェット
※ 画像にカーソルを乗せても説明文は表示されません。
- ：記事なし
- ：SWELL専用機能「ブロック下の余白量」のみ使える
- ：SWELL専用機能なし
埋め込み
※ 画像にカーソルを乗せても説明文は表示されません。
- ：記事なし
- ：SWELL専用機能「ブロック下の余白量」のみ使える
今回は以上です。