【WordPress テーマ SWELLをレビュー】ページや記事がサクサク作れる!SWELLブロックを詳しく解説!

SWELLブロック

【PR】本ページはプロモーションが含まれています。

こんにちは!ハセブロです。

今回は、大人気のWordPressテーマ『SWELL『SWELLブロック』をご紹介します。

WordPressテーマSWELLが気になる!

けど…

  • SWELLは難しい?
  • SWELLでどんなことができるの?
  • どんなテンプレートがあるか知りたい

そんな疑問や不安もあるのではないしょうか。

でも、安心してください!SWELLはシンプルなのに高機能で、めちゃくちゃ使いやすいWordPressのテーマです!

WordPressの最新のブロックエディターに完全対応しているので、WordPressに標準搭載のブロックはもちろん、SWELL独自の『SWELLブロック』も使うことで、ページや記事作の作成を効率化できます!

僕はSWELLを導入したことで、あっという間にブログが作成できただけでなく、継続できるようになりました!

おかげさまで『16,000PV以上/月を達成』できるなど、少しずつ結果が出るようになってきましたよ!

本記事では、『SWELLブロック』について詳しく解説しますので、SWELLを導入する際の参考にしてみてください。


\ 初心者の方におすすめのテーマ /

目次

SWELLとは?

SWELLとは?
SWELLとは

では、WordPressのテーマ『SWELL』はどんなテーマなのか?

概要を簡単ご紹介しますね。

SWELLとは?

SWELLトップ
出典 SWELL

『SWELL』WordPressの有料テーマです。

概要は以下の通り。

製品サイトSWELL
開発者
販売価格¥17,600(税込)
販売元株式会社LOOS
動作必須環境PHP 7.3 以上
WordPress 5.9 以上 (推奨:6.1 ~)
対応ブラウザEdge / Chrome / Firefox / Safari
(各最新版)
決済方法クレジットカード 
( VISA / Master / AMEX / JCB )
ライセンスGPL100%
ライセンス制限なし
参考:製品サイト(2024年5月時点の情報)

SWELLは、『シンプルなのに高機能』『使いやすさに定評』がある、とても人気の高いWordPressテーマです。

SWELLを導入する際の注意点として

「必須」環境を満たしていない場合はエラーが発生します。推奨バージョン未満では、ブロック機能が一部使えません。

WordPress.comでの動作保証はいたしません。SWELLはインストール型WordPress.org向け商品です。

引用元SWELL

とあるように、動作必須環境を満たしている必要があります。

SWELLを導入する前に、最新情報利用するWordPressやPHPのバージョンを確認しましょう!

SWELLは初心者の方に超おすすめ

SWELLは初心者の方に超おすすめ
SWELLは初心者の方に超おすすめ

SWELLは、専門知識がない初心者の方に超おすすめWordPressテーマです。

  • シンプルで美しいデザイン
  • 最新のブロックエディターに完全対応
  • テーマカスタマイザーで直観的にブログやサイトが作れる
  • コーポレートサイトやポートフォリオサイトが簡単に作れる

といった特徴に加え、SWELLERS’では設定マニュアルSWELLに関する質問や不具合の報告などが確認できるので、初心者の方でも安心して使えます!

また、買い切り型かつ100%GPLなので、複数のブログやサイトで使えるのでコスパにも優れたテーマですよ!

SWELLの特徴や導入方法について、以下記事で詳しく解説しています。ぜひ参考にしてみてください。

SWELLブロックとは?

SWELLブロックとは?
SWELLブロックとは

最新のブロックエディターに完全対応しているSWELLを導入すると

  • WordPress標準搭載のブロックの見た目がきれいで使いやすくなる
  • SWELLブロックでより効率的かつリッチになる

といったメリットがあります。

一つずつ解説しますね!

WordPress標準搭載のブロックがきれいで使いやすくなる

WordPress標準搭載のブロックがきれいで使いやすくなる
WordPress標準搭載のブロックがきれいで使いやすくなる

WordPress5.0以降で標準搭載されたブロックエディターは、Microsoft WordSharePointGoogleドキュメントnoteなどを使うような感覚でページや記事が作成できます。

無料のテーマでもページや記事は作成できますが、最新のブロックエディターに完全対応したSWELLを導入すれば

  • ブロックが美しいデザインになる
  • ブロックの設定やスタイルの幅が広がる

などの効果が得られますよ!

WordPressのブロックが美しいデザインになる

WordPressに標準搭載されているブロックは、使うテーマによって見え方や操作性が大きく変わります。

SWELL
SWELL

