画像付きで解説、ワードプレステーマdiverでTable of Contents Plusを使っていると思います。

h2色を基準に色を薄く2カラー変えて完了、30秒で出来るDiverカスタマイズ。

 

デフォルト設定のカラーは薄いブルー色を変更して見ました。

テーマカラーに合う目次カラーを選択して2か所の項目を変えるだけで完了です。

画像でわかりやすくプラグインインインストール手順から目次カラーのカスタマイズをご紹介します。

はじめに

diver目次サンプル-02

diver目次サンプル-02

デフォルト目次サンプル

 

diver目次サンプル-01

diver目次サンプル-01

Table of Contents Plusで作成した目次サンプル

デフォルトの目次カラーはやや穏やかで薄い感じです、このままで良いのですがテーマカラーにあった色に変更して見たいと思います。

 

目次を表示するプラグインTable of Contents Plusをインストールしていない方はサクッとプラグインを導入していきましょう。

 

 

プラグインインストール手順

キーワード検索からの、

プラグインインのインストール手順は全てのプラグインイン対象において同一手順です。

一度理解してしまえば次回からは検索して調べる必要はありません、ゆっくりじっくり手を動かして手順通りに進んでいきましょう。

  1. ワードプレダッシュボード(左側黒い画面)
  2. プラグインイン新規追加
  3. プラグインイン検索
  4. インストールしたいプラグインイン名
  5. インストールから有効にする
  6. 各プラグインイ設定

基本手順3、4、5の手順

6、
プラグインイ設定に関して、
設定なしデフォルトで直ぐに使える場合と設定が必要なプラグインインもあります。
あなたのサイトやブログに適した設定を行ってください。

 

 

1、ダッシュボード

2、プラグインイン

3、新規追加

 

 

 

新規追加を押すと画面が切り替わります。

  1. 1はプラグインインのアップロードですが今回は使用しません、ワードプレ内で検索不可な時やこちらからインストールなど紹介されている場合などにアップローす。
  2. 今回は2番目からです。プラグインイン検索で探したいプラグインイン名を入力してください。Table of Contents Plusを検索
  3. 真ん中の画像にTable of Contents Plu(お使いになりたいプラグインイン)が見つかりました。
  4. 4画像では有効になっていますが、最初はインストールになっています。インストール → 有効 にしてください。

Table of Contents Pluの設定

プラグインインは有効にしましたか?

有効にしてから、ダッシュボードから設定へ

設定の中にTOC+(Table of Contents Pluの略称)があります。

押す

Table of Contents Plu 基本設定

 

メニューバーの基本設定を確認

位置 = 最初の見出しの(デフォルト)でOK

表示条件 = 2から10選択できますが2、3

以下のコンテンツ = postとpage

左画像の設定でOKです。

 

Table of Contents Plu サイトマップ

 

 

メニューバーサイトマップ確認

固定ページリスト表示にチェック

カテゴリリストにチェック

見出し、2にチェック

固定ページのラベル、pages

カテゴリページのラベル,Categorisをチェック

左画像の設定でOKです。

 

 

設定は完了です。

 

TOC+カスタマイズ

目次カスタマイズは簡単で、カスタマイズというより変更って感じです。

2か所カラーを変更するだけで完了します。

 

TOC+基本カラー

 

 

ダッシュボード

diverオプション

少し下にスクロールしてTOC+プラグインDiverがあります。

 

 

 

TOC+基本カラー
diverは色変更の時はカラーピッカーがあるから簡単!外枠色の色変更になります。薄い色の所を押す
1、直接WEBカラーを入力ができます。
2、薄い白丸を移動する事で色変更ができます。
3、基本カラー8色を一度をして赤系・青系で変更もできます

 

 

TOC+文字色

TOC+基本カラーと同様に色変更していきます。

 

TOC+カスタマイズ、サンプル

 

指定カラー:#fffbf4
TOC+文字色:#1e73be
指定カラー:#ef866b
TOC+文字色:#1e73be
指定カラー:#ddb67c
TOC+文字色:#7c4006

 

 

TOC+カスタマイズサンプルして思った事

目次は目立たなくて良いかな、クッキリした配色はいらない。

テーマカラやh2見出しカラーを元に色合いを薄くしていく感じでいいと思います。

テーマカラーを外枠色にして、目次リンクカラーを茶系色にしましたが目立ちますね。

 

リンク色は無理に変更しないで、青い色で認識されている方が多いのでブルー色で良いでしょう。

 

DiverTOC+カスタマイズは2か所のカラー変更で簡単です、目次色を変えてサイトデザインを試して見てください。

 

h2色を基準に色を薄く2カラー変えて完了、30秒で出来るDiverカスタマイズでした。

期間工募集中!
激アツ 情報

期間工最新情報、激アツ
トヨタ期間工が募集再開を始めた!

 

入社祝い金10

 

初回更新手当10

 

経験者手当:最高10

 

年収例425以上可能

 

詳細は別記事で紹介している

 

 

募集、予約面接会場マップ、
他メーカー情報:
当サイトオリジナル

 

 

 

期間工、募集企業名 特典
トヨタ自動社
豊田自動織機 入社祝い金 20
トヨタ自動車九州
スバル 選考参加費 5
ホンダ
日産自動車 入社祝い金合計 :いわき工場 30

追浜工場:入社祝い金5

日産車体 入社祝い金総額 30
日産自動車九州
日産車体九州 入社祝い金等総額 34
オートワークス京都
ダイハツ九州 入社祝い金 10
いすゞ自動車
スズキ
入社祝い金 10
コマツ製作所
シーヴイテック
入社祝い金 15
ジャアトコ
NTN
入社祝い金 20
ブリヂストン
入社祝い金合計 15
住電装プラテック
キャノン
太陽誘電ケミカルテクノロジー
コマツ

 

 

 

おすすめの記事