AndroidのChromeブラウザでタブの色を変える方法
AndroidのChromeブラウザで、タブの色を変える方法をご紹介いたします。
これは非常に簡単。metaタグのtheme-colorに以下のように記述するだけ。
|
1 |
<span class="synIdentifier"><</span><span class="synStatement">meta</span> <span class="synType">name</span><span class="synIdentifier">=</span><span class="synConstant">"theme-color"</span> <span class="synType">content</span><span class="synIdentifier">=</span><span class="synConstant">"<span style="color: #ff0000;">#123456</span>"></span> |
「#123456」とした箇所を好きな色を16進数の色コードで指定すればOK。
現時点で対応しているブラウザは、Androidの5.0以降のChromeブラウザのみ。
早速実験してみました。今回指定した色は「#a52106」。赤っぽい色といえばよいでしょうか。
wordpressの管理画面では以下のように操作します。
「外観」→「テーマの編集」で画面を表示し、編集するファイル、今回の場合は「テーマヘッダー（header.php）」を選択。
画面が表示されるので、前述したコードを入力します。以下の赤で囲った箇所が今回追加したコードです。
確認すると、以下のようになりました。タブの色が指定した色に変わっていることが確認できます。
複数のタブを開いている場合などに、サイトが目立ってわかりやすいのかなと思います。
簡単に実装できるのでぜひ試してみてください。
