【お知らせ】このサイトではWordPressテーマ Cocoonを採用しています。THE THORのカスタマイズ状況についてはZMASAa.blogをご参照下さい。
WordPress関連THE THOR

【THE THOR】ウィジェット セレクトのカスタマイズ

アイキャッチ画像 THE THOR(ザ・トール)
この記事は約2分で読めます。
スポンサーリンク

WordPressテーマ THE THOR(ザ・トール)

別ブログのZMASAa.blogは、WordPressテーマ THE THOR(ザ・トール)を使って構築しています。

ZMASAa.blog│ガジェット好きのmasaaが情報発信する2nd WordPressブログサイト
ガジェット好きのmasaaが情報発信する2nd WordPressブログサイト

今回は、WordPressテーマ THE THOR(ザ・トール)での「ウィジェット セレクト」のカスタマイズについてまとめてみました。

WordPressテーマ THE THOR(ザ・トール) ウィジェット セレクト

現在の「ウィジェット セレクト」デザインは下記の通りです。

【THE THOR】ウィジェット セレクトのカスタマイズ

サイトカラーに合っていないグレーのカラーが採用されているので、サイトカラーに合わせて変更するカスタマイズを行ってみたいと思います。

ウィジェット セレクトのカスタマイズ

「ウィジェット セレクト」のカラー変更のカスタマイズを行います。

カスタマイズ内容

「ウィジェット セレクト」のカスタマイズの内容は、下記の通りです。

「スタイルシート(style-user.css)」を開き、今回のカスタマイズ内容を追記します。

/************************************
** ■ウィジェット セレクトカスタマイズ
************************************/
.widget select {
    border: 2px solid #ffddee;
    width: 100%;
    padding: 10px;
    border-radius: 0;
}

カスタマイズ後のウィジェット セレクト

今回のカスタマイズによって、「ウィジェット セレクト」は次のようになりました。

【THE THOR】ウィジェット セレクトのカスタマイズ

「ウィジェット セレクト」のカラー構成をサイトカラーに合わせて変更しました。

最後に

サイトカラーにあった「ウィジェット セレクト」になったことで、サイト全体の一体感が出てきました。

MASAa.netをご覧頂きありがとうございます!
もしMASAa.netの記事がお役に立てた場合、
下記【サポート】を頂くことで今後の記事制作に繋ぎます!

おすすめWordPressテーマ!
WordPressテーマ WING(AFFINGER6)
WordPressテーマ THE THOR(ザ・トール)
WordPressテーマ Diver

下記バナーからスマホゲームのインストールお願いします!
ザ・グランドマフィア
イース6 オンライン〜ナピシュテムの匣〜
リネージュ2M
魔剣伝説
超次元彼女
ライフアフター
グランドサマナーズ
ロードモバイル
駅メモ!-ステーションメモリーズ!

MASAa.net

コメント