SWELLの記事パーツを一挙紹介 | SWELLオリジナルブロック一覧

SWELLに用意されているオリジナルブロック、全22個を紹介！

有料テーマのSWELLを購入検討されている方へ。SWELLで使える記事パーツにはどんなものがあるか気になりませんか？そこで今回 SWELLの記事パーツを調査してきました。このページでは全パーツのうちSWELLの完全オリジナルのもの全22個を紹介します！

パーツのことをWordPressで"ブロック"と呼びます。

解説！

ブロックには３つの種類があります。

機能とデザインがWordPressが用意したもの
機能はWordPress、デザインはテーマ側が用意したもの
機能もデザインもテーマ側が用意したもの

(採点競技で例えると、２は「規定演技」、３は「自由演技」みたいなイメージです)

今回紹介するのは３番目の機能もデザインもテーマ独自の「テーマオリジナルのブロック」についてです。完全オリジナルなのでテーマの独自性が最も出る部分であります。

定番系のブロック
FAQ	質問(Q)と答え(A)を並べて表示。「よくある質問」のような場所で活躍。構造化データに対応。
ステップ	STEP１、STEP２、STEP３....という装飾。何かの手順を説明するときに便利。
ふきだし	アイコンとふきだしを表示。キャラクターが喋っているような演出ができる。
枠線・ボックス系のブロック
キャプションボックス	段落や画像などを囲む枠線。上部にキャプション(タイトル)を付けることができる。
リスト入りグループ	リスト(箇条書き)を囲む枠線。
ボタン・リンク系のブロック
バナーリンク	画像からバナー風のリンクが作れる。わざわざバナーを作る必要がない！
SWELLボタン	高機能のボタン機能。クリック率を計測することができる！
関連記事	ブログカード(=カード状の記事リンク)
ギミック系のブロック
アコーディオン	クリックすると隠れていたコンテンツが伸びて登場する仕掛け。記事が長くなるときに使うと便利。
タブ	表示するコンテンツをクリックで切り替えることができる仕掛け。
ABテスト	２パターンのコンテンツをランダムで表示する仕掛け。SWELLボタンブロックや広告タグブロックと組み合わせて使うことでどちらの反応がいいか計測できる。
制限エリア	特定の条件下のみで表示されるコンテンツ。ログイン状態、期間、ページ単位などいろんな条件を指定できる。
呼び出し系のブロック
広告タグ	あらかじめ作成しておいた広告用のパーツ(広告タグ)を呼び出す。
ブログパーツ	あらかじめ作成しておいたパーツ(ブログパーツ)を呼び出す。
ナビゲーション系のブロック
ボックスメニュー	アイコンをタイル状に並べたリンク一覧。よくサイドバーで使われる。
リンクリスト	リンクをリスト状(箇条書き状)に表示する。リンクは自動作成も可能(カテゴリ一覧やタグ一覧など)。
レイアウト系のブロック
リッチカラム	コンテンツを横並べにする。WordPress本体の同機能よりハイスペック！
フルワイド	背景を横幅いっぱいにするデザイン。トップページを作るときに活躍！
記事一覧系のブロック
投稿リスト	記事の一覧を自動で作って挿入。記事の並べ方はいろんな指定ができる。
RSS	他サイトの更新情報を記事一覧で挿入。
その他ブロック
説明リスト(DL)	(WordPress本体には備わっていない)HTMLの記述リスト(DL)が使用できる。
商品レビュー	商品の名前、写真、メリット、デメリットなどをセットで表示してくれる。レビュー記事で活躍。構造化データに対応。

分類は当サイトによるものです。

タグ

構造化データ対応：構造化データに対応
上位互換：WordPress本体に似た機能があるがそれより機能が上のブロック

定番系のブロック

まずは定番系のブロックから紹介します！他のテーマでもよく見かけるこれらのブロックは当然SWELLにも用意されています。

FAQブロック構造化データ対応

質問(Q)と答え(A)をセットで表示するブロック。「よくある質問」のようなコーナーで活躍するでしょう！

デザインは４種類！

デザイン(スタイル)はシンプル、線あり、ボックス、ストライプの４種類から選べます。

HTMLタグを変更可能！

質問部分のHTMLタグはh2、h3、h4、dtに変更できます！ありがたい配慮！

構造化データに対応！

構造化データの自動出力にも対応しています。面倒なコードの貼り付けを自動で行ってくれてありがたい。

評価：A

HTMLの変更や構造化データの自動出力など良設計！とても使いやすい！

ステップブロック

STEP１、STEP２、STEP３....といった装飾です。何かの手順を説明するときに便利！

「STEP」という箇所は好きな文字に変更可能。

デザインは３種類！

デザイン(スタイル)はデフォルト、ビッグ、スモールの３種類があります。

HTMLタグを変更可能！

STEPに続くタイトルのHTMLタグをh2、h3、h4、divなどに変更できます。うれしい配慮！

ふきだしブロック

キャラクターが喋っているようにアイコンとふきだしをセットで表示します。アイコンを交互に変えれば会話の演出もできますね。

デザインは２種類！

デザイン(スタイル)は発言、心の声の２種類があります。

AFFINGERとの比較

AFFINGERにもふきだしブロックはあります。ただし登録できるアイコン画像が10個までです。それ以上登録したい場合は別売りプラグインを購入しなければなりません。

枠線・ボックス系のブロック

枠線・ボックス系のブロックです。重要な部分や主張したい部分を強調したいときに活躍します！

キャプションボックスブロック

題名(キャプション)が付いている枠線です。題名は変更可能。枠線で段落や画像などなんでも囲めます。

デザインは７種類！

デザイン(スタイル)はデフォルト、小、枠上、枠上２、枠内、浮き出し、内テキストの７種類があります。

リスト入りグループブロック

リスト(箇条書き)専用の枠線です。

デザインは８種類。

ボタン・リンク系のブロック

ボタン・リンク系のブロックを紹介します。

バナーリンクブロック

画像の上に文字を載せて擬似的にバナーを作ってくれます。わざわざ画像編集ソフトでバナー画像を作る必要がありません！

SWELLボタンブロック上位互換

WordPresss側にもボタンパーツは用意されていますがそれよりもハイスペックなボタン機能です。

SWELLのボタンは表示された回数やクリック率を測定することができます。また、初心者には挿入方法がわかりにくいアフィリエイトコードをまるごとペーストできる機能も備わっています(とてもありがたい！)。

デザインは７種類！

デザイン(スタイル)はノーマル、立体(カーソルを合わせるとボタンを押したような演出)、キラッと、アウトライン、MOREボタンの５種類があります。

ギミック系のブロック

ギミック(仕掛け)系のブロックを紹介します。