{"id":48,"date":"2020-05-03T22:33:59","date_gmt":"2020-05-03T22:33:59","guid":{"rendered":"https:\/\/help.birthingyourbrand.com\/?post_type=docs&p=48"},"modified":"2020-05-03T22:34:01","modified_gmt":"2020-05-03T22:34:01","slug":"shrinking-header-on-scroll","status":"publish","type":"docs","link":"https:\/\/help.birthingyourbrand.com\/docs\/shrinking-header-on-scroll\/","title":{"rendered":"Shrinking Header on Scroll"},"content":{"rendered":"\n

1. Build your header using the Header Builder.<\/p>\n\n\n\n

2. Recreate your header on the second builder row. (You can create\na totally different header if you want.)<\/p>\n\n\n\n

3. Open the header’s first row’s settings by clicking on the\nlittle wheel that appears once you hover with your mouse over the row.<\/p>\n\n\n\n

4. In the Style tab<\/strong>, update the Row height<\/strong> control\nto 200 px, or whatever value you feel is consistent with your design.<\/p>\n\n\n\n

P.S Here is where you can also change the Skin Mode ( light or\ndark ) or choose a different background color for the row.<\/p>\n\n\n\n

5. Like before, open the header’s second row’s settings by clicking\non the little wheel that appears once you hover with your mouse over the\nrow. <\/p>\n\n\n\n

In the Layout tab, you need to check the Stick to top<\/strong> and Show\nonly on scroll<\/strong> options.<\/p>\n\n\n\n

P.S In the Style tab is where you can also change the Skin Mode (\nlight or dark ) or choose a different background color for the row.<\/p>\n\n\n\n

6. Save the options, scroll and enjoy your new shrinking header.<\/p>\n","protected":false},"excerpt":{"rendered":"

1. Build your header using the Header Builder. 2. Recreate your header on the second builder row. (You can create a totally different header if you want.) 3. Open the header’s first row’s settings by clicking on the little wheel that appears once you hover with your mouse over the row. 4. In the Style tab, update… Read More »Shrinking Header on Scroll<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"qubely_global_settings":"","qubely_interactions":"","_seopress_robots_primary_cat":"","_seopress_titles_title":"","_seopress_titles_desc":"","_seopress_robots_index":"","neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":""},"doc_category":[3],"doc_tag":[],"qubely_featured_image_url":null,"qubely_author":{"display_name":"Brian","author_link":"https:\/\/help.birthingyourbrand.com\/author\/bdragutsgmail-com\/"},"qubely_comment":7,"qubely_category":" Global Appearance<\/a>","qubely_excerpt":"1. Build your header using the Header Builder. 2. Recreate your header on the second builder row. (You can create a totally different header if you want.) 3. Open the header’s first row’s settings by clicking on the little wheel that appears once you hover with your mouse over the row. 4. In the Style tab, update… Read…","_links":{"self":[{"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/docs\/48"}],"collection":[{"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/comments?post=48"}],"version-history":[{"count":0,"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/docs\/48\/revisions"}],"wp:attachment":[{"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/media?parent=48"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/doc_category?post=48"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/help.birthingyourbrand.com\/wp-json\/wp\/v2\/doc_tag?post=48"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}