SANGOのヘッダーの影を消す方法

WordPressテーマ『SANGO』では、初期設定でヘッダー(画面上部のタイトルバー)に影がついています。

この影があるとサイトを見る人に柔らかい印象を与えることができますが、場合によってはサイトのカラー(内容)にそぐわないこともあります。

この影は、カスタマイズ画面では消すことができませんが、CSSを追加することで非表示にすることができます。

今回は、このヘッダーの影をCSSで非表示にする方法を紹介します。

WordPressテーマ『さんご』のヘッダー下部にある影を非表示にする方法

WordPressの操作なので、使用環境が操作を左右することはありませんが、念のためこちらの操作環境を掲載しておきます。

操作開始

WordPressのカスタマイズを開きます。

WordPressのカスタマイズを開く方法はいくつかあります。

[追加CSS]を開きます。

カスタマイズ画面のサイドバーから[追加CSS]をクリックします。
[excel-fighter]SANGOのヘッダーの影を消す方法

[追加CSS]画面の入力枠を表示します。

[追加CSS]画面が表示されたら、下部にスクロールするとCSSを入力する枠があらわれます。
[excel-fighter]SANGOのヘッダーの影を消す方法

ヘッダーの影を消すCSSコードを貼り付けます。

以下のCSSコードをコピーし、入力枠内に貼り付けてください。

.header {
box-shadow: 0 0px 0px rgba(0, 0, 0, 0);
}

コードを貼り付けると、ヘッダーの影が消えます。
[excel-fighter]SANGOのヘッダーの影を消す方法

保存してカスタマイズ画面を閉じます。

画面上の[公開]ボタンをクリックします。このボタンが[公開済み]になったら左側の[×]ボタンをクリックします。
[excel-fighter]SANGOのヘッダーの影を消す方法

最後にプレビュー画面でヘッダーの影が消えたことを確認しましょう。
[excel-fighter]SANGOのヘッダーの影を消す方法

操作完了！

この記事のポイント

いかがでしょうか、ご希望の結果になりましたか？

はっきり言って、ヘッダーの影があろうとなかろうとSEO的に微塵たりとも影響はありません。

でも、長年付き合うブログであれば、自分の好みのブログに仕上げたいと思う人も多いはずです。

ブログをカスタマイズすることで、モチベーションがあがるなら是非やるべき！

ブログのカスタマイズが終わったら、自分色に染めたブログを多くの人に見てもらうためにも、記事執筆に時間を費やしましょう！

最後までお付き合いいただきありがとうございました！SANGOカスタマイズのご相談は下部のコメント欄からお気軽にご質問ください♪