WordPress(ワードプレス) テーマカスタマイザーの使い方

WordPress

【徹底解説!WordPressテーマカスタマイザーの使い方】

2019年6月20日

ここでは、WordPressのテーマカスタマイザーの使い方について説明していきます。
 

WordPress テーマカスタマイザー
 


 

【WordPress対応】自分でホームページ・ブログを作成したいWebスクールWEBST8
WordPress 自分でホームページ・ブログを作成したい個人事業主のためのWebスクール・教室 ウェブストエイト


 

テーマカスタマイザーとは

テーマカスタマイザーは、WordPressのテーマのレイアウトや表示に関する設定を行う機能です。
 
WordPress テーマカスタマイザー
 

テーマカスタマイザーから、下記のような設定を行うことができます。

テーマカスタマイザーで設定できること

  • サイトアイコン、サイトタイトル、キャッチフレーズの設定
  • 追加CSSの設定
  • ウィジェット、メニューの設定
  • トップページメインビジュアル、カラー、その他テーマが持つ各表示設定
    (※)カスタマイザーの設定項目は、ご利用のテーマによって設定項目が異なります。

 

カスタマイザーの設定項目は、ご利用のテーマによって設定項目が異なります。上記例では、表示されている設定項目は、「テーマ共通の設定項目」+「適用テーマ(ここではLightning)独自の設定項目」が表示されています。

 

逆に、下記はシンプルなテーマのカスタマイザーの設定項目です(テーマ自体に独自の設定項目を持たせていません)
WordPressカスタマイザー シンプルなテーマ「WEBST8」
 

設定項目が少ないですね

 

テーマ共通の設定としては、下記のような項目があります。
 

テーマ共通の設定

  • サイト基本情報
  • メニュー(※)
  • ウィジェット(※)
  • 追加CSS

(※)メニューとウィジェットについて外観>メニュー、外観>ウィジェットで設定できるので、次章以降の説明では割愛します。

 

(関連)あわせて読みたい記事

●メニューの使い方→「WordPress メニューバー(ナビゲーション)の作り方を徹底解説

●ウィジェットの使い方→「初心者でもわかるWordPressウィジェットの使い方を徹底解説

 
 
 

テーマカスタマイザーの使い方(テーマ共通の項目編)

テーマカスタマイザーの設定方法

カスタマイザーの設定は、外観>カスタマイズ、または、トップページを開いた状態で「カスタマイズ」のどちらかから行うことができます。
 

■外観>カスタマイズから、テーマカスタマイザーを開く
外観>カスタマイズ
 

■トップページ上部のバーの「カスタマイズ」から、テーマカスタマイザーを開く
トップページ>テーマカスタマイザー
 

任意の設定を変更した後は「公開」ボタンで反映することができます。
カスタマイザーの公開ボタンで反映されます
 

また右側のアイコンをクリックすると、下書きで保存したり、予約公開することもできます。
カスタマイザーの右上のアイコンをクリックして、下書き保存や予約公開ができます。
 

ここからは、テーマカスタマイザーの設定項目について、どのテーマでも共通で設定できる項目を中心に説明していきます。

 

ファビコン(サイトアイコン)を設定する

ファビコン(サイトアイコン)は、サイト基本情報>サイトアイコンの画像から設定できます。
カスタマイザー>サイト基本情報
 


 

(※)サイトアイコンの画像サイズは、正方形の512px*512px以上のサイズが推奨されています。
 

ところでファビコン(サイトアイコン)って何ですか??

ファビコンは、サイトのシンボルマークとなるアイコンのことで、ブラウザの左上に表示されます。

 

ファビコン(サイトアイコン)の表示例
ファビコン(サイトアイコン)の例
 

また、最近はスマートフォンで検索した時にも表示されるので、ロゴなどがあればぜひ設定しておきたいですね。

スマートフォンで表示されるアイコン
 
 

サイトのタイトル・キャッチフレーズを設定する

サイトのタイトル・キャッチフレーズは、サイトアイコンと同様にサイト基本情報から設定できます。


 

(補足)サイトのタイトル・キャッチフレーズは、ダッシュボードの設定>一般設定からでも変更することができます。
設定>一般設定で、サイトタイトルやキャッチフレーズを変更することもできます。
 
 

追加CSSを設定する

追加CSSは、WordPress4.7から追加された機能で、子テーマを作らなくても、自分で定義したCSSコードでページのスタイルを調整することができる機能です。
 

カスタマイザーの追加CSSから設定を行います。
WordPress カスタマイズ>追加CSS
 

CSS編集画面で任意のCSS設定を行うことができます。
WordPress カスタマイズ>追加CSSからCSSの編集する
 

また、この追加CSSで編集した内容はテーマのテンプレートを直接編集していないため、テーマが更新されても内容がクリアされることはありません。
 

