{"id":13506,"date":"2023-05-06T04:20:43","date_gmt":"2023-05-06T08:20:43","guid":{"rendered":"https:\/\/buzapps.net\/info\/?post_type=knowledgebase&#038;p=13506"},"modified":"2023-05-07T09:19:53","modified_gmt":"2023-05-07T13:19:53","slug":"how-do-i-replace-the-page-header-text-with-an-image","status":"publish","type":"knowledgebase","link":"https:\/\/buzapps.net\/info\/knowledgebase\/how-to\/how-do-i-replace-the-page-header-text-with-an-image\/","title":{"rendered":"How do I replace the Page Header text with an image?"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Use the code below if you would like to use an image instead of text for your app&#8217;s Page Headers.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Follow the instructions below to add an image to your App Header.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>1)<\/strong>Create or locate the image that you want to use. The size should be around 640x128px.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2)<\/strong>&nbsp;Log into your App Manager and&nbsp;<strong>select your app<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3)<\/strong>&nbsp;Click&nbsp;<strong>Colors<\/strong>&nbsp;from the left-hand-side of the screen (or the middle of the screen).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>4)<\/strong>\u00a0Scroll down to the\u00a0<strong>Advanced SCSS box<\/strong>.\u00a0If you already have code in the box do not delete it!\u00a0Simply add this code &#8220;below&#8221; the last character of code in the box.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/**\u00a0Begin replace page header text with image*\/\n\n.bar.bar-custom {\n\nbackground-image: url(https:\/\/website_url\/header.jpg);\n\nbackground-color: transparent;\n\nbackground-size: 100% 100%;\n\n}\n\nspan.nav-bar-title.ng-binding {\n\ndisplay: none;\n\n}\n\n\/**\u00a0End replace page header text with image*\/<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>5)<\/strong> Click <strong>Save<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>NOTE:<\/strong>&nbsp;Replace \u201chttps:\/\/website_url\/header.jpg\u201d with your own link.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Use the code below if you would like to use an image instead of text for your app&#8217;s Page Headers. Follow the instructions below to add an image to your App Header. 1)Create or locate the image that you want to use. The size should be around 640x128px. 2)&nbsp;Log into your App Manager and&nbsp;select your app. 3)&nbsp;Click&nbsp;Colors&nbsp;from the left-hand-side of the screen (or the middle of the screen). 4)\u00a0Scroll down to the\u00a0Advanced SCSS box.\u00a0If you already have code in the box do not delete it!\u00a0Simply add this code &#8220;below&#8221; the last character of code in the box. 5) Click Save.<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","knowledgebase_cat":[35],"class_list":["post-13506","knowledgebase","type-knowledgebase","status-publish","hentry","knowledgebase_cat-how-to"],"_links":{"self":[{"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase\/13506","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase"}],"about":[{"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/types\/knowledgebase"}],"author":[{"embeddable":true,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/comments?post=13506"}],"version-history":[{"count":2,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase\/13506\/revisions"}],"predecessor-version":[{"id":14036,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase\/13506\/revisions\/14036"}],"wp:attachment":[{"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/media?parent=13506"}],"wp:term":[{"taxonomy":"knowledgebase_cat","embeddable":true,"href":"https:\/\/buzapps.net\/info\/wp-json\/wp\/v2\/knowledgebase_cat?post=13506"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}