日本一周はこう稼ぐ!詳しくはコチラ

【初心者必見!】SWELLを導入したらまずやるべき16の初期設定

広告あり

こんにちは、Jony(@10to1_JonyAi)です。
旅人.comでは「旅のお金って、どうしてるの?」に答える!をコンセプトにしています。

前回は、SWELLの購入からインストールまでを解説させていただきました。今回は SWELLの初期設定をご紹介します。

この記事を参考に初期設定すれば、1時間ほどで基本的なブログの形にすることができますよ。具体的な内容は以下の通りです。

初期設定は最初にやっておくべき設定でして、後になればなるほど修正が大変です。むしろ最初にやっておくと作業効率を大きく UPできますよ。

正直、面倒くさいと思われるかもしれませんが、後になるほど余分な作業が増えていきます。初期設定は最初にするほど効率よく、最適化させることができるのです。

この記事を参考に、1時間ほどで全ての初期設定を済ませましょう!

この記事を書いてる人

当サイトはリンクフリーです。記事本文・画像を引用した場合、リンクを貼っていただければ問題ありません。また、当サイトを引用した記事は Xで拡散するので、@10to1_JonyAiにご連絡ください。

SWELL

– 初心者にも優しい究極のテーマ –

初心者に優しいテーマ「SWELL」でブログを始めよう。

  • ブログを思い通りにデザインできる
  • 初心者でも使いやすい
  • ブロックエディタ完全対応
  • 収益化に必要な機能が揃ってる
この記事の目次

SWELL初期設定1|プラグインの導入

SWELL初期設定1|プラグインの導入
SWELL初期設定1|プラグインの導入

SWELLの初期設定で最も重要なのがプラグインの最適化です。プラグインとは拡張機能できるもので、導入することにより SWELLの機能を 120%引き出すことができますよ。

例えば、SWELLには「メタディスクリプション入力機能」がありません。逆に、SWELLに搭載されている機能と同じプラグインを入れてしまうと、不具合を起こしたり逆効果を招いてしまう可能性もあります。

SWELLに完全対応したプラグインを厳選し、最適化することが需要ですね。

SWELLに入れるべき必須プラグインは以下の通りです。

必須プラグイン

スクロールできます
プラグイン名説明
SEO SIMPLE PACK必要最低限な機能だけが搭載されているシンプルなSEOプラグイン。
XML Sitemap & Google NewsSWELLが推奨する XMLサイトマップ作成プラグイン。
Useful Blocksオシャレかつ便利なブロックを集めたデザイン作成プラグインです。
PochippAmazonや楽天市場などのアフィリエイトリンクを管理できます。
WP Revisions Controlサイトを重くするリビジョンデータをカンタンに制限してくれます。
Wordfence SecurityreCaptchaも導入できるセキュリティプラグイン。
BackWPup画像ファイル、記事データ、プラグインなどをカンタンに保存しておけるバックアッププラグインです。
Contact Form by WPFormsお問い合わせフォームを作成できるプラグインです。
EWWW Image Optimizer画像サイズを一括で管理できるプラグインです。不具合が報告されているため、圧縮時のみ有効化して使うのがオススメ。
Broken Link Checkerリンク切れを通知してくれる優れもの。

続いて、SWELLに不要なプラグイン一覧です。「ブログで色んな人がオススメしてるから」という理由で、不用意に導入しないようにしましょう。

非推奨プラグイン

プラグイン名説明
Google XML SitemapsSWELLでは、XML Sitemap & Google Newsを推奨してます。
Gutenberg開発者が最新の機能をテストするためのものですので不要です。
WooCommerce非対応のため不要です。
Table of Contents Plus機能が重複するので不要です。
Lazy Load機能が重複するので不要です。
Classic EditorSWELLはブロックエディタ推奨ですので、不要です。
ElementorSWELLはブロックエディタ推奨ですので、不要です。
Classic EditorSWELLはブロックエディタ推奨ですので、不要です。
AddQuicktagSWELLにほぼ全て揃っているので、不要です。
Jetpack容量も重く、SWELLと重複してる機能が多数あるので不要です。
EWWW Image Optimizer画像が表示されないなど不具合が多発。便利ですが実は非推奨。