SWELLでは、文字の大きさや行間の余白など、予め読みやすいように美しいデザインが施されているんです!

HTML・CSSなどのプログラミングの知識や、デザインに詳しくなくてもSWELLを導入するだけで、すっきりしたページや記事が作成できます!

SWELLを導入するだけで、見た目がここまで違うのかと驚きましたよ!

WordPressのブロックの設定やスタイルの幅が広がる

SWELLを導入すると、WordPressに標準で搭載されているブロック設定やスタイルの幅が広がります。

ブロックツールバーと設定サイドバーでブロックが調整可能
ブロックツールバーと設定サイドバーでブロックが調整可能

WordPressでは、ブロックツールバーと設定サイドバーでブロックを調整することができます。

SWELLを導入すると、SWELL独自の設定項目が追加されるのでより自由度が高くなるんです!

段落のブロックツールバー
段落のブロックツールバー

例えば、段落のブロックであれば

  • デバイスコントロール
  • ブロック下の余白量
  • SWELL装飾
  • アイコン
  • ショートコード
  • フォントサイズ
  • マーカー

がブロックツールバーに追加されます。

ブロックツールバーで効率的に作業できる
ブロックツールバーで効率的に作業できる

テキストの色や背景色、アイコンの挿入やテキストサイズの調整、マーカーの挿入など、よく使う項目にアクセスしやすくスピーディーに調整することができます!

設定サイドバー
設定サイドバー

設定サイドバーには

  • ボーダー設定
  • スタイル
  • デバイス制限
  • ブロック下の余白量

が追加されます。

スタイルが簡単に変更可能
スタイルが簡単に変更可能

ブロックに枠をつけたり、ふきだしにしたり、アイコンブロックにしたり…、マウスをクリックするだけでON/OFFの切り替えが可能です!

WordPressに標準で搭載されたブロックを、効果的に見せることが簡単にできるようになりますよ!

これらの機能を使うことで、超効率的にページや記事が作成できるようになりますよ!

SWELLブロックとは?

SWELLブロックとは?
SWELLブロックとは

前述したように、最新のブロックエディターに完全対応しているSWELLなら、標準で搭載されているブロックだけでもページや記事が作成できます。

でも、SWELLにはより効率的かつよりリッチなコンテンツを作るためのテンプレートが用意されているんです!

それが、『SWELLブロック』です。

SWELLブロックで効率的にページや記事が作成できる
SWELLブロックで効率的にページや記事が作成できる

SWELLブロックにはよく使うブロックのテンプレートが用意されているので、ページや記事の作成が効率化できるので超便利!

SWELLブロック
SWELLブロック

また、用意されているテンプレートが多すぎないのもポイントです。

「必要最低限」+「あると便利なもの」が凝縮されているので迷いがなくなります!

リストブロックの例
リストブロックの例

SWELLブロックも、目的や好みに応じてスタイルや色などを調整することも可能ですよ!


\ 初心者の方におすすめのテーマ /

SWELLブロックの紹介

SWELLブロックの紹介
SWELLブロックの紹介

では、SWELLブロックにはどのようなものがあるのか?具体的にご紹介しますね!

リスト入りブロック

  • 最新のブロックエディターに完全対応
  • テーマカスタマイザーで直観的に作れる
  • 買い切り型で100%GPL
  • 複数のブログやサイトで使える

上記は、リスト入りブロックで作ったサンプルです。

箇条書きで整理する際に役立つブロックですね!

リスト入りブロックの設定
リスト入りブロックの設定

リストは、設定サイドバーでSWELL独自のスタイルで変更できます。

リストブロックのスタイル設定
リストブロックのスタイル設定

親グループを選択すると、設定サイドバーで好みのスタイルに簡単に変更することができます。

ニュアンスに応じたテンプレートがいくつか用意されているので便利ですね!

アコーディオン

ここをクリックすると開閉

アコーディオンを開くと段落になっています。

上記は、アコーディオンを使ったサンプルです。

アコーディオンの設定
アコーディオンの設定

アコーディオンの項目は、『+』で簡単に追加できます。

親ブロックを選択すると、アコーディオンのスタイルやアイコンの設定などが変更できますよ!

バナーリンク

上記はバナーリンクのブロック。画像を挿入しURLを設定すれば簡単にバナーリンクが作れます。

クリックするとSWELLのページが開きます。

バナーリンクの設定
バナーリンクの設定

設定サイドバーでは、バナーにブラー効果を与えたり、角の丸みやカラー設定などができます。

ボックスメニュー

ボックスメニューは、アイコンつきのボックスメニューが簡単に作れます!

上記は、ボックスメニューで作ったサンプルです。

