You can make the sticky header to appear when scrolling down on desktop resolution, and also to show on mobile resolution, following the steps below.

Step 1: Disable the Header/Sticky Header header option in the Customizer. 

Step 2: Once you've done that, add the following to Customize/Additional CSS:

.fixed-header-box {
    position: -webkit-sticky;
    position: sticky;
    top: 0;

.admin-bar .fixed-header-box {
    top: 32px;

@media screen and (max-width: 782px) {
    .admin-bar .fixed-header-box {
        top: 46px;

You can check this guide for more details on how to How to add custom CSS / PHP code or modify the theme code

Support for this feature is limited to the green and yellow browsers show here:

Please note!

If you need to use a sticky mobile header - please keep the number of menu items low, so that users can see the full list of items.