その他、SWELLと相性の悪いプラグインは、以下の通りです。

不要なプラグイン

  • 多機能なブロック拡張プラグイン
  • 高速化系プラグイン
  • 目次プラグイン
  • 画像遅延読み込みプラグイン
  • ふきだしプラグイン
  • キャッシュ系プラグイン

SWELLにオススメのプラグインに関して詳しく知りたい人は、以下の記事を参考にしてみてくださいね。

WordPressのプラグインは数えきれないほどあり、SWELLでそれら全てがうまく動作する保証はできません。「第三者のコードを使って機能を拡張する」のがプラグインなので、基本的には「自己責任で使うもの」だということは念頭に置いておいてください。
>>SWELL|推奨プラグインと非推奨・不要・注意すべきプラグインについて

SWELL初期設定2|サイト全体のデザイン設定

SWELL初期設定2|サイト全体のデザイン設定
SWELL初期設定2|サイト全体のデザイン設定

次に SWELLのサイト全体のデザインを設定していきます。ここが主にあなたの希望のサイトにデザインできる項目です。

基本カラー

SWELLのサイト全体に適応されるカラーを設定します。

外観 → カスタマイズ → サイト全体設定 → 基本カラー

  • メインカラー:見出しなどサイトのメインとなる色
  • テキストカラー:文字テキストの色
  • リンクカラー:リンクテキストの色
  • 背景色:サイトの背景の色

基本デザイン

SWELLのサイト全体の基本的なデザインを設定します。

外観 → カスタマイズ → サイト全体設定 → 基本デザイン

  • 全体の質感:「標準・フラット・丸み」の3つからサイトの質感を選択
  • コンテンツの背景を白にする:背景フレームの有無を設定
  • フォント設定:4種類の書体からフォントを設定
  • コンテンツ幅の設定:コンテンツ幅を設定できる
  • サブメニューの表示設定:各サブメニューの表示設定ができる
  • ページ背景:サイトの背景の画像を設定することができる

見出しデザイン

SWELLの記事内の見出し( h2・h3・h4)のデザインを設定します。

外観 → カスタマイズ → 投稿・固定ページ → コンテンツのデザイン

  • 見出しのキーカラー:見出しの基本色(デフォルトはメインカラー)
  • 見出し2のデザイン:見出し h2のデザイン
  • 見出し3のデザイン:見出し h3のデザイン
  • 見出し4のデザイン:見出し h4のデザイン

目次デザイン

SWELLの目次のデザインを設定します。

外観 → カスタマイズ → 投稿・固定ページ → 目次

  • 投稿ページに目次を表示:投稿ページに目次を設置するならチェックを入れる
  • 固定ページに目次を表示:固定ページに目次を設置するならチェックを入れる
  • 目次のタイトル:目次のタイトル名
  • 目次のデザイン:目次のデザイン(4種類)
  • 目次のリストタグ:目次の表示形式
    • ol:番号「1, 2, 3 …」
    • ul:ドット「・」
  • 擬似要素(ドット・数字部分)のカラー:目次リストのドット・数字の色
  • どの階層の見出しまで抽出するか:どの見出しまでを表示するか
  • 見出しが何個以上あれば表示するか:記事内に何個以上の見出しがあれば目次を表示するか

SWELL初期設定3|エディターの設定

SWELL初期設定3|エディターの設定
SWELL初期設定3|エディターの設定

SWELLで記事を書く際のエディター設定をします。これにより、記事執筆の作業がスムーズになります。

カラーパレット

テキスト色・ブロック背景色を変更できるパレットです。

SWELL設定 → エディター設定 → カラーセット →カラーパレット設定

あなたがよく使う色を設定しておくと、1クリックで呼び出すことができます。使いたい色を編集しておきましょう。

リストのカラー

リストの色を設定します。

SWELL設定 → エディター設定 → カラーセット → リスト設定

それぞれのアイコンごとに、色を設定することができます。

キャプションのブロックカラー