クリックすると当ブログのページが開きます。

ボックスメニューの設定
ボックスメニューの設定

ボックスメニューの背景カラーやテキストカラーが変更できるほか、リンクボックスの並びや余白量も変更可能です!

また、リンクボックス自体の背景カラーやテキストカラーが変更できたり、アイコンも変更できます。

独自にデザインしたアイコンを使いたい場合は、画像を選択することもできますよ!

SWELLボタン

SWELLボタンは、簡単にボタンが作成できます。

上記は、SWELLボタンで作ったサンプルです。

クリックするとSWELLのページが開きます。

ボタンの設定
ボタンの設定

ボタンのスタイルや、サイズ、カラーなどが設定でき、アイコンも簡単に入れられます!

カラーの変更やクリック率の測定も可能
カラーの変更やクリック率の測定も可能

クリック率も計測できるのでとても便利です!

キャプションボックス

SWELLのおすすめポイント
  • 最新のブロックエディターに完全対応
  • テーマカスタマイザーで直観的に作れる
  • 買い切り型で100%GPL
  • 複数のブログやサイトで使える

上記は、キャプションボックスを使って作成したサンプルです。

キャプションボックスの設定
キャプションボックスの設定

キャプションボックスは、スタイルから好みのデザインに簡単に切り替え可能です!

カラーやアイコンの設定ができる
カラーやアイコンの設定ができる

カラーやアイコンも簡単に設定できますよ!

リッチカラム

ポイント 1

ブロックエディターに完全対応


ポイント 2

直感的に操作できる


ポイント 3

買い切り型/100%GPL


上記は、リッチカラムを使って作成したサンプルです。

リッチカラムは超便利で大好きなブロックです!

クリックするとSWELLのページが開きます。

WordPressにはカラムというブロックが標準で搭載されていますが、リッチカラムの方がより細かく設定できますし、とにかく使いやすい!

後述するフルワイドと組み合わせると、会社のホームページを作る際にもめちゃくちゃ重宝するブロックですね!

リッチカラムの設定
リッチカラムの設定

カラム項目は『+』をクリックするだけで追加できます!

リッチカラムの親の設定
リッチカラムの親の設定

さらに親のリッチカラムを選択すると、全体のスタイルや設定ができるようになります。

僕がおすすめするWordPressテーマ

SWELL

SWELLトップ
出典 SWELL

【おすすめポイント】

  • 最新のブロックエディターに完全対応
  • テーマカスタマイザーで直観的に作れる
  • 買い切り型で100%GPL
  • 複数のブログやサイトで使える

上記は、前述したキャプションボックスとリッチカラムの組み合わせで作ったサンプルです。

こんな感じで、他のブロックと組み合わて整理しながら表現することができるのも嬉しいですね!

クリックするとSWELLのページが開きます。

説明リスト

SWELL【おすすめポイント 1】

最新のブロックエディターに完全対応

SWELL【おすすめポイント 2】

テーマカスタマイザーで直観的に作れる

SWELL【おすすめポイント 3】

買い切り型で100%GPLだから複数のブログやサイトで使える

上記は、説明リストで作ったサンプルです。

『+』で項目と項目の説明が追加できます。

説明リストの設定
説明リストの設定

親ブロックを選択するとスタイルが変更できます!

ポイント 1

最新のブロックエディターに完全対応

ポイント 2

テーマカスタマイザーで直観的に作れる

ポイント 3

買い切り型で100%GPLだから複数のブログやサイトで使える

例えば、上記のような横並びにしてすっきり見せることも可能です!

FAQ

質問 1

答え

質問 2

答え

上記のようなFAQも簡単に作ることができます!

FAQの設定
FAQの設定

スタイルや設定を変更して、好みのFAQに簡単に調整できます!

質問 1

答え

質問 2

答え

例えば、ボックスを塗りにしてストライプで表示させることもできますよ!

フルワイド

フルワイドの設定
フルワイドの設定

フルワイドは、簡単にコーポレートサイト風のデザインにできる超便利なブロックです!

個人的に、フルワイドがあるからSWELLを選んだと言ってもいいくらいお気に入り!

当ブログのトップページもフルワイド
当ブログのトップページもフルワイド

当ブログのトップページにも、フルワイドを使っています。

フルワイドの設定
フルワイドの設定

フルワイドはコンテンツのサイズで、記事の幅、サイト幅、フルワイドから選べます。

また、テキストや背景カラーが設定できるだけでなく、背景に画像を挿入したり、上下の境界線の形状を変えることが簡単にできます!

斜線や波の形状にもできる
斜線や波の形状にもできる

