Jump to content


Photo
- - - - -

Change responsive trigger width of NavBar


Best Answer Danny , 29 March 2013 - 01:04 PM

HI,

 

Yes, what you will need to do is use @media queries. The simplest way for you to get the correct code is for you to open up the style.less file in:

 

wp-content/themes/pagelines/sections/navbar

 

Then find all the @media queries, copy these into your custom CSS and change the min-width from 767px to 1000px. Do not edit the style.less in the navbar folder, as these changes will be replaced when an update is available.

Go to the full post


  • Please log in to reply
7 replies to this topic

#1 festoon

festoon

    Member

  • Members

  • 17 posts
  • Country: Country Flag

Posted 29 March 2013 - 12:45 PM

I'm using the section 'NavBar'. Is there anyway to force the nav to switch to mobile format at 900px rather than 767px?



#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 17124 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 29 March 2013 - 01:04 PM   Best Answer

HI,

 

Yes, what you will need to do is use @media queries. The simplest way for you to get the correct code is for you to open up the style.less file in:

 

wp-content/themes/pagelines/sections/navbar

 

Then find all the @media queries, copy these into your custom CSS and change the min-width from 767px to 1000px. Do not edit the style.less in the navbar folder, as these changes will be replaced when an update is available.



#3 festoon

festoon

    Member

  • Members

  • 17 posts
  • Country: Country Flag

Posted 29 March 2013 - 01:15 PM

Thanks heaps Danny. That worked a treat!



#4 Danny

Danny

    Is Awesome!

  • Moderators
  • 17124 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 29 March 2013 - 01:18 PM

No problem!



#5 tindel

tindel

    Member

  • Members
  • 21 posts
  • Country: Country Flag

Posted 27 April 2013 - 03:38 AM

does this work for fixed nav as well.  want to trigger mobile menu on ipad and phone, but keep "desktop" site on both. (not mobile sitenot getting any change.  johntindel.com



#6 James B

James B

    Advocate

  • Members

  • 5126 posts
  • LocationSurrey - UK
  • Country: Country Flag

Posted 27 April 2013 - 04:08 AM

Hi there, yes this method will also work for the fixed nav by editing the @media queries inside the navbar folder you've copied over.



#7 lexlex88

lexlex88

    Member

  • Members

  • 17 posts
  • Country: Country Flag

Posted 27 November 2013 - 02:08 AM

I'm having difficulty resolving this same issue in the latest release of DMS. There is nothing referencing a min-width of 767px.



#8 Danny

Danny

    Is Awesome!

  • Moderators
  • 17124 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 27 November 2013 - 01:54 PM

Hi,

 

In the style.less file change the resPortraitTablet variable, to your preferred width. It is now using one of the PL variables for mobile devices.