Wix Editor: Customizing the Header and Footer on Your Mobile Site
Customize the header and footer on your mobile site so they look ideal on smaller screens. Adjust the page layout and apply eye catching scroll effects to elevate your visitors mobile site experience. In this article, learn more about: 
Adding or removing the header and footer of your mobile site Resizing the header and footer of your mobile site Changing the scroll effect of the header and footer of your mobile site Frequently asked questions (FAQs)Adding or removing the header and footerAdd or remove the header and footer elements at any time. For regular pages, we recommend keeping your header and footer visible, so visitors can easily explore and navigate your site.To change the page layout on mobile:
Open the mobile editor. Click Menus & Pages  on the left side of the mobile editor. Hover over a page name and click the More Actions icon . Click Mobile Settings. Select a mobile page layout:
    
Standard: Standard pages have a header and a footer. No Header & Footer: Headers, footers, and any elements that are set to "Show on all pages" are not displayed. This layout is suitable for a Coming Soon page, an Under Construction page or a landing page aimed at collecting leads.  Important:
Keep in mind that if you choose a No Header & Footer in the mobile layout, the page does not display the menu in the header. Therefore, if you want your visitors to be able to navigate to the rest of your site, make sure to link a button to your site's main page. Certain apps do not appear on your live site if you have hidden the header and footer. Read more about apps and the No Header & Footer layout. Resizing the header and footer You can resize the header or footer by pulling the stretch handle up or down.To change the size of your header or footer:
Open the mobile editor. Click the header / footer.  Click and drag the stretch handle at the bottom of the header / footer.Changing the scroll effect of the header and footerChoose what happens to your header on your mobile site when your visitors scroll down the page. For example, you can freeze the header so it always appears at the top or have it fade out as visitors scroll down the site. To change the scroll effect: 
Click the header in the mobile editor. Click Change Header Scroll. Select an option:
    
Scrolls with site: The header is always at the top of the site and scrolls with it. Freezes: The header is always at the top of the mobile screen.  Disappears: The header disappears when you scroll down the page, but is at the top of the screen when you scroll upward. Fades out: The header slowly disappears as you scroll down the page. It reappears as you scroll upward.  Important note about the freeze scroll effect:If your header has too much content and is too big on mobile, the freeze scroll effect is disabled on the live mobile site. This is because when set to frozen, the header would cover the entire viewport of the mobile device and hide the rest of the site content as a result.FAQsClick a question below to learn more. How can visitors zoom out on my site on mobile? They can zoom in and out when viewing your site on mobile devices by pinching the screen. Why am I able to see my header, but I cannot select it? Your header element could be hidden behind another element. Use the layers panel to locate and rearrange elements. Can I set different scroll settings for my desktop site? Absolutely. Your mobile and desktop can have different header scroll effects.If I change the layout of my mobile site to "No Header & Footer", will this reflect on my desktop site? Any changes made to your mobile site do not affect your desktop site.