diver目次のカラー変更
diver目次のカラー変更

画像付きで解説、ワードプレステーマ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カスタマイズでした。

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

追浜工場:入社祝い金5

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

 

 

 

期間工募集中!
あなたの 安心安全安定 はここから、はじまる

 

SUBARU
スバル期間工募集中!
選考会参加、5万円!

【株式会社SUBARU(旧富士重工業株式会社)】
勤務地群馬県太田市周辺
月収例29.5万円から31.8万円

スバルの魅力はこちらから

 

 

TOYOTA
トヨタ期間工募集!

満了慰労金・報奨金合わせて最大300万円!

 

トヨタ自動車株式会社
勤務地愛知県内などの各工場
月収例28.1万円から30.3万円

業界最高基準のトヨタ期間工!

 

 

期間工のお仕事情報

 

 

トヨタ自動車九州株式会社入社特典合計10万円
勤務地福岡県宮若市上有木|JR鹿児島本線 赤間駅
月収例27.07万円~

 

日産自動車株式会社
勤務地【追浜工場】 所在地:神奈川県横須賀市夏島町 最寄駅:京浜急行 追浜駅
月収例28.6万円~

 

日産自動車株式会社
勤務地いわき工場所在地:福島県いわき市泉町下川
※車での通勤可能者に限る
月収例27.7万円~

 

 

おすすめの記事