WordPressの使い方とSNSに依存しない個人のWeb戦略について発信しています

  1. ワードプレス

SELAのグローバルナビの色を変更する方法

この記事では、Wordpress無料テーマ「SELA」のグローバルナビの色を変更する方法をお伝えしていきます。

グローバルナビはこの部分です。

色を変えると雰囲気もガラリと変わります。

入力自体は複雑なことはないので、トライしてみてくださいね。

色の変更は追加CSSから

入力する箇所はこちらから↓

ダッシュボート>外観>カスタマイズ>追加CSS

「追加CSS」をクリックすると入力する画面が開きます。

入力する内容はいくつか色のパターンを紹介しながら、この後、お伝えしていきます。

グレー

「追加CSS」に入力するのは以下の内容です。

.main-navigation{background:#808080; border-bottom:solid 1.5px #ddd;}
.menu-toggle{background:#808080;}

深紅色

.main-navigation{background:#dc143c; border-bottom:solid 1.5px #ddd;}
.menu-toggle{background:#dc143c;}

ネイビー

.main-navigation{background:#00008b; border-bottom:solid 1.5px #ddd;}
.menu-toggle{background:#00008b;}

グリーン

.main-navigation{background:#008000; border-bottom:solid 1.5px #ddd;}
.menu-toggle{background:#008000;}

小麦色

.main-navigation{background:#f5deb3; border-bottom:solid 1.5px #ddd;}
.menu-toggle{background:#f5deb3;}

プラム

.main-navigation{background:#dda0dd; border-bottom:solid 1.5px #ddd;}
.menu-toggle{background:#dda0dd;}

色は、「#●●●●●●」の部分です。

色のコードはこちらのサイトが参考になります。

色の名前とカラーコードが一目でわかるWEB色見本
https://www.colordic.org/

グローバルナビに枠線をつけたい

さらにこだわりたい人のために、グローバルナビに枠線をつける方法も紹介します。

入力する箇所は同じくこちらから↓↓

ダッシュボート>外観>カスタマイズ>追加CSS

囲む場合

before

after

グローバルナビを四角で囲むとき(写真は白線)↓↓

.main-navigation{background:#f6bfbc; border:solid 1.5px #ffffff;}
.menu-toggle{background:#f6bfbc;}

下線のみの場合

下線のみのとき(写真はグレー)

.main-navigation{background:#f6bfbc; border-bottom:solid 1.5px #a9a9a9;}
.menu-toggle{background:#f6bfbc;}

上下に線を引く場合

.main-navigation{background:#f6bfbc; border-top:solid 1.5px #a9a9a9; border-bottom:solid 1.5px #a9a9a9;}.menu-toggle{background:#f6bfbc;}

最後に

見ていただいたように、グローバルナビの色を変えるだけで、サイトの雰囲気も変わります。

あなたのサイトコンセプトに合った色を見つけて、変更してみてくださいね。

ワードプレスの最近記事

  1. 【初心者向け】Googleサーチコンソールの登録方法(ロリポップサーバー)

  2. 画像ソフトを使わずにWordPress画像に枠線を付ける方法

  3. WordPressの表(テーブル)の縦線を表示したい

  4. 見出しの装飾が崩れてうまく表示されない時の対処法

  5. WordPressで起業するメリットは?挫折しない?

スポンサーリンク


スポンサーリンク


メール講座

つぶやき

10/19 パソコンやスマホの向こう側にいる人に、こうやって思ってもらえたらいいなと思いながら企画しているのですが、本当にその言葉がもらえた時のうれしさったら。

10/19 おもしろいって何だろう。
おもしろい!と感じるのは…
意外なことが結びついた時?
今までとは違う景色が見られそうな時?
え、そんなことってある~!?ということが起きる時?
言葉になる前に、気持ちが動くこともおもしろいのひとつかな。

10/19 「おもしろい」の正体は何だろう??

10/18 今日のピックアップ記事↓↓認知の幻想

10/18 「同じ感覚」を持っていないとニーズをくみ取れないけど、「同じ視点」ではダメなんだなぁ。

10/18 モチベーション維持をがんばるのはズレているような…??がんばらないと維持できないとしたら、それは合っていない可能性ありです。

10/17 新メール講座を公開しました。≫ひとり起業メール講座

10/16 12月に挑戦という遊びするためには?・・・今何をしたらいいか見えてきますね。

10/16 12月にアイデアを試したり、普段できないチャレンジをするために、今から「何しようか?」と考えておくのもいいですね。

10/16 今日のピックアップ記事↓↓

10/14 すごい人の話は貴重だけど、そこにたどり着くまでものすごいことを経験しているので、比較的自分に近い人の失敗談を聞いた方が役に立つという。

10/14 自宅にいる時間が長い人は改めてチェックしたいこと↓↓

10/14 何者にもなれないとわかった時がスタート

10/13 疲れたーという日もあるけれど、1日の中で何か良いこともあるので「今日も良い日だった」と思うだけでなく、“口に出して”1日を終えると幸福感増すのでおすすめです。

10/12 ブログを書く人はおさえておきたい話です↓↓

10/10 このタイミングで改めて考えたいオンライン化について。今日のピックアップ記事↓↓

10/07 ひとりでできることは限られているので、パートナーを見つけたり、チームを作った方がいいけど、まずはやっぱりひとりで一通りできる自分になること。未熟過ぎる状態でチームを作っても0.8人前は0.8人前。

10/06 今日のピックアップ記事↓↓

10/4 新コンテンツ投稿↓↓

9/30 今日のピックアップ記事↓↓

9/30 今年もあと3か月!ですが、2か月のつもりで濃密に。

9/29 人の話をしっかり聞くのもとても大事ですが、実行力があることが前提ですね。どうなる?日本

9/28 仮説のための情報は少ないと不利?
答えはNOです。
情報が十分になることはないし、100%情報を集めても100%正解の答えは出ないので。

9/27 今日のピックアップ記事↓↓

9/25 独自性も収益につながってこそですよね。

9/25 考えても仕方ないことを考えてしまう時
気になることを考えるのをやめることはできないから、新たな予定を入れたり、新しいことを始めたりして、自分の意識をそらすのがおすすめ。

9/25 おぉー。
≫docomo 解約金や解約金留保の廃止及び定期契約の新規受付終了

9/23 ガラッと変わる魔法はないけど、ガラッと変える行動は必要ですよね。

9/23 選択と集中の話は、そもそも選択できるほどの選択肢を用意する必要あり。「集中」を都合よく解釈して、やらない理由付けをしていたら意味なしかな。

NEW!コンテンツ

スポンサーリンク




Twitter

PAGE TOP