Lately you might have seen that the search bar on your mobile browser changes color, based on the site your on. Here is a short guide, showing how you can apply this to your own website:
It’s pretty easy to apply this to your own site. All you have to do is add these three meta-tags to your header.php file:
Firefox OS and Opera: <meta name="theme-color" content="#4285f4">Windows Phone: <meta name="msapplication-navbutton-color" content="#4285f4"> iOS Safari: <meta name="apple-mobile-web-app-status-bar-style" content="#4285f4">
- Using a FTP client, like FileZilla or Cyberduck, find your header.php file under WordPress –> wp-content –> Themes –> Your theme.
- Copy the header.php to your desktop and insert the meta-tags in the head section of your document. Insert your own color code, save, upload and replace the old header.php file.
- And thats is! Now all you have to do is visit your site on your phone and check that your color is up! Wooho!