Jump to content

How do I change the menu navigation links for mobile devices?

Recommended Posts

Site URL: https://www.reawakenproductions.com/

I would like to customize my site so that some pages display differently on mobile than on pc. The best way I have found to do this is to create 2 versions of my pages.

This seems to work well, except I am not sure how to get the nav bar at the top of the page to display different links depending upon the screen size.

I would like to change the links specifically for the 'About Us' and 'View Films' sections so that they link to different pages on mobile.

Link to comment
  • 2 weeks later...
  • Replies 5
  • Views 1.7k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

  • 1 year later...
  • 1 year later...

Hello, @tuanphan! I know this is an ancient thread, but I'm having the same issue.

Site URL: https://chamdoctor-jp.com/
I want a URL of the link menu in the navigation to change to a different URL only on mobile devices.

As is : 
Link of Navigation menu (症例写真) : 
http://www.chamdoctor.com/re/sub09/sub09_02.html > on PC
http://www.chamdoctor.com/re/sub09/sub09_02.html > on mobile

To be : 
Link of Navigation menu (症例写真) : 
http://www.chamdoctor.com/re/sub09/sub09_02.html > on PC
http://m.chamdoctor.com/sub04/sub04_03.html > on mobile

Link to comment

To redirect to new page on mobile, you can add this code to Page Header Code Injection

<script type="text/javascript">
if (screen.width <= 767) {
document.location = "https://google.com";
}
</script>

replace google with new url

image.thumb.png.80d583ea0359d96f0b2a649debef862b.png

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.