Navigation: Force mobile navigation

If you'd like to force your site to always use the mobile navigation (hamburger menu version), then you can apply this modification. 

How to:

Always make a duplicate of your theme before adding any code. This will save you if anything goes wrong or if you decide not to use the added code in the future. We can not support or be responsible of any code changes that you make to your theme. For that reason, save yourself and make a duplicate first.

Make a duplicate before any code changes:

Step 1 - Modify Javascript code

Use this link to learn which Javascript file to open based on your version of Pipeline:

Which Javascript file to open

Use the Find feature (1) in the right pane where the code is: Command-F on Mac or Control-F in Windows.

Pipeline 4, search for:

theme.detectNav = function

Older versions of Pipeline, search for:

pipeline.detectNav = function

Then find the two lines highlighted below (2):

You will be reversing these classes (only the first section):

Original - Change from:

    $('.site-header, .info-bar').addClass('showDesktop');
    $('.site-header, .info-bar').removeClass('showMobile');

New - Change to:

    $('.site-header, .info-bar').addClass('showMobile');
    $('.site-header, .info-bar').removeClass('showDesktop');

Save the file.


If you need to undo the changes, reverse the steps used above or refer back to your duplicate/backup theme.

Still need help? Contact Us Contact Us