質問SWELLをインストール後にまず何をすれば良い？
新しいWordPressテーマにすると、まず何をしたら良いのか迷いますよね。
私も最近WordPressのテーマをCocoonからSWELLに乗り換え、色々設定やデザインカスタマイズをしました。
ちょうど乗り換えたばかりですので、私が実際に行った設定やデザインカスタマイズをひと通りまとめたいと思います。
これからSWELLを導入する方の参考になれば幸いです。
▼SWELLについてはこちらの記事に詳しく書いています
今回紹介している手順は記事執筆時のものです。手順が変更になる可能性があるのでご了承下さい。
▼え？30分でWordPressが立ち上げられるの？
WordPress初心者でも爆速でブログを開設する方法
▼稼げるアフィリエイトASPを紹介します！
アフィブログで稼ぐために絶対登録しておきたいASP6選
▼WordPressテーマ選びに困ったら…
【ブログ初心者にオススメ】WordPress有料テーマランキング
▼SNSのアイコンを変えて収益もモチベーションもUP！
【体験談】ココナラでSNSアイコンのイラストを依頼してみた【素敵アイコンに大満足！】
SWELLをインストール後にやっておきたい設定
SWELLを購入〜インストール後にやっておきたい設定を説明します。
SWELLでブログを運営するのであれば、アドセンスやアナリティクスなどの設定を行う必要があります。
まずやっておきたい設定は次の通りです。
- Googleアドセンスの設定
- SEO SIMPLE PACKプラグインの導入
- Google XML Sitemapsプラグインの導入
- Googleアナリティクスの設定
- Googleサーチコンソールの設定
- OGPの設定
- SWELLERS’ IDの設定
Googleアドセンスの設定
SWELLでは、Googleアドセンスの広告を簡単に表示できる機能があります。
Googleアドセンスで発行されたコードを以下の箇所で設定します。
■記事内広告
ここに設定すると、ショートコードを記事に貼ることによって簡単に広告表示できます。
■目次広告
ここに設定すると、自動的に目次の直前または直後に表示されます。
当ブログもここに設定しています。
なお、目次の前と後のどちらかに設定するかは、カスタマイザーの「投稿・固定ページ」 > 「目次」から設定できます。
■自動広告
Googleの自動広告(Google側で判断して広告を表示させる機能)を使っている方は、ここに広告コードを設定します。
■インフィード広告の設定
インフィード広告(記事一覧の中に広告表示)を使っている方は、ここに広告コードを設定します。
PC・Tabサイズ用とスマホサイズ用の2箇所設定が必要です。
インフィード広告は、記事一覧のどこに挿入するか設定できます。例えば「4」と設定すると、5記事目に広告が入ります。
SEO SIMPLE PACKプラグインの導入
SWELLは、SEO関連の設定項目がありません。
【SEO関連の設定項目がない理由】
SEO関連の設定をWordPressテーマに設けてしまうと、テーマを変えた時に設定が引き継げないからです。
プラグイン側に設定すれば、テーマを変えても設定はそのまま引き継げるので便利です。
というわけで、SWELLを利用するときは、SEO関連のプラグインが必要です。
おすすめのSEOプラグインは、SWELLの開発者が作成した「SEO SIMPLE PACK」です。
よく使われるSEOプラグインの「All in One SEO Pack」に比べると軽量で、扱いやすいのが特徴です。
「All in One SEO Pack」を使っていると、どこに何を設定すれば良いのか難しいですよね。
一方「SEO SIMPLE PACK」を使えば、titleタグやdescriptionタグ、meta・OGPタグなどを簡単に設定できます。
インストール方法は、プラグイン管理画面で検索して、「今すぐインストール」を押して下さい。その後「有効化」して下さい。
もともと、All in One Packを使っているのであれば、そのままでも問題ないと思います。
SEO SIMPLE PACKの方が軽量ですが、All in One Packでも必要な機能が揃っています。
Google XML Sitemapsプラグインの導入
前述のSEO SIMPE PACKプラグインでは、XMLサイトマップの作成機能までは含まれていません。
XMLサイトマップの作成は、一般的によく利用されている「Google XML Sitemaps」プラグインの利用がおすすめです。
XMLサイトマップは、Googleなどの検索エンジンに自分のサイトの構造を認識してもらうために必要です。
インストール方法は、プラグイン管理画面で検索して、「今すぐインストール」を押して下さい。その後「有効化」して下さい。
Googleアナリティクスの設定
アクセス解析にGoogleアナリティクスを使っている方は多いと思います。
SWELLのテーマ内には、Googleアナリティクスの設定項目がないため、SEOプラグインを利用します。
ここでは、「SEO SIMPLE PACK」を使った設定方法を解説します。
Googleアナリティクスの設定は、以下の箇所で行います。
Googleアナリティクスで発行されているトラッキングIDを設定します。
Googleサーチコンソールの設定
Googleサーチコンソールを使っている方は、サーチコンソールの設定もしましょう。
「SEO SIMPLE PACK」を使った設定方法を解説します。
Googleサーチコンソールの設定は、以下の箇所で行います。
Googleサーチコンソールで発行されるHTMLタグを、画面のGoogleサーチコンソールに入力したら完了です。
OGPの設定
Twitterで記事を拡散したい方は、OGPの設定も忘れずに行いましょう。
OGPとは「Open Graph Protocol」の略で、Twitterなどで記事URLを投稿すると、URLだけでなく画像も一緒に伝えることができ、目が留まりやすくなります。
OGPも「SEO SIMPLE PACK」で簡単に設定できます。
OGPの設定は、以下の箇所で行います。
ここで、サイト全体のデフォルト画像を設定します。
通常の記事であれば、その記事のアイキャッチ画像がSNSに表示されますが、アイキャッチ画像がない場合はデフォルト画像が表示されます。
ブロガーであれば、Twitter運用をしている方が多いと思うので、Twitterの設定もしましょう。
Twitter設定では、アカウント名とカードタイプを設定します。
カードタイプは通常の「summary」と、画像が大きくされる「summary_large_image」の2つ種類があります。
SWELLERS’ IDの設定
SWELLでは、独自のアフィリエイトプログラムがあります。
このプログラムでは、自分のブログからSWELL公式ページへのリンクが踏まれて、購入に至った場合報酬が支払われるシステムです。
このアフィリエイトを行う場合は、SWELLERS’ IDの登録が必要です。
まず、SWELLERS’のマイページに入ります。
(初回登録時に、購入したときに知らされるパスワードが必要です)
マイページに入ると、自分のSWELLERS’ IDが確認できます。
次に、WordPressの管理画面に戻って、以下の箇所にSWELLERS’ IDを入力します。
SWELLのアフィリエイトプログラムについては、公式ページを参照下さい。
SWELLをインストールした後にやりたいデザインカスタマイズ
SWELLをインストールした後にやっておきたいデザインカスタマイズを紹介します。
といっても、SWELLは何も設定しなくても綺麗なデザインです。
ですので、正直あまりいじってはいません。
ここでは、私が変えてみたデザインカスタマイズを紹介したいと思います。
デザインカスタマイズは、主にWordPressテーマカスタマイザーで行います。カスタマイザーは以下の箇所から起動します。
全体
タイトル、キャッチコピー、サイトアイコン
まず、タイトル、キャッチコピー、サイトアイコンを設定しましょう。
これらは、次の箇所で設定が可能です。
設定後、「公開」ボタンを押すと、サイトに反映されます。
カラー
続いて全体のカラーを設定しましょう。カラーは次の箇所で設定可能です。
ここのメインカラーを設定すると、全体的にこの色が使われます。
リンクカラーは必ず「青」にしましょう。多くの方が、リンク＝青という認識があるためです。
記事の横幅
個人的な好みの話ですが、若干記事の横幅が長いように感じました。
ブログは縦に読んでいくため、横幅が長いと少し見づらいように感じます。
そのため、私は記事の横幅を変更しました。
横幅は、下記の場所で設定できます。
私のブログでは、サイト幅を「1100」にしています。
トップページ
続いてトップページのカスタマイズポイントを紹介します。
ちなみに私のブログは、現在次のようにしています(今後変わる可能性もあります)
メインビジュアル(当ブログでは非表示)
メインビジュアルとは、タイトルの下に画像や動画を配置し、視覚的にサイトをアピールするようなものです。
何かに特化したサイトやブログであれば、効果的にサイトのイメージを訴えることができますね。
ただメインビジュアルを配置すると、ファーストビューに記事が見えないデメリットがあります。
どんな記事があるのかな？と来てくれる方もいるので、記事を優先的に見せたい方は、メインビジュアルを配置しない方が良いです。当ブログでも、メインビジュアルは配置していません。
メインビジュアルは下記の箇所で設定できます。
ちなみに初期状態は「画像」となっています。表示したくなければ、「表示しない」を選択しましょう。
なお、画像や動画を選ぶと、詳細に設定できるようになります。
メニュー
メニューは下記の箇所で設定可能です。
メニューの作り方を簡単に説明します。
メニューをまだ作っていなければ、「メニューを新規作成」ボタンを押します。
上部に表示するメニューであれば、メニューの位置を「グローバルナビ」にして下さい。
メニュー名は何でも良いですが、「グローバルナビ」のようにわかりやすい名前が良いと思います。
あとはメニューに項目を足していきます。
固定ページやカテゴリでメニューを作れます。
カテゴリーをメニューに入れたければ、カテゴリーを選んで「＋」ボタンを押して下さい。
ちなみに当ブログでは、メニューの各項目の下に説明文を置いています。
例えば「仕事/働き方」の下に小さく「Workstyle」と表示しています。
やり方はメニューの各項目を選んで、下記の「説明」部分に入力します。
お知らせバー
お知らせバーとは、何かアピールしたい記事や商品、お得情報などを効果的にアピールするものです。
お知らせバーは、ヘッダー付近の目立つところに配置されるため、クリックされる可能性があがります。
お知らせバーは以下の箇所で設定できます。
お知らせバーの表示位置を「ヘッダー上部に表示」か「ヘッダー下部に表示」を選択します。
「お知らせ内容」と「リンク先のURL」を入力して、後はバーの背景色などを設定しましょう。
記事スライダー
記事スライダーは、おすすめ記事をどんどんスライドしていく機能です。
ファーストビューにあるため、うまく読者の興味にマッチすれば読んでくれる可能性が上がります。
実際に、アクセスを分析すると記事スライダーからの遷移も多く発生しています。
一方デメリットは、画像が入っているためトップページが重くなることです。
ごちゃごちゃする印象もあるので、一概に記事スライダーを入れた方が良いとはいえないですね。
記事スライダーを入れる場合は、以下の箇所で設定できます。
記事スライダーに何を表示させるかは、「カテゴリー」か「タグ」を選択できます。
例えばおすすめ記事を表示させたければ、あらかじめおすすめしたい記事に「recommend」といったようなタグをつけておいて、下記のような設定をしましょう。
ピックアップ対象：タグ
ピックアップ対象のタグ名：(例)recommend(←記事スライダーに表示させるタグ名)
タブ切り替え機能
SWELLでおすすめしたい機能の一つに「タブ切り替え機能」があります。
通常はトップページに最新の投稿が一覧で表示されますが、このタブ切り替え機能を使えば、ワンクリックでカテゴリー毎の記事一覧を表示できます。
タブ切り替え機能の設定は、以下の箇所で設定できます。
タブにしたい、カテゴリやタグのIDを「タームタブ」の設定にカンマ区切りで入力すればOKです。
カテゴリやタグのIDは、下記の画面で確認できます。
「新着記事タブ」を追加するにチェックを入れると、新着記事もタブに入れられます。
サイドバー
サイドバーの設定は「ウィジェット」で行います。
サイドバーは、ウィジェットの「共通サイドバー」を使います。
ちなみに私のサイドバーの項目は以下のようになっています。
広告コード
Googleアドセンスをサイドバーに入れたい場合は、「[SWELL]広告コード」ウィジェットを使いましょう。
このウィジェットにアドセンスのコードを入力するだけで良いです。
プロフィール
プロフィールをサイドバーに入れたい場合は、「[SWELL]プロフィール」ウィジェットを使いましょう。
当ブログでは、次のように設定しました。
名前、プロフィール文、アイコン画像などを設定します。
ボタンを1個配置でき、私の場合はプロフィールへのボタンを配置しました。
「SNSアイコンリストを表示する」にチェックすると、SNSアイコンも配置できます。
ちなみに、SNSアイコンを表示したい場合は、下記の箇所からSNSのURLを設定して下さい
Facebook、Twitter、Instagram、LINE、Pinterest、Github、Youtube、Amazon欲しいものリスト、Feedly、RSS、お問合せページを設定できます。
SWELLプロモーションバナー
SWELLのアフィリエイトプログラムを行う場合は、「[SWELL]プロモーションバナー」ウィジェットを使うと、バナーを簡単に設置できます。
新着記事
新着記事をサイドバーに入れたい場合は、「[SWELL]新着記事」ウィジェットを使うと、簡単に設置できます。
当ブログでは次のように設定しました。
まとめ
本記事では、SWELLをインストール後にやっておきたい設定とデザインカスタマイズのポイントについて説明しました。
今回説明したように、WordPressテーマカスタマイザーを利用すれば、自由にデザインをカスタマイズできます。
また、設定画面もシンプルでわかりやすいので、あまり困ることなくカスタマイズできると思います。
SWELLは初期設定でも、十分綺麗なデザインになっていますが、ちょっとカスタマイズをして自分らしいブログを作ってみてはいかがでしょうか。