キャプションのブロックカラーを設定します。

SWELL設定 → エディター設定 → カラーセット → キャプションのブロックカラー

キャプションブロックの色を設定することができます。

Q&Aのカラー

Q&Aボックスの色を設定します。

SWELL設定 → エディター設定 → カラーセット → Q&Aのカラー

Q&Aの色を決めることができます。

ボーダーの設定

ボーダーボックスの設定です。

SWELL設定 → エディター設定 → ボーダーセット → ボーダーセットの登録

ボーダーセットの色を設定することができます。

マーカーの設定

文章に引くマーカーの設定です。

SWELL設定 → エディター設定 → マーカー → マーカー設定

マーカーを希望の色に変更することができます。

ボタンの設定

記事内で設置できるボタンの設定です。

SWELL設定 → エディター設定 → ボタン → ボタンの設定

記事内で使用できるボタンの色・形や質感を設定することができます。

アイコンボックス

記事内で使用できる便利なアイコン付きボックスの設定です。

SWELL設定 → エディター設定 → アイコンボックス

アイコン付きのボックス色を編集することができます。

ふきだしカラーの設定

記事内で使用できる会話風のふきだしを設定します。

SWELL設定 → エディター設定 → ふきだし

ふきだしの色を設定することができます。

ブログカード

関連記事や外部リンクをカード式にして設置するブログカードの設定です。

SWELL設定 → エディター設定 → その他 → ブログカード

ブログカードは、内部リンクと外部リンクでデザインを変えることができます。

引用の設定

引用文章で使えるブロックの設定です。

SWELL設定 → エディター設定 → その他 → 引用

引用スタイルを変更することができます。

SWELL初期設定4|ヘッダーの設定

SWELL初期設定4|ヘッダーの設定
SWELL初期設定4|ヘッダーの設定

SWELLのヘッダー色やロゴ・メニューを設定していきます。

ヘッダーカラーの設定

SWELLのヘッダー色を設定します。

外観 → カスタマイズ → ヘッダー

画像

追従ヘッダーに設定する

SWELLでヘッダーを常に上部に設置する、追従ヘッダーの設定方法です。

画像

ヘッダーバーの設定

SWELLヘッダーの上にバーを設置する方法です。

画像

SWELL初期設定5|フッターの設定

SWELL初期設定5|フッターの設定
SWELL初期設定5|フッターの設定

SWELLのフッター設定をしていきます。

外観 → カスタマイズ → フッター

画像

フッターカラーの設定

SWELLのフッター色を設定します。

画像

コピーライトの設定

SWELLフッターに表示されるコ、ピーライトの設定をします。

画像

SWELL初期設定6|サイドバーの設定

SWELL初期設定6|サイドバーの設定
SWELL初期設定6|サイドバーの設定

SWELLのサイドバー設定をしていきます。

外観 → カスタマイズ → サイドバー

画像

サイドバーのタイトルデザイン

SWELLのサイドバーデザインを設定します。

外観 → カスタマイズ → サイト全体設定 → タイトルデザイン

画像

SWELL初期設定7|トップページの設定

SWELL初期設定7|トップページの設定
SWELL初期設定7|トップページの設定

SWELLのトップページの設定をしていきます。

メインビジュアル画像

SWELLトップページのメインビジュアル設定をしていきます。

外観 → カスタマイズ → トップページ → メインビジュアル

ピックアップバナー

SWELLヘッダーのピックアップバナーを設定してきます。ピックアップバナーとは、メインビジュアルの下にあるオススメ記事の部分です。

画像

外観 → カスタマイズ → トップページ → ピックアップバナー

なお、ピックアップバナーの設置方法は以下をご覧ください。クリックすると、説明書が展開いたします。

ピックアップバナーの設置方法はコチラ
STEP
「メニュー」を設定する

まずメニューの表示オプションを設定します。

外観 → メニュー

上部にある「表示オプション」をクリックし「説明」にチェックを入れましょう。

STEP
メニューで「ピックアップバナー」を作成する

