{"id":14699,"date":"2019-10-22T10:18:12","date_gmt":"2019-10-22T10:18:12","guid":{"rendered":"https:\/\/ampforwp.com\/tutorials\/?post_type=ht_kb&#038;p=14699"},"modified":"2020-03-02T09:44:57","modified_gmt":"2020-03-02T09:44:57","slug":"how-to-change-the-border-color-of-the-header","status":"publish","type":"ht_kb","link":"https:\/\/ampforwp.com\/tutorials\/article\/how-to-change-the-border-color-of-the-header\/","title":{"rendered":"How to change the border color of the Header"},"content":{"rendered":"\n<p>In this tutorial, I&#8217;ll show you how to change the border color of the Header for this follow the below steps.<\/p>\n\n\n\n<ul><li>You will find this option in the <strong>WordPress Dashboard<\/strong> -&gt; Navigate to <strong>AMP Option Panel <\/strong>-&gt; <strong>Header <\/strong>-&gt; Enable <strong>Advanced Header Design<\/strong> option like below the screenshot.<\/li><\/ul>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" loading=\"lazy\" width=\"396\" height=\"341\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/7-1.png\" alt=\"\" class=\"wp-image-14702\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/7-1.png 396w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/7-1-300x258.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/7-1-50x43.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/7-1-60x52.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/7-1-100x86.png 100w\" sizes=\"(max-width: 396px) 100vw, 396px\" \/><\/figure><\/div>\n\n\n\n<p>Scroll down a little to see this option<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"918\" height=\"623\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/10.png\" alt=\"\" class=\"wp-image-14706\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/10.png 918w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/10-300x204.png 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/10-768x521.png 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/10-50x34.png 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/10-60x41.png 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/10-100x68.png 100w\" sizes=\"(max-width: 918px) 100vw, 918px\" \/><\/figure>\n\n\n\n<ul><li><strong>Advanced Header Design:&nbsp;<\/strong>By enabling this option you can customize the  Border and Boxshadow, Border width, Border Color, and Box Shadow, etc.<\/li><\/ul>\n\n\n\n<h4>The Output of the border color of the Header<\/h4>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"1024\" src=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4-1024x1024.jpg\" alt=\"\" class=\"wp-image-14705\" srcset=\"https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4-1024x1024.jpg 1024w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4-150x150.jpg 150w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4-300x300.jpg 300w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4-768x768.jpg 768w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4-50x50.jpg 50w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4-60x60.jpg 60w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4-100x100.jpg 100w, https:\/\/ampforwp.com\/tutorials\/wp-content\/uploads\/2019\/10\/FotoJet-4.jpg 1200w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p><strong>That\u2019s it for this tutorial!!<\/strong><\/p>\n\n\n\n<p>We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.<\/p>\n<div id=\"div-1\" class=\"hkb-feedback\">\n\t\t\t<strong class=\"ht-mobile-exit__title\">Ask your Questions Directly!<\/strong><br>\n\t\t\t<div class=\"hkb_widget_exit__content\" style=\"font-size: 14px;\">If you can't find the solutions in this article, then just ask us in the comments and we will answer it for you!<\/div>\n\t\t\t<a href=\"https:\/\/ampforwp.com\/support\/#contact\" id=\"button\" target=\"_blank\" rel=\"noopener noreferrer\"><button>Yes, I have a Question<\/button><\/a>\n\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>In this tutorial, I&#8217;ll show you how to change the border color of the Header for this follow the below steps. You will find this option in the WordPress Dashboard -&gt; Navigate to AMP Option Panel -&gt; Header -&gt; Enable Advanced Header Design option like below the screenshot. Scroll down&#8230;<\/p>\n","protected":false},"author":18,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":[],"ht-kb-category":[34],"ht-kb-tag":[],"_links":{"self":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/14699"}],"collection":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/comments?post=14699"}],"version-history":[{"count":11,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/14699\/revisions"}],"predecessor-version":[{"id":16688,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb\/14699\/revisions\/16688"}],"wp:attachment":[{"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/media?parent=14699"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-category?post=14699"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/ampforwp.com\/tutorials\/wp-json\/wp\/v2\/ht-kb-tag?post=14699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}