SWELLのトップページの作り方｜初心者向けに手順を解説

2026年10月20日

※本記事はアフィリエイト広告を含む記事へのリンクを含みます。

SWELLでブログを作ったものの、「トップページがただの記事一覧で物足りない」と感じていませんか。私も最初は初期状態のまま使っていましたが、どんなブログなのか伝わりにくいと気づき、トップページを作り直しました。

この記事では、SWELLでトップページを作る方法を、初心者でも迷わないように手順どおり解説します。実際にトップページを作り直してきた体験も交えるので、読み終わるころには、ブログの魅力が伝わるトップページを作れるようになります。

※これからSWELLを導入する方へ：SWELLは買い切り型のWordPressテーマで、追加費用の心配がありません。この記事を見ながら進めれば、初心者でも迷わずおしゃれなブログを作れます。

➡️【公式】SWELLの公式サイトはこちら

デザインに悩む時間を減らして、記事作りに集中できます。

ニャフィ

おしゃれなトップページって、どうやって作るのかにゃ？

たいがブログ

ブログの顔になる部分なので、こだわりたいですよね。

ニャフィ

難しい設定やコードが必要だったら不安だにゃ…

たいがブログ

ブロックだけで作れる手順を、5つのステップで解説しますね。

SWELLのトップページの作り方は2種類

SWELLのトップページには、記事一覧を表示する形と、固定ページで自由に作る形の2種類があります。どちらを選ぶかで、ブログの見え方が大きく変わります。

筆者は最初、記事一覧のまま運営していましたが、読者がどの記事から読めばいいか迷ってしまう状態でした。固定ページ型に切り替えてからは、おすすめ記事へ自然に案内できるようになったと感じています。

記事一覧型のトップページ

記事一覧型は、新しい記事が自動で並ぶシンプルな形です。カスタマイザーからメインビジュアルや記事スライダーを設定するだけで、手軽に見栄えを整えられます。

固定ページ型のトップページ

固定ページ型は、ブロックを組み合わせて自由にレイアウトできる形です。人気記事やカテゴリーの案内などを配置できるので、ブログの魅力を伝えやすくなります。

固定ページでトップページを作る方法

ここからは、固定ページを使ってトップページを作る方法を紹介します。普段の記事作成と同じ要領で作れるので、初心者でも取り組みやすいのが魅力です。

筆者はAFFINGER6でもサイト型のトップページを作りましたが、ウィジェットの設定に慣れるまで苦労しました。SWELLはブロックを並べるだけで形になるので、作業がとてもスムーズでした。

トップページに載せる内容を決めておく

作り始める前に、人気記事・カテゴリー・プロフィールなど、載せたい内容を書き出しておきましょう。読者に最初に読んでほしい記事を決めておくと、配置に迷いません。

フルワイドブロックで区切りを作る

SWELLのフルワイドブロックを使うと、画面いっぱいに背景色を付けてセクションを区切れます。内容ごとに背景を変えると、メリハリのあるトップページになります。

STEP

トップページ用の固定ページを作る

「固定ページ」→「新規追加」から、トップページ用のページを作ります。タイトルは「ホーム」など、管理画面で見分けやすい名前にしておきましょう。

STEP

ブロックでコンテンツを配置する

フルワイドブロックで区切りを作り、記事リストやボタン、見出しを配置していきます。おすすめ記事を上のほうに置くと、読者を案内しやすくなります。

STEP

ホームページの表示を設定する

「設定」→「表示設定」で、ホームページに作成した固定ページを指定します。筆者は投稿ページの指定を忘れて記事一覧が見られなくなったので、あわせて設定しましょう。

STEP

メインビジュアルを設定する

カスタマイザーのトップページ設定から、メインビジュアルの画像やキャッチコピーを設定します。ブログのテーマがひと目で伝わる内容にするのがポイントです。

STEP

スマホで表示を確認する

完成したら、スマホでの見え方を必ず確認します。読者の多くはスマホから訪れるので、文字の大きさや余白に問題がないかチェックしておきましょう。

読まれるトップページにするコツ

トップページは、読者がブログの第一印象を決める大切な場所です。見た目の美しさだけでなく、読みたい記事へすぐにたどり着けるかを意識して作りましょう。

筆者は最初、トップページにあれこれ詰め込みすぎて、ページが長く重くなってしまいました。内容を3つほどのセクションに絞ったところ、すっきり見やすくなり、記事へのクリックも増えたと感じています。

載せる内容を絞り込む

あれもこれも載せたくなりますが、情報が多すぎると読者は迷ってしまいます。いちばん読んでほしい記事やカテゴリーを中心に、必要なものだけを配置しましょう。

読者の悩みごとに案内する

「これから始めたい人向け」「さらに伸ばしたい人向け」など、読者の悩み別に記事を案内すると親切です。自分に合った記事をすぐに見つけられるトップページを目指しましょう。

トップページに入れたい要素

ブログのテーマが伝わるメインビジュアル
最初に読んでほしいおすすめ記事
カテゴリーごとの記事一覧
運営者のかんたんなプロフィール

よくある質問

記事一覧型と固定ページ型、どちらがいいですか？: 記事が少ないうちは記事一覧型でも十分です。記事が増えて案内したい内容がはっきりしてきたら、固定ページ型に切り替えるのがおすすめです。
トップページに固定ページのタイトルが表示されてしまいます。: 固定ページの編集画面にあるページの設定から、タイトルの表示を調整できます。トップページらしく見せたい場合は、表示を確認しながら設定しましょう。
設定したのにトップページが変わりません。: まずは表示設定でホームページの指定が正しいか確認しましょう。それでも変わらない場合は、ブラウザやサーバーのキャッシュを削除してみてください。
トップページを作るとSEOに効果がありますか？: トップページから各記事へ案内することで、読者がサイト内を回りやすくなります。直接順位が上がるとは限りませんが、読みやすいサイト作りにつながります。