メニューで「新しいメニューを作成しましょう」をクリックします。タイトルは任意ですが、分かりやすく「ピックアップバナー」などが良いでしょう。

メニューの位置は「ピックアップバナー」にチェックを入れておきます。

STEP
ピックアップバナーに表示したいものを選ぶ

あなたがピックアップバナーに表示したいコンテンツを選択し、設置していきます。オススメは「上位表示を狙ってる記事」や「渾身の1記事」、「収益化に注力してる記事」です。

STEP
バナー画像も設置しておく

ピックアップバナーで表示させたい画像を設定していきます。先ほど表示させておいた「説明」欄に、画像URLをコピペします。

画像URLの取得方法

画像URLは、メディアライブラリから取得することができます。ですので、あらかじめ画像をメディアにアップロードしておく必要があります。アップロードされた画像の詳細に、画像URLがあるのでコピペすれば OKですよ。

画像URL)https://●●△△.jp/■■.jpg

なお、投稿記事やカテゴリーを設置した場合、アイキャッチ画像がデフォルトで設定されます。改めて画像を設置する必要がない人は、説明欄に画像URLは不要でございます。

記事スライダー

SWELLのトップページに記事スライダーを設置します。記事スライダーとは、あなたの記事がランダムで右から左へと流れ続けるコンテンツです。記事スライダーにより、最初の方に書いて埋もれていた記事を読者にアピールすることができます。

外観 → カスタマイズ → トップページ → 記事スライダー

お知らせバー

SWELLのトップページにお知らせバーを設置します。お知らせバーを設置することにより告知などを表示させることができます。

外観 → カスタマイズ → サイト全体設定 → お知らせバー

SWELL初期設定8|ふきだしの設定

SWELL初期設定8|ふきだしの設定
SWELL初期設定8|ふきだしの設定

SWELLの投稿記事で使用できる「ふきだし」を設定します。

Ai

こんな感じのデザインです。吹き出しで色んな補足を伝えたりできますよ!

SWELLふきだし設定
STEP
ふきだし設定に移る

ダッシュボードから「ふきだし」をクリックします。

STEP
新規ふきだしを追加する

「新規ふきだし追加」をクリックします。

STEP
ふきだしの詳細を設定する

ふきだしの設定画面にて、詳細を設定していきます。

STEP
複数作ることもできる

STEP1〜3を繰り返せば、複数のふきだしを設定することもできます。複数ふきだしの応用は以下の通り。

  • 喜怒哀楽のキャラクターを設定し、表現力を高める
  • 複数の異なるキャラクターを設定し、会話風にする

以上で、ふきだし設定は完了です。

SWELL初期設定9|サイト高速化の設定

SWELL初期設定9|サイト高速化の設定
SWELL初期設定9|サイト高速化の設定

SWELLのサイト速度を速くする初期設定を紹介させていただきます。ここでは、必要最低限の設定だけお伝えしますね。

Jony

使用プラグインや用途によって設定が違ってくるので、基本的なものだけお伝えします!

サイト高速化の設定
設定
SWELL高速化設定をする

まず SWELL高速化の設定画面に進みます。

ダッシュボード → SWELL設定 → 高速化

設定
キャッシュ機能

キャッシュ機能では、全てにチェックを入れます。

設定
遅延読み込み機能

遅延読み込み機能は、以下のようにチェックを入れてください。

設定
ファイルの読み込み / ページ遷移高速化

「ファイルの読み込み」と「ページ遷移高速化」は以下のようにチェックを入れておきます。

以上で、SWELL高速化の設定は完了です。

SWELL初期設定10|プロフィールの設定

SWELL初期設定10|プロフィールの設定
SWELL初期設定10|プロフィールの設定

SWELLのプロフィールの設定をしていきます。プロフィールには、大きく2つの種類があります。

SWELLプロフィール種類
  • プロフィールウィジェット
  • この記事を書いた人(著者情報エリア)

それぞれ、解説させていただきますね。

プロフィールウィジェット

プロフィールウィジェットとは、サイドバーやトップ上部でも使えるウィジェット型のプロフィールのことです。サイトで最も目にするのはサイドバーに設置されているタイプですね。

