SWELLのデモサイト(着せ替え)は使うべき?最初は便利だったが、今は使っていない理由

明るい机に並べた色違いのデザイン見本カードとノートパソコン
  • URLをコピーしました!

SWELLには、公式のデモサイトのデザインに近づける「着せ替え」の仕組みがあります。結論から書くと、最初のたたき台としては便利。ただし、慣れてきたら自分向けに変えていくほうがよいというのが、実際に使ってみた感想です。筆者はこのサイト(hiroky.org)をSWELLで運営していますが、今は着せ替えを使っていません。

この記事では、着せ替えの仕組み、便利だった点、やめた理由、使うときに控えておくこと、そしてデモを使わずに自分のサイトらしく整える手順をまとめます。

この記事の要点

  • 公式のデモサイトは6種類。着せ替え用のデータは購入者向けサイトで配布されている
  • 便利なのはゼロから設定を決めなくて済むこと。設定の勘所も分かる
  • 困るのは同じデモを使ったサイトと見た目が似ること
  • 着せ替える前に、今のカスタマイザー設定を書き出して控えておく
  • デモを使わなくても、見出し・色・トップの構成を決めれば形になる
目次

SWELLのデモサイト(着せ替え)とは

SWELLの公式サイトにはデモサイトが6種類公開されていて、それぞれのデザインに近づけるための着せ替えデータが、購入者向けのユーザー専用サイトで配布されています(2026年9月時点)。

読み込むのはカスタマイザーの設定です。色やレイアウトなどの見た目の設定が置き換わる形で、記事や画像がそのまま入るわけではありません。「デモと同じサイトが手に入る」というより、「デモと同じ見た目の土台に整う」と考えておくとイメージが合います。

使ってみて便利だったこと

  • 最初に決めることが一気に減る:色、見出しの形、トップの並びを自分で決めなくても、整った状態から始められる
  • 設定の場所が分かる:着せ替え後にカスタマイザーを見ると、どの項目がどこに効くのかを逆から追える
  • 公開までが早い:デザインで止まらずに、記事を書く作業へ進める

ブログを始めたばかりで、何から設定すればいいか分からない段階では、着せ替えはかなり助かりました。

それでも今は使っていない理由

理由はひとつで、同じデモを使っているサイトと見た目が似てしまうことです。SWELLは利用者が多いので、初期設定や公式デモのままだと「どこかで見たサイト」になりやすく、自分のサイトだと覚えてもらいにくくなります。

このサイトでは、着せ替えに頼るのをやめて、見出しを明朝体にする、リンクの色を落ち着かせる、表や引用の線を細くする、といった調整を追加CSSで入れています。変えたのは3か所ほどですが、それだけでも印象は変わりました。

あわせて読みたい
SWELLのカスタマイズ|他サイトと同じ見た目にしない見出し・フォント・色の変え方(実例CSS付き) SWELLは使っている人が多いテーマなので、初期設定のまま使うと、見出しの形や色づかいが他のSWELLサイトとよく似てしまいます。このサイト(hiroky.org)も2024年7月か...

着せ替えを使うときに気をつけること

スクロールできます
場面気をつけること
運営中のサイトに入れる今のカスタマイザー設定が置き換わる。先に設定を書き出して控えておく
公開前の確認スマホとパソコンの両方で、見出し・ボタン・トップの並びを見る
画像とロゴデモの雰囲気に寄せるほど似るので、写真とロゴは自分のものに差し替える
色基調の色だけでも変えると、同じデモでも印象が変わる

いちばん大事なのは1行目です。着せ替えは見た目の設定をまとめて置き換えるので、運営中のサイトに入れる場合は、戻せる状態を作ってから試してください。

デモを使わずに整えるなら、この3つから

  1. 見出しとフォント:カスタマイザーの「投稿・固定ページ」>「コンテンツのデザイン」と、「基本デザイン」のフォント設定
  2. 基調の色:サイト全体の色を1〜2色に絞る。リンクの色も合わせて落ち着かせる
  3. トップページの構成:固定ページで作り、読んでほしい記事とサービスへの導線を決める

会社サイトをSWELLで作ったときも、この順番で決めました。固定ページでトップを作る具体的な構成は、こちらにまとめています。

あわせて読みたい
SWELLでコーポレートサイトは作れる?自社サイトとLPを実際に作って使ったブロックと注意点 SWELLはブログ向けのテーマという印象が強いかもしれませんが、コーポレートサイトやサービス紹介のLPも作れます。このサイト(hiroky.org)の運営者が代表を務める会社...

よくある質問

SWELLのデモサイトは何種類ありますか?

公式サイトで6種類(DEMO01〜06)が公開されています。着せ替え用のデータは購入者向けサイトで配布されています(2026年9月時点)。

着せ替えると記事や画像も入りますか?

入りません。読み込まれるのはカスタマイザーの設定です。デモと同じ見た目の土台になる、と考えてください。

運営中のサイトに着せ替えを入れても大丈夫ですか?

今のカスタマイザー設定が置き換わります。先に現在の設定を書き出して控えてから試してください。

着せ替えを使うと他のサイトと似ませんか?

似ます。筆者がやめた理由もそこです。使う場合は、色・見出し・写真・ロゴを自分のものに変えるところまでをセットにしてください。

デモを使わないと、デザインを整えるのは大変ですか?

そこまで大変ではありません。見出しとフォント、基調の色、トップの構成の3つを決めれば形になります。細かい部分は追加CSSで少しずつ変えられます。

まとめ

SWELLの着せ替えは、始めたばかりの時期に効く機能です。デザインで止まらずに記事を書き始められます。一方で、そのままだと他のSWELLサイトと似るので、慣れてきたら色・見出し・トップの構成を自分向けに変えていくのがおすすめです。筆者は今、着せ替えを使わず、追加CSSでの微調整に切り替えています。

SWELLの機能や価格は公式サイトで確認できます。乗り換えた立場での評価は、レビュー記事にまとめました。

あわせて読みたい
SWELLの評判は?STORK19・AFFINGERから乗り換えて2年使った本音レビュー WordPressテーマのSWELLは、このサイト(hiroky.org)で2024年7月から使っているテーマです。それまではSTORK19(2019年)、AFFINGER(2020年)と使ってきて、デザイン...
  • Amazonのアソシエイトとして、当メディアは適格販売により収入を得ています。
  • コンテンツ内で紹介した商品をご購入いただくと、売上の一部が運営会社(アマノート)に還元されることがあります。
  • 各商品の紹介文は、公式サイト等の情報を参照して作成しております。
  • 掲載情報は、アマノートが独自にリサーチした時点のものです。価格変動やその他の理由により、実際の情報と異なる場合があります。最新の価格、商品詳細、およびサービス内容については、各公式サイトでご確認ください。

広告

このサイトはWordPressテーマ「SWELL」で作っています。ブロックエディタの扱いやすさが決め手でした。子テーマの導入手順もまとめています。

WordPressテーマ SWELL
よかったらシェアしてね!
  • URLをコピーしました!
目次