Im trying to use symbols by just dragging and dropping the symbol “nav” on to each page so it looks good on mobile… it does not seem to be working…
I also noticed I need to update my logo on the mobile versions as it goes to the template one at the moment… is there a way I can use symbols to do that as well for the mobile version? see the read only link
Symbol is basically “chunk” of HTML code. By creating/using symbol you just copy/paste this chunk to another part of the site (page, section, etc)
If you didn’t styled correctly navbar for mobile view before creating the symbol, it will not look correctly on that place where you paste it. And if you will go inside the symbol (double click on mouse) and edit navbar style as you want it to look, it will automatically update look on every place where you paste this particular symbol.
You do not need to create separate symbols for desktop and mobile versions. Except situations when mobile and desktop versions contain different elements.
It was setup like that in the template… so whatever we need to do to make the nav show exactly as I have it except as a hamburger button drop down on mobile would be great…
There is overlay div, which appear only when menu is opened. That div is part of navigation widget and it is creating automatically. It has height=100% of device and overflow = hidden, that’s why menu keep “cutting”. I can’t figure out how to control this
The menu is indeed too long. Try using less links. Also, when a user is scroll down, having a cut off logo is fine because users are more focused on finding the information they need, than always being reminded which website they are on.