境界線を斜線や波で簡単に演出できますよ!

ステップ

STEP
ステップを選択

SWELLブロックでステップを選択するとステップが挿入されます。

STEP
ステップを作る

段落に文字や画像などを入れます。

上記は、ステップで作ったサンプルです。

工程や手順を紹介する際に、ステップを使えば簡単に作れます!

ステップの設定
ステップの設定

『+』をクリックすれば、ステップの項目を追加することができます。

細かくデザインが設定できる
細かくデザインが設定できる

親ブロックを選択すると、スタイルや設定が変更できますよ!

手順
ステップのスタイルを変更

スモールで設定し、ステップ番号の形を四角にしています。

手順
段落にブロックを追加

ステップの段落には、さらにブロックが追加できます。

段落を効果的に活用することが可能です!

僕がおすすめするWordPressテーマ

SWELL

SWELLトップ
出典 SWELL

【おすすめポイント】

  • 最新のブロックエディターに完全対応
  • テーマカスタマイザーで直観的に作れる
  • 買い切り型で100%GPL
  • 複数のブログやサイトで使える

クリックするとSWELLのページが開きます。

タブ

最新のブロックエディターに完全対応

上記は、タブを使って作成したサンプルです。

タブで切り替えるコンテンツが簡単に作れます!

タブの設定
タブの設定

スタイルでタブをふきだしにしたり、サイズを変えるなどの設定が簡単に行えます。

最新のブロックエディターに完全対応

上記は、冒頭のサンプルの設定を変えたものです!

ABテスト

ABテストの設定
ABテストの設定

SWELLでは、ABテストも簡単に行えます!

ABテストのブロックを使ってコンテンツを作り、表示率を調整するだけです!

【ABテストサンプル】

Bブロックが表示されています。

上記は、AブロックとBブロックを50%の比率で表示させるサンプルです。

ページを更新して変化を確認してみてください!

広告タグ

広告タグの設定
広告タグの設定

広告タグは、登録済みの広告タグを呼び出すことができます。

上記はサンプルで作ったものです。

クリックするとSWELLのページが開きます。

広告タグの作成画面
広告タグの作成画面

広告タグを予め作っておき、エディターで呼び出すだけです!

商品やサービスを紹介する際に、リッチなコンテンツが簡単に作れますね!

ふきだし

ふきだし

SWELLでは、ふきだしも簡単に作れます!

ふきだしの設定
ふきだしの設定

カラーを変えたり、ふきだしの形や向きなどを変えたり、アイコンを入れることが簡単にできます!

ふきだしセットの作成画面
ふきだしセットの作成画面

ふきだしセットにいくつかパターンを用意しておけば、用途に応じて効率的に挿入できます!

ブログパーツ

ブログパーツの設定
ブログパーツの設定

ブログパーツは、予め作っておいたブログのパーツが呼び出せるようになります。

ブログパーツの作成画面
ブログパーツの作成画面

例えば、前述した広告タグをランキング形式で並べて見せたい場合、

  • 1位~3位の広告タグを作成
  • 並べたブログパーツを作成

しておきます。

作成したブログパーツを呼び出すだけ
作成したブログパーツを呼び出すだけ

後は、作成したブログパーツをエディターで呼び出すだけ!

複数の記事で共通のブロックを使う場合、効率的に作業できますね!

リンクリスト

上記は、リンクリストで作成したサンプルです。

リストをクリックすると当ブログのページが開きます。

リンクリストの設定
リンクリストの設定

リストを追加したい場合は、『+』をクリックするだけ!

スタイルでボタンにしたり、設定でフォントサイズやカラー、アイコンの種類や位置が選択できます。

投稿リスト

SWELLでは、投稿リストも簡単に挿入できます!

上記は、投稿リストで作ったサンプルです。

クリックすると当ブログのページが開きます。

投稿リストの設定
投稿リストの設定

表示する投稿数の設定やリストやテキストへの切り替え、表示順序やカラム設定なども簡単です!

Pickupでタクソノミーで絞り込み可能
Pickupでタクソノミーで絞り込み可能

また、Pickupでは、絞り込み条件やタクソノミーの条件設定も行えます!

上記は、当ブログのカテゴリーをガジェットで絞り込み、テキストで表示させた投稿リストです。

クリックすると当ブログのページが開きます。

関連記事

上記のような関連記事のブロックが簡単に設置できます!

クリックすると当ブログのページが開きます。

関連記事の設定
関連記事の設定

投稿またはタームのIDを入力するか、URLを入力するだけで関連記事への誘導が可能になります!

