【SWELL】使い勝手のよさを実感した標準機能１０選｜Cocoonから乗り換え

この記事は、こんなお悩みさんの疑問にお答えします。

「SWELL」は洗練されたデザインのブログがつくれると大人気のワードプレス有料テーマです。

わたしは、ブログを始めて５か月目に、ワードプレス無料テーマ「Cocoon」から「SWELL」に乗りかえをしました。

わたし自身たいへん満足してCocoonを愛用していました。

Cocoonを使っていたときに私が投稿したツイートです。

サイトのトップにカテゴリーのカード入れるのが夢だったけど、Cocoonでも出来た！
すごくテンションがあがりました🥰 pic.twitter.com/I9sH8sjPem

— リタイアかわうそ｜ (@Ed2QvvUTFM4ZLf0) July 12, 2021

しかしSWELLを使用してみて実感したのは「やっぱり有料のテーマだけあって、サイトのデザインや記事の作成が快適になったなあ」ということでした。

SWELLに乗りかえてよかったと実感している最大の理由

最初に「SWELLの魅力は機能面だけでない！」と私が実感したエピソードからお伝えしたいと思います。

私が「SWELLに乗りかえてよかった」と実感している最大の理由はこれに尽きます！

2022年11月2日の夜、Word Pressが6.1にアップデート、その際、SWELLのリスト装飾メニューがサイドに表示されなくなるという事象が発生しました。

リスト装飾を多用していた私はあせりました。

11月３日：私のツイート

ワードプレス更新したら
✅＋が出にくい気がします
✅SWELLのリスト装飾もサイドバーに出なくなり泣きそうになった🤣
⇒謎のボタン（前からあったっけ？）からリストを呼び出したら大丈夫でした😄

今までズボラで気にせず自動更新してました。反省 pic.twitter.com/0NxmIDxDk9

— リタイアかわうそ🌷SWELL大好き (@Ed2QvvUTFM4ZLf0) November 3, 2022

しかし・・・

11月４日：SWELLで発生した不具合が迅速に修正されました

この対応の速さには正直驚きました。

コアのリストの仕様変更で戸惑っている方が多そうだったので、SWELL v.2.7.0.2で、リスト項目ブロックのサイドバーに『親ブロック選択ボタン』を設置するようにしてみましたー！！🙆‍♂️ pic.twitter.com/Fks9IOhyPu

— 了🌊SWELL | Arkhe開発 (@ddryo_loos) November 4, 2022

この 安心感、開発者さんの熱意こそSWELLが愛される理由 です。

SWELLは「機能拡張」も頻繁に行われています。しかもアップデートに費用は掛かりません。

購入価格は少し高くても、いつまでも安心して使えるという点でとても満足しています。

では、ここからはランキング形式で使い勝手のよいSWELLの標準機能をご紹介します。

Cocoon愛用者の私が使い勝手のよさを実感した 「SWELLの標準機能」ベスト10

以下が、わたしが使い勝手のよさを実感したSWELLの標準機能」10選 ＆ Myランキングです。

（気になる機能があったらタップしてくださいね）

では、ひとつずつ詳しく説明していきます。

【1０位】記事の途中で目次を表示させることができる「目次ボタン」

わたしが使い勝手のよさを実感した「SWELLの標準機能」８位は「目次ボタン」です。

「目次ボタン」は、記事内のどこからでも「目次」を表示させることができる機能です。

	SWELL	Cocoon
目次 ボタン	あり	なし
サイドバー 目次追従表示	できる	できる

こちらはパソコン画面のSWELL「目次ボタン」です。

投稿ページの画面右下に表示されます。

こちらはスマホの画面のSWELL「目次ボタン」です。

投稿記事を開くとフッダーに表示されます。

「目次表示ボタン」をクリックすると、このように記事のどこからでも目次を表示させることができます。

「目次ボタン」の設置はカスタマイズメニューから行います。

記事をスクロールしていくと、このような目次が「サイドバー」に追従表示される機能です。

Cocoonでも設置することができます。

確かにそうですよね。でも・・・・

