{"id":150,"date":"2016-03-26T23:10:05","date_gmt":"2016-03-26T23:10:05","guid":{"rendered":"http:\/\/roguedzines.com\/blog\/?p=150"},"modified":"2016-03-26T23:10:05","modified_gmt":"2016-03-26T23:10:05","slug":"how-to-change-the-bar-color-for-your-wordpress-site-on-mobile","status":"publish","type":"post","link":"http:\/\/thischickcodes.com\/index.php\/2016\/03\/26\/how-to-change-the-bar-color-for-your-wordpress-site-on-mobile\/","title":{"rendered":"How to change the address bar color for your WordPress site on Mobile"},"content":{"rendered":"<p>I recently gave my site a nifty update by updating the color of the address bar in Chrome on mobile, thought I would share. This currently <strong>works only on Android<\/strong> devices using Chrome (Lollipop or newer versions)<\/p>\n<p>Open up your themes functions file, or you can just pop this code in your header.php file. I am a big fan of keep all functions in the<strong> functions.php<\/strong> file<\/p>\n<p>Create the name I will use a <em>function<\/em>\u00a0named\u00a0android_meta for this tutorial. Copy and paste theto your functions file or header.php file. Change the <strong>content=<\/strong> to the color of your choice.<\/p>\n<p>Don&#8217;t forget to use wordpress function add_action to add the meta tags to the head of the document if you are inserting this in the functions.php file. You should see the color of the bar in Chrome with the new one you selected.<\/p>\n<pre><code class=\"php\">\nfunction android_meta(){ ?&gt;\n &lt;meta name=\"theme-color\" content=\"#F171AB\"&gt;\n\n&lt;? }\n\nadd_action('wp_head','android_meta');\n<\/code><\/pre>\n<p>Here is a screenshot of how Roguedzines.com looks<\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter wp-image-155 size-large\" src=\"http:\/\/thischickcodes.com\/wp-content\/uploads\/2016\/03\/Screenshot_20160326-191454-576x1024.png\" alt=\"\" width=\"576\" height=\"1024\" srcset=\"http:\/\/thischickcodes.com\/wp-content\/uploads\/2016\/03\/Screenshot_20160326-191454-576x1024.png 576w, http:\/\/thischickcodes.com\/wp-content\/uploads\/2016\/03\/Screenshot_20160326-191454-169x300.png 169w, http:\/\/thischickcodes.com\/wp-content\/uploads\/2016\/03\/Screenshot_20160326-191454-768x1365.png 768w, http:\/\/thischickcodes.com\/wp-content\/uploads\/2016\/03\/Screenshot_20160326-191454.png 1440w\" sizes=\"(max-width: 576px) 100vw, 576px\" \/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>I recently gave my site a nifty update by updating the color of the address bar in Chrome on mobile, thought I would share. This currently works only on Android devices using Chrome (Lollipop or newer versions) Open up your themes functions file, or you can just pop this code in your header.php file. I [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[4,11],"tags":[16,28],"_links":{"self":[{"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/posts\/150"}],"collection":[{"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/comments?post=150"}],"version-history":[{"count":0,"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/posts\/150\/revisions"}],"wp:attachment":[{"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/media?parent=150"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/categories?post=150"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/thischickcodes.com\/index.php\/wp-json\/wp\/v2\/tags?post=150"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}