MENU
よあけ
【著者プロフィール】ふなさん
▶︎ WEBマスター歴20年以上/元WEBデザイナー(出版社のHPなど)
▶︎ WordPress構築歴は10年以上
▶︎ 資格:ネットショップ実務士レベル1/基礎心理カウンセラー
▶︎ WordPress構築最適化・テーマの活用方法・アフィリエイトブログの作り方など発信
▶︎ ブログ収入は1000万円以上を達成しています。
▶︎ 掲載しているノウハウ・結果には個人差があり、成果を保証するものではありません
▶︎ 趣味:ブログ・音楽・筋トレなど
ブログの始め方 - なぜ初心者でも稼げるのか?

SWELLの初期設定・導入手順

swell

※当ブログのすべての情報は可能な限り正確な情報を掲載しておりますが、掲載しているノウハウ・結果には個人差があり、成果を保証するものではありません ※当ブログのリンクの一部には広告が含まれます。

目次

SWELLスウェルの初期設定・導入手順

SWELLスウェルの初期設定・導入手順を解説します。

はじめてWordPressワードプレス有料テーマを初期設定・カスタマイズする場合は、はじめからデザインにこだわりすぎるのは禁物です。

WordPressテーマの初期設定をほぼ変えずに使うことで、カスタマイズにかける時間・工数を減らしてコンテンツ作りに集中できます。

スマホ時代の現代で、デスクトップ表示のサイトデザインに時間をかけることはほぼ無意味です。

スマホファーストのデザインを行うことでユーザビリティも良くなり、カスタマイズにかける手間も減らすことができます。

それではSWELLの初期設定について解説していきます。

SWELLスウェルのデメリットとは?

  • SWELLのデフォルトの配色があまりよくない

SWELLは機能面ではほぼデメリットがありませんが、気になるとことが一点あります。

それはデフォルトの配色です。

その理由をわかりやすく説明します。

SWELLの初期設定の配色

SWELLのデフォルトの配色を見てあなたは率直にどう思いましたか?

SWELLの基本カラー #04384c

SWELLのデフォルトの配色があまりよくないのでそのまま使うと失敗します。

SWELLのデフォルトの基本カラー(メインカラー)があまりよくない配色になっています。

SWELLのキーカラーはSWELL(うねり)という意味の通り深海をイメージしたものになっています。

ですがサイトデザインに使うにはジャンルが限られる色なので、そのまま使うのは推奨しません。

この色がよく使われる業種とは?
一昔前の病院や整骨院、老人ホームなど。

濃い色は気分を重くさせるので、いまはサイトデザインで重い色はほぼほぼ使わなくなってます。
かっこよさよりも暗い気持ちが湧きおこりやすいです。

SWELL おすすめの初期設定

SWELLの初期設定方法やコツがわからない人は参考にしてください。

はじめからあまりごちゃごちゃと複雑にカスタマイズするのは時間の浪費です。

基本的にデフォルトのものを使うのが時短するにはおすすめです。

使いこなしていけば自分の好みのカスタマイズ方法やブロックエディタの使い方も慣れてきます。

それから自分のサイトデザインにしていけばOKです。

詳しいテンプレートのカスタマイズ方法は『SWELLテーマの使い方・テンプレートカスタマイズ』も参考にしてください。

基本カラーの設定変更

《設定箇所》カスタマイザー起動 → サイト全体設定 → 基本カラー

先にも説明した通り、SWELLの基本カラーはあまり明るくないので変更しましょう。

SWELLのカスタマイズ画面

おすすめの配色 #00b1c3

当ブログでは気分が明るくなる配色をベースにしています。

とりあえず基本カラーを明るいものに変更するだけでもサイトの印象が変わるので、ぜひやってみてください。

メインカラー#00b1c3
テキストカラー#333
リンクカラー#0099cc
背景色#fdfdfd
当ブログの基本配色

サイトのテーマやキーカラーが決まっていない場合は、サクッとマネしていただくと当サイトと同じ配色になります。

そのほかの配色パターンはこの記事を参考にしてください。

SWELLの子テーマをダウンロード

子テーマ使ってなかったから保存したデータが消えちゃったよ!

子テーマを使うとカスタマイザーで保存したデータが消えないですよ。

SWELLの子テーマは、SWELL公式会員サイトのマイページでダウンロードできます。

子テーマを使うには必ず親テーマが必要です。

小テーマの役割は、保存した設定を変えずに親テーマの更新ができることです。

逆に子テーマを使わずに親テーマだけを使っていると、親テーマをアップデートしたときに設定保存したデータが上書きされて消されてしまいます。

WordPressテーマを使うなら、必ず子テーマを使おう!

サイト基本情報の設定

《設定箇所》カスタマイザー起動 → WordPress設定 → サイト基本情報

SWELLのカスタマイズ画面

この箇所でサイト情報やキャッチフレーズ、サイトアイコンを設定・変更できます。

グーグルの検索結果にも反映されます。

サイトアイコンはこちらのサイト『リンクリングミー』で作成しました。

リング付きの透過PNG画像が簡単に作れるので会話アイコンを作るのにもおすすめです。

見出しデザインの設定(コンテンツのデザイン)

《設定箇所》カスタマイザー起動 → 投稿・固定ページ設定 → コンテンツのデザイン

SWELLの見出しデザイン設定は『コンテンツのデザイン』という箇所で行います。

SWELLのカスタマイズ画面
見出しのキーカラーデフォルト
見出し2のデザイン
見出し3のデザイン下線(ストライプ)
見出し4のデザイン左に縦線
セクション見出しのキーカラーデフォルト
セクション用見出し2のデザインデフォルト
コンテンツデザインの設定

当ブログではこのように設定しています。(2022年4月時点)

Googleアナリティクスとサーチコンソールの設定

GoogleアナリティクスとGoogleサーチコンソールの設定はどこでやるのか?

SWELLの場合はSWELLと開発者が同じの『SEO SIMPLE PACK』というプラグインを使います。

WordPressのプラグイン新規登録で『SEO SIMPLE PACK』を検索してインストールします。

Googleアナリティクスの設定
Googleサーチコンソールの設定
OGP画像の設定

SEO SIMPLE PACKの詳しい設定方法、使い方はこちらを参考にしてください。

スマホの固定フッターメニュー、ハンバーガーメニューを設定する

スマホのナビゲーションを設定する

スマホのナビゲーションを最適化するのは、サイトの回遊率を上げる上でとても大切です。

この設定をしていないのはPV増加のチャンスを自ら逃しているようなものなので、計画的にせっていしてPVアップを図りましょう。

参考サイトを調べる方法(配色・デザイン)

サイトデザインの業種・配色(カラー)・サイトの種類をまとめたサイトがあります。

幅広いジャンルの業種とカラー別に参考サイトを調べることができるのでとても参考になります。

例えば、カフェの店舗サイトやブログを作る場合とリラクゼーション店舗のサイトを作る際の最適なベースカラーは違いますよね。

人気のある心地よい配色を研究してみてマネてみましょう。

まとめ

SWELLの初期設定の方法やカスタマイズ方法については順次追記していきます。

高機能で人気のテーマ

SWELLテーマの購入〜カスタマイズ

ネットで稼ぎたいなら必見の動画

ブログを始めて3ヶ月目ぐらいでこの動画講座を知って、それ以降、私はブログで稼ぎ続けることができています。
ブログ初心者必見の内容です。

\ マーケティングがわかる /

※無料コンテンツ後に課金プランあり(課金しなくてもOKです)

  • URLをコピーしました!
目次