追加CSSで設定した内容は、テーマを変更すると設定内容がクリアされますので注意してください。
 

合わせて読みたい記事

WordPressの子テーマによるカスタマイズのやり方については、「WordPressで子テーマを作成してカスタマイズする方法」をご参照ください。

WordPressで子テーマを作成してカスタマイズする方法

 
 

テーマカスタマイザーの使い方(テーマ独自の項目編)

次に、「Lightning」を例に、テーマ独自の設定項目についても説明していきます。
 

下記は、無料テーマ「Lightning」のカスタマイザーの画面です。
 

Lightning利用時のテーマカスタマイザーの設定項目
 

Lightning 〇〇〇〇と書いてあるのが、テーマ独自のカスタマイザー設定項目ですね。

ご利用のテーマによって、ここの表示項目や設定のやり方は異なりますのでご注意ください。

 
それでは、具体的な使い方を説明していきます。
 

トップページスライドショーを変更する

Lightningの場合は、「Lightning トップページスライドショー」からスライドショーの設定変更ができます。
Lightning トップページスライドショー
 

実際に変更してみましょう。下記のようにスライドショーの画像を変更して「公開」ボタンを押せば完了です。


 
 

メインカラー変更する

つづいて、メインカラーを変更してみましょう。「Lightning デザイン設定」を選択します。
カスタマイザー > Lightning デザイン設定
 

早速色を変更してみましょう。ここでは、緑系統から赤系統の色に変更しました。


 

ロゴを変更する

同様に、「Lightning デザイン設定」から、ロゴの変更もできます。


 

トップページを1カラムにする

同様に、Lightning デザイン設定から、トップページを1カラムに変更することもできます。


 

ここでは割愛しますが、そのほかにも色々な設定ができますので、ぜひ試してみてください。
 

テーマにもよりますが、多くのテーマでは、このカスタマイザーからトップページ画像の設定、色の設定、その他デザインに関わる設定を行えることが多いです。

自分の使っているテーマで、どんな設定項目があって、どんな設定ができるのか確かめてみますね!

 
 

まとめ WordPressテーマカスタマイザーの使い方

ここでは、WordPressのテーマカスタマイザーの使い方について、解説しました。
 

WordPress テーマカスタマイザー
 

多くのテーマで、カスタマイザーからテーマの設定を行うことができますので、ご利用のテーマでどんな設定ができるのか確かめてみてください。
 

今回は以上になります。最後までご覧いただきありがとうございました。
 

合わせて読みたい記事

WordPressの基本的な使い方を覚えたい方は「【2019年度版 WordPress使い方総まとめ】ワードプレスの使い方を徹底解説」をご参照ください。

■目的別WordPressのおすすめテーマはこちら
目的別WordPressおすすめ有料テーマ8選
目的別WordPressおすすめ無料テーマ8選
アフィリエイトにおすすめWordPressテーマ厳選7選

 


弊社は、自分でホームページを作ることを推奨しています。「業者に任せたけど、更新ができない」「本で独学は時間がかかりすぎる・・」そんなお悩みの方も多いのではないでしょうか。

個別指導形式のスクールでは、自分の知りたいことをピンポイントで学習・達成でき、自分で更新もできるというメリットもあります。
無料事前相談もしておりますので、まずはお気軽にご登録ください。

詳細はこちら


 

『自分で作る選択を』
自分でホームページ作成・Web集客したいホームページ作成スクール・教室

自分でホームページ作成・Web集客したいホームページ作成スクール・教室 WEBST8

検索して記事を見つけたい方はこちら

検索して記事を見つけたい方はこちらにキーワードを入力してお探しください。

おすすめ記事3選

【WordPressの始め方総まとめ】ワードプレスブログの作り方9STEP

WordPress(ワードプレス)でブログを始めようと思った時に、サーバー・ドメインの手続きなどわからないことだらけで困っているというお悩みをお持ちの方も多いのではないでしょうか。本記事では、WordPressでブログやアフィリエイトを始めたい初心者を対象にWordPressの始め方をご紹介していきます。

【WordPressホームページの作り方総まとめ 12STEPで解説】

WordPressでホームページを自作しようと思った際に、「ドメイン?サーバー?たくさん調べることがあって何から手をつけたら良いのかわからない」というかたも多いのではないでしょうか。この記事ではWordPress初心者の方を対象にWordPressでホームページを作る方法をご紹介していきます。

【2020年版WordPress(ワードプレス)の使い方総まとめ】

今回は、これからWordPress(ワードプレス)を使ってホームページまたはブログサイトを作りたい初心者の方向けに、WordPressの導入から使い方までまとめて説明していきます。 (※)WordPress5.0から実装された最新のブロックエディター(グーテンベルグエディター)にも対応しています。

-WordPress
-,

© 2020 WEBST8のブログ Powered by AFFINGER5