ここでは例として、サイドバーに設置していく方法を解説します。

外観 → カスタマイズ → ウィジェット → サイドバー

と進み「[SWELL]プロフィール」を選択し、設置します。

  • 名前:表示させる名前
  • 役職(肩書き):希望の役職を記入(例:ブロガー、投資家、会社員 etc…)
  • プロフィール文:あなたについての説明文
  • アイコン画像:プロフィールで表示させるアイコン画像
  • プロフィール背景画像:プロフィールの背景画像
  • ボタンリンク先:任意のボタンリンク
  • ボタンテキスト:ボタンに表示するテキスト
  • SNSアイコンリストを表示する:SNSアイコンの表示・非表示
  • アイコンを丸枠で囲む:アイコンの枠を囲むかどうか

詳しくは、SWELL公式サイトでも解説されていますので、ご覧ください。

この記事を書いた人(著者情報エリア)

「この記事を書いた人」とは、記事の最後に表示される著者情報のことです。

外観 → カスタマイズ → 投稿・固定ページ → 記事下エリア

著者情報エリアの設定「著者情報を表示」にチェックを入れれば表示されます。

ここでは WordPressで編集された著者情報が表示されます。著者情報の編集手順は以下の通りです。

ダッシュボード → ユーザー → プロフィール

と進み、プロフィールを編集してください。

著者情報の設定に関しては、SWELL公式でも解説しておりますのでご覧ください。

SWELL初期設定11|メニューの設定

SWELL初期設定11|メニュー
SWELL初期設定11|メニュー

SWELLでメニューを設定しておきます。メニューとはデフォルトでは「お問い合わせ」「プライバシーポリシー」といった項目です。

外観 → メニュー

と進み「新しいメニューを作成しよう。」をクリックします。

  • メニュー名:希望の名前
  • メニュー設定:設置したい場所を選択

「メニューを作成」をクリック。

あとは「メニュー項目を追加」から希望の項目を追加していけば完了です。

SWELL初期設定12|ウィジェットの設定

SWELL初期設定12|ウィジェットの設定
SWELL初期設定12|ウィジェットの設定

SWELLでウィジェットを設置していきます。まずは基本的なものを追加していけば OKですよ。

外観 → カスタマイズ → ウィジェット

と進み、希望の箇所に希望のウィジェットを入れていきます。例えば、サイドバーにプロフィール、カテゴリー、人気記事などを入れるのが定番ですね。

SWELL初期設定13|SNS情報の設定

SWELL初期設定13|SNS情報の設定
SWELL初期設定13|SNS情報の設定

SWELLの初期設定 13、SNS情報の設定をしていきます。

外観 → カスタマイズ → SNS情報

あなたが表示させたい SNSのリンクを設置することができますよ。

SWELL初期設定14|Googleアナリティクスの設定

SWELL初期設定14|Googleアナリティクスの設定
SWELL初期設定14|Googleアナリティクスの設定

SWELLで Googleアナリティクスの設定を行います。Googleアナリティクスとは、ユーザーの動きやアクセス数をチェックできるツールです。

Googleアナリティクスでできること
  • 1日〜1年でどれくらいの人があなたのブログを見たか
  • どの地域、国からあなたのブログを見たか
  • どのデバイス(PC、スマホ、タブレット)であなたのブログを見たか

ブログ収益化に必須ツールでして、しかも無料で利用できます。SWELLではアナリティクスの設定が非常にカンタンです。

詳しくは【10分で完了】SWELLでGooglアナリティクスの設定方法【GA4対応】で解説してますので、ぜひ参考にしてみてくださいね。

以上で、Googleアナリティクスの設定は完了です。続いて、Googleサーチコンソールを設定しましょう。

SWELL初期設定15|Googleサーチコンソールの設定

SWELL初期設定15|Googleサーチコンソールの設定
SWELL初期設定15|Googleサーチコンソールの設定

SWELLで Googleサーチコンソールの設定をしていきます。Googleサーチコンソールとは、サイトのインデックス登録や、SEO検索順位のチェックなどが無料でできます。