「サムネイルは不要」「テキストのみで見せたい」など表示方法を変更することも簡単にできますよ!

制限エリア

制限エリアの設定
制限エリアの設定

制限エリアは

  • ログイン状態で制限する
  • 表示期間を制限する
  • ページで制限する

で設定することができます。

商品レビュー

SWELL
SWELLトップ
総合評価
( 4.5 )
メリット
  • 最新のブロックエディターに完全対応
  • テーマカスタマイザーで直観的に作れる
  • 買い切り型で100%GPLだから複数のブログやサイトで使える
デメリット
  • 他の人とかぶりやすい

上記は、商品レビューで作ったサンプルです。

商品紹介をする際に、効果的に表現できますね!

クリックするとSWELLのページが開きます。

商品紹介の設定
商品紹介の設定

エディター画面でプレビューを確認しながら作れるので便利です!

RSS

上記は、RSSを使って作成した当ブログのRSSフィードリストです。

クリックすると当ブログのページが開きます。

RSSの設定
RSSの設定

URLを入力し『URLを使用』のボタンをクリックするだけで、RSSフィードリストが簡単に作成できます。

RSS設定や表示設定を調整することで、好みのRSSフィードリストがつくれますよ!

SWELLのデメリット

SWELLのデメリット
SWELLのデメリット

ここまで、SWELLブロックの概要をざっとご紹介しました。

SWELLを導入すると、標準搭載されているブロックが美しく使いやすくなるだけでなく、SWELLブロックを活用することでより効率的かつリッチなページや記事がサクサク作れるようになります。

とても気に入っているWordPressのテーマです!

ただ、SWELLで用意されている独自のスタイルや、SWELLブロックを多用しすぎると

  • 他の人とかぶりやすい
  • ごちゃごちゃして可読性が悪くなる

といった可能性が高くなります。気になる方は

  • エディター設定を変えてみる
  • スタイルやSWELLブロックは最低限使用する
  • 自分なりのルールを作る
  • 使用する画像で差をつける

など工夫してみると良いでしょう。


\ 初心者の方におすすめのテーマ /

初心者の方におすすめのレンタルサーバー【ConoHa WING】

おすすめのレンタルサーバー
おすすめのレンタルサーバー

WordPressでブログやサイトを始める場合、レンタルサーバーの契約が必要になります。

でも、レンタルサーバーが沢山あって「何を選んだらいいか分からない」という方には、ConoHa WINGがおすすめです!

ConoHa WING

  • サーバー処理速度・表示速度が速い
  • 管理画面がわかりやすく使いやすい
  • 東証プライム上場企業のGMOインターネットグループ株式会社が運営
  • 困ったときに電話でサポートしてくれる

など、超初心者の方でも安心して使うことができますよ!

僕自身、SWELLConoHa WINGの組み合わせでブログが継続できています!


\ おすすめのサーバー /

サーバーを検討中の方は、
ConoHa WINGがおすすめです!

ConoHa WING
ConoHa WING

【期間限定】Webサイト制作応援キャンペーン2024年7月8日(月)16:00まで

Webサイト制作応援キャンペーン
Webサイト制作応援キャンペーン

ConoHa WINGでは、2024年7月8日(火) 16:00まで「Webサイト制作応援キャンペーン」を開催中です。

ベーシックプランで12ヶ月以上の期間で契約すると、最大53%OFFになる超お得なキャンペーンです!初期費用と独自ドメイン2つも無料!

ベーシックプランでの
契約期間
通常料金キャンペーン価格割引率
12ヶ月1,452円/月941円/月35%OFF
24ヶ月1,452円/月889円/月38%OFF
36ヶ月1,452円/月678円/月53%OFF

キャンペーンの詳細については、
Webサイト制作応援キャンペーンをご確認ください!

まとめ:SWELLブロックでページや記事がサクサク作れる

今回は、WordPressのテーマSWELLの導入を検討している方向けに、『SWELLブロック』についてご紹介しました。

SWELL最新のブロックエディターに完全対応しているので

  • ブロックが美しいデザインになる
  • ブロックの設定やスタイルの幅が広がる

など、WordPressに標準搭載されているブロックだけでも素敵なページや記事が作成できます!

加えて、SWELL独自のブロック『SWELLブロック』を使うことで、専門的な知識がない初心者の方でも

  • より効率的に作業できる
  • よりリッチなコンテンツが作れる

ようになります!

超初心者だった僕でもSWELLを使うことで、ページや記事がサクサク作れるようになり、継続できるようになりましたよ!

以上、ハセブロでした。

最後までお読みいただきありがとうございました。


\ 初心者の方におすすめのテーマ /

目次