{"id":42,"date":"2024-10-04T10:22:41","date_gmt":"2024-10-04T10:22:41","guid":{"rendered":"https:\/\/docs.codevibrant.com\/yaatra-blog\/?p=42"},"modified":"2024-10-04T10:22:41","modified_gmt":"2024-10-04T10:22:41","slug":"add-header-images-in-your-site","status":"publish","type":"post","link":"https:\/\/docs.codevibrant.com\/yaatra-blog\/add-header-images-in-your-site\/","title":{"rendered":"Add Header Images in your site"},"content":{"rendered":"\n<p>Header Images are the images that appears in your header section. They are essential for you to set tone for your entire site as they are the first element your user encounter. They are also necessary for brand&#8217;s identity and visual appeal.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"514\" src=\"http:\/\/docs.codevibrant.com\/yaatra-blog\/wp-content\/uploads\/sites\/5\/2024\/10\/Header-Image_Customizer-1024x514.jpg\" alt=\"Header Image_Customizer\" class=\"wp-image-43\" srcset=\"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-content\/uploads\/sites\/5\/2024\/10\/Header-Image_Customizer-1024x514.jpg 1024w, https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-content\/uploads\/sites\/5\/2024\/10\/Header-Image_Customizer-300x151.jpg 300w, https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-content\/uploads\/sites\/5\/2024\/10\/Header-Image_Customizer-768x385.jpg 768w, https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-content\/uploads\/sites\/5\/2024\/10\/Header-Image_Customizer.jpg 1200w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>The above image showcases how your header section would appear when add image to it. <\/p>\n\n\n\n<p>To do so,<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Go to your WordPress Dashboard and head to <strong>Appearance > Customize<\/strong><\/li>\n\n\n\n<li>In your customizer, go to <strong>Header Settings<\/strong> and then to Innerpages Header Images<\/li>\n\n\n\n<li>Add your header image with dimensions <strong>1000X250<\/strong> for perfect placement.<\/li>\n\n\n\n<li>Click <strong>Publish<\/strong> button to save your changes<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Header Images are the images that appears in your header section. They are essential for you to set tone for your entire site as they are the first element your user encounter. They are also necessary for brand&#8217;s identity and visual appeal. The above image showcases how your header section would appear when add image [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-42","post","type-post","status-publish","format-standard","hentry","category-header-settings"],"_links":{"self":[{"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/posts\/42","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/comments?post=42"}],"version-history":[{"count":1,"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/posts\/42\/revisions"}],"predecessor-version":[{"id":44,"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/posts\/42\/revisions\/44"}],"wp:attachment":[{"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/media?parent=42"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/categories?post=42"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/docs.codevibrant.com\/yaatra-blog\/wp-json\/wp\/v2\/tags?post=42"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}