サーチコンソールでできること
  • あなたの記事が「どの単語」で検索されているか
  • あなたの記事が Googleでどれくらいの検索順位なのか
  • あなたの記事がどれくらいクリックされているか

ブログの閲覧数をチェックできるツールなので必ず設定しておきましょう。こちらも無料です。

サーチコンソールの設定方法は、【10分で完了】SWELLのGoogleサーチコンソール設定方法で詳しく解説させていただいておりますので、ご覧ください。

SWELL初期設定16|Googleアドセンス広告の設定

SWELL初期設定16|Googleアドセンス広告の設定
SWELL初期設定16|Googleアドセンス広告の設定

SWELLに Googleアドセンス広告を設定する方法です。アドセンス広告を設置するかどうかは任意ですので、不要な方はスキップしてくださいね。

Googleアドセンスの設定
STEP
Googleアドセンス広告を取得する

希望の Googleアドセンス広告コードを選択します。

コードが表示されたら、コピーしておきます。

STEP
SWELLに貼り付ける

SWELLにアドセンス広告コードを貼り付けます。

ダッシュボード → SWELL設定 → 広告コード

希望の箇所に、アドセンス広告コードを貼り付ければ完了です。

広告コードの設定
  • 記事内広告:記事の中に設置される広告
  • 目次広告:目次の前後に表示される広告
  • 自動広告 :アドセンスの自動広告
インフィード広告の間隔

インフィードとは、投稿ページ、カテゴリーページの投稿一覧内に表示される広告です。

  • PC・Tabサイズ用:パソコン・タブレットサイズ用
  • スマホサイズ用:スマホで表示されるサイズ用
  • インフィード広告の間隔:何個の記事ごとに表示させるか

これで Googleアドセンスの設置も完了です。

Jony

広告と言えば、SWELLでは「SWELLをアフィリエイトできる広告」を設置することができます。SWELLを販売すれば購入額を回収することができるのでオススメです!

【おまけ】SWELLのアフィリエイト広告を設置しておこう!

【おまけ】SWELLのアフィリエイト広告を設置しておこう!
【おまけ】SWELLのアフィリエイト広告を設置しておこう!

SWELLは、購入者限定でアフィリエイト(報酬 2,500円/件)することができます。トップページやサイドウィジェットに表示することもできますので、ぜひ設置しておきましょう。

Jony

だいたい7件ほど売れれば、SWELL購入額を回収することができます。SWELLは長い目で見ると実質無料で購入することができるということですね!

SWELLアフィリエイト広告を設置する
STEP
SWELLを購入する

アフィリエイトは SWELL購入者限定ですので、まずは SWELLを購入しておくことが必要です。

>>SWELLを購入する

STEP
SWELL会員に登録する

続いて、アフィリエイトリンクを取得するために会員登録します。

>>SWELL会員登録する

STEP
SWELL「プロモーション詳細はこちら」にアクセスする

会員登録ができたら「プロモーション詳細はこちら」から ASPもしもアフィリエイトにアクセスします。

SWELLのアフィリエイトはもしもアフィリエイトで取り扱っています。

STEP
もしもアフィリエイトに登録する
STEP
SWELL広告を取得する

SWELLの広告から、希望のバナー広告やテキスト広告を取得し、ブログの任意の場所に設置します。

SWELL案件から「広告リンクへ」をクリックすると、複数の広告が表示されますよ。

Ai

取得した広告リンクは、記事内に貼り付けたり、サイドバーの広告ウィジェットに設置したりできます!

SWELL初期設定まとめ:次はいよいよ記事を投稿してみよう!

今回は SWELLの初期設定を解説させていただきました。全てこなすと1時間ほどかかってしまい、正直疲れるかもしれません。

しかし、最初にやっておかないと後でもっと大変な作業になるものですので、必ず最初に設定しておきましょう。

これで SWELLで作ったブログが、基本的な形になりました。次はいよいよ記事を投稿していきます。

SWELLをまだ購入してない人は、以下のリンクからどうぞ。

今回は以上です。

  • URLをコピーしました!
この記事の目次