こちらが「目次表示ボタン」で表示される目次です。

【９位】画像ごとに個別の設定ができる「画像囲み枠機能」

わたしが 使い勝手のよさを実感した 「SWELLの標準機能」７位は「画像囲み枠機能」です。

その名のとおり写真などの画像に「外枠」や「影」などをつける機能のことです。

	SWELL	Cocoon
画像囲み枠 機能	あり	あり
画像囲み枠の 設定方法	エディーター画面で行う （画像ごとに適応）	Cocoon設定→画像で行う （ブログ内全ての画像に適応）
画像囲み枠の 効果	枠あり 影あり フォトフレーム プラウザ風 デスクトップ風	ボーダー（薄い枠線） ボーダー（太い枠線） シャド―（薄い影） シャドー（ペーパー）
画像ごとの 個別設定	できる	できない

たとえば、こんな画像囲み枠も・・・・

こんな画像囲み枠も・・・

ワンクリックで選択できるので、

とても快適です(^-^)/

「 Cocoon設定」→「画像」で設定画面に進み「囲み枠効果」を選択します。

ただし、ここで選択した囲み枠は、ブログ内全ての画像に適応されてしまいます。

そのため、個別に囲み枠の効果を変えるためには、CSSなどを使ったカスタマイズが必要になります。

【８位】自由にテキストを入れることができる「タブ付き囲み枠機能」

わたしが 使い勝手のよさを実感した 「SWELLの標準機能」６位は「タブ付き囲み枠機能」 です。

機能	SWELL	Cocoon
タブつき囲み枠 機能	あり	あり
自由な色の カスタマイズ	できる	できない
タブ内の テキスト入力	できる	できない

わたしは、「タブつき囲み枠」をSWELLブロックの「キャプションボックス」で作っています。

こちらが「キャプションボックス」でつくった 「タブつき囲み枠」 です。

キャプション部分には自由にテキストを入力することができます。

色を自由にカスタマイズできるところも使い勝手がよいと思います。

デザインは、全部で７種類です。

こちらが、Cocoonでの「タブつきボックス」作成画面です。

たとえば、この中からボックス（ポイント）を選択すると・・・

タブに「POINT」と入った囲み枠が４つ出てきます。

自由なテキストを入れたピンク色の「タブつき囲み枠」をどうしても作りたかった私・・・

「HＴＭＬをコピペするだけで囲み枠がつくれる」というサイトを利用させていただいていました。

こちらは、私のパソコンにブックマークされているお世話になったサイトです。

この「タブつき囲み枠」は私がCocoonを使用していたときに、上記サイトからHTMLをコピーして作ったものです。

【７位】色に統一感があるサイトをつくることができる「メインカラー設定」

わたしが 使い勝手のよさを実感した 「SWELLの標準機能」５位は「メインカラー設定機能」です。

SWELLの「メインカラー」とは記事内の見出しや各種装飾ボタンなど、サイトで重要となる様々なポイントで利用される色のことです。

機能	SWELL	Cocoon
メインカラー 設定	あり	なし着せかえ機能で設定

メインカラーは、最初に設定するだけです。

メインカラーを設定すると・・・

このように「見出しの色」「囲み枠の色」などをメインカラーで統一することができます。

もちろん違う色に変更することも可能です。

【６位】 記事を見やすくしてくれる便利な「SWELLオリジナルブロック」

わたしが 使い勝手のよさを実感した 「SWELLの標準機能」４位は「SWELLブロック」です。

【SWELLブロック】とは その名のとおりSWELL独自の機能を持った専用ブロックのことです。

数あるSWELLブロックの中でも「見やすい記事がつくれて便利だなあ」と感じた【SWELLブロック】が以下の３つです。

当ブログで実際に「ステップ」と「FAQ」を使っている実例を紹介します。

こちらは「ステップ」でつくったフロー形式のコンテンツの一部です。

ココナラに会員登録してから商品を受け取るまでの流れを「ステップ」を使って説明しました。

こちらは「FAQ」でつくったQ＆A形式のコンテンツです。

記事のリード文として使いました。

紹介した３つのSWELLブロックについては、こちらの記事でくわしく説明をしています。

【５位】設定の変更が自由自在の「ふきだし機能」

わたしが 使い勝手のよさを実感した 「SWELLの標準機能」３位は「ふきだし機能」です。

機能	SWELL	Cocoon
吹き出しの 設定変更	テキスト入力後 も可	テキスト入力後 は不可
登録した 吹き出しの 呼び出し	吹き出し画像を クリックして 選択	プルダウン リストから 選択
自由な 色の カスタマイズ	できる	できない３１色から選択

私が「この機能が使い勝手がいいなあ！」感じたSWELLの吹きだし機能は以下の３つです。

〈自称〉ふきだし愛好家の私は、記事の中で「ふきだし」を多く使っています。

そんな私が、イチ押しなのが「❶ ふきだし設定を自由自在に変更できる機能」です。

何とこちらのカワウソふきだしが・・・

ワンクリックで入れ替えることができるんです！！

SWELLの便利な「ふきだし」機能については、こちらの記事でくわしく紹介をしています。

【４位】リンクボックスが簡単につくれる「ボックスメニュー」

2022年４月にSWELLがバージョンアップし「ボックスメニュー」ブロックが追加されました。

機能	SWELL	Cocoon
ボックスナビ 作成機能	ボックスメニュー	コードが必要

「ボックスメニュー」は、サイドバーなどに表示する『ボックスナビ』をコードなしに簡単に作成することができる機能です。

『ボックスナビ』は、サイドバーなどでよくみかけるこのようなリンクボタンです。

実は、当ブログで「リッチカラム」と「ブログパーツ」で『ボックスナビ』の作り方を紹介していました。

ところが、今回SWELLのアップデートで新規追加された「ボックスメニュー」を使うと、より簡単に『ボックスナビ』をつくることができるようになったのです。

こちらが「ボックスメニュー」でつくった『ボックスナビ』です。

「リッチカラム」を使って『ボックスナビ』を作った時は試行錯誤でした。

でも「ボックスメニュー」を使ったところ、拍子抜けするほと簡単に『ボックスナビ』が完成しました。

大きさ、レイアウトなどアレンジのバリエーションが充実しています

カラーも変更も自在です。グラデーションカラーにもできます

標準装備されているたくさんのアイコンをクリック一つで選べます

SWELLの便利な「ボックスメニュー」の機能については、こちらの記事でくわしく紹介をしています。

【３位】待望のセル結合機能実装！見やすい表がつくれる「テーブル機能」

2022年3月にSWELLがバージョンアップし「テーブル機能」が大幅に拡張されました。

機能	SWELL	Cocoon
セル毎に 背景色を変える	できる	できない
セルに 〇などの 背景を入れる	できる	できない
セルに ボタンを入れる	できる	できない

当記事に掲載している「SWELL」と「Cocoon」の比較表は「SIMPLE BLOG DESIGN」という有料プラグインでつくっています。

ところが、SWELLのテーブル機能が拡張されたことでプラグインがなくてもこのような表が作れるようになったのです。

こちらがSWELLの標準機能でつくった 比較表です。

機能	SWELL	Cocoon
セル毎に 背景色を変える	できる	できない
セルに〇などの 背景アイコンを入れる	できる	できない
セルに ボタンを入れる	できる	できない

背景アイコンは、全部で７種類です。

*

*

*

*

*

*

*

セル内をリスト風の書式にできる機能も追加されました！

追加された 機能	「縦1列目を強調する」がオンのときに一列目のセル背景色に好きな色を指定 テーブルヘッダー背景色を好きな色に指定 テーブルヘッダーのテキスト中央寄せ設定 テーブル全体を一括で中央揃えできる設定 個別のセルごとに背景色を付けたり、セル背景に◎や×アイコン等を表示する機能 セル内のテキストに対して「リスト風」書式が選択可能 セル内のテキストに対して「テキスト中央揃え」書式が選択可能 テーブルを使ったブロックパターンをいくつか追加
リストの 種類	ああああ ああああ ああああ ああああ

セル毎に背景の色を変えることもできます。

インラインボタンという機能も追加されたため、セルの中にボタンを入れることもできるようになりました。

インラインボタン	インラインボタン	インラインボタン
インラインボタン	インラインボタン	インラインボタン
インラインボタン	インラインボタン	インラインボタン
インラインボタン	インラインボタン	インラインボタン

これで、セルの結合機能が実装されたらパーフェクトだと思います。

2023年4月のアップデートで、セルの結合機能が追加されました！

【SWELL v.2.7.5 をリリースしました！🎉】

・テーブルのセル結合を簡単にするUIを実装。
・テーブル全体のフォントサイズ設定を追加。
・テーブル１列目の横幅設定を追加。
・インラインのフォントサイズ変更機能にカスタムサイズ設定を追加

などです！👏#wpswellhttps://t.co/1flX0cdf79

— 了🌊SWELL | Arkhe開発 (@ddryo_loos) April 29, 2023

【２位】アフィリエイト広告を一括管理できる「広告タグ機能」

わたしが 使い勝手のよさを実感した 「SWELLの標準機能」２位は「広告タグ機能」です。

広告タグとは、専用のエディ―ターで作成したコンテンツをブログ内の好きな場所に表示させることが機能」のことです。

機能	SWELL	Cocoon
広告タグ 機能	あり	なし

こちらが、SWELLの広告タグで作ったアフィリエイト広告です。

☆の評価やリジナルコメントを入れてアピールすることができます。

ボタンに表示させる内容も、カスタマイズできますよ。

広告タグの呼び出しもラクラク！

専用のエディーターで広告タグを作っておくと、ボタン一つで呼び出して記事に貼り付けることができます。

ブログ内の広告を一括管理！

広告を更新したいときも、元の広告タグを修正するだけで記事内の広告を一括で修正することができます。

リンクエラーの広告放置による成果発生の機会損失も防止できますよ。

こちらが、私の広告タグ一覧画面です。

【１位】簡単にトップページをカスタマイズできる「ブログパーツ機能」

わたしが 使い勝手のよさを実感した 「SWELLの標準機能」１位は「ブログパーツ機能」です。

ブログパーツとは、専用のエディ―ターで作成したコンテンツを「サイト内の好きな場所に表示させることが機能」のことです。

機能	SWELL	Cocoon
ブログパーツ 機能	あり	なし

当サイトのトップページも、ブログパーツを使ってカスタマイズしています。

「ブログパーツ」を使った当サイトのトップページのカスタマイズを、こちらの記事でくわしく紹介をしています。

まとめ

今回は、SWELLの使い勝手のよい便利すぎる機能「10選」を紹介させていただきました。

これだけの有料級の機能を「プラグインなし」で使えるなんてスゴすぎです。

しかも「複数サイトで使いまわしができる」 ことを考えると・・・

17,800円とけっして安くはない買い物でしたが、思い切って乗りかえをしてよかったと思います。

何よりSWELLがすごいのは、常にバージョンアップされ続けていること！

【SWELL 2.6.0 をリリースしました🙌】

・インラインボタン機能追加
・テーブルブロックの機能強化
・Font Awesome 6への対応

その他、不具合修正などなどです！👏#wpswellhttps://t.co/eUJESlXqcv

— 了🌊SWELL開発者 (@ddryo_loos) March 30, 2022

【SWELL v.2.6.1 をリリースしました🙌】

・「ボックスメニュー」ブロックを追加
・「リスト入りグループ」ブロックを追加
・「アイコンピッカー」リニューアル
・「セル背景」機能の追加調整

などなどです！#wpswellhttps://t.co/ZLzUrFSCia

— 了🌊SWELL開発者 (@ddryo_loos) April 15, 2022

しかも、アップデートの費用はいっさいかかりません！

これってもう、開発者さんの献身的なサービスですよね。

まだ、SWELLにしようか迷っている方がいらっしゃいましたら・・・