2 Accepted solutions
Accepted Solutions
Hi @WhiteRabit ,
for the desktop version - have you tried
.header-menu{
position:absolute;
right:50px
}
?
How did you do the sub menu? I can't see any indication for sub navigation links in the source code. Can you post a screenshot of how the advanced menu looks like?
Also it seems that there is a issue with the mobile navigation.
Do you use a free template or did you wrote it by yourself?
If you wrote it by yourself(or if it's somehow missing in the template) here's a helpful link How to implement a mobile navigation to your site
regards,
Anton
 | Did my post help answer your query? Help the Community by marking it as a solution |
Hi @WhiteRabit,
sure. Or maybe you've deleted the "add the file/script to <head>" hubl 
First:
- open your blog template in the design manager
- look on the right sidebar inside the "additional <head>" area. Is it empty? If yes:
- search in the left sidebar for mobile-menu-min.js
- once found, open it and click on options(in the top area of the left sidebar) and copy the public url
- go back to your blog template and write this code inside the "additional <head>" area
<script src="PASTE-THE-URL-HERE"></script>
- save the template
- open your blog and test it
- does this work? If yes:
- cut the code from the "additional <head>" area and insert it inside the footer group(within a rich-text module or better with a HTML-module which can be found in the marketplace for free)
If this won't work you shouldwalk trough the tutorial I've posted in the first answer. But: The tutorial was done with the old design manager which looked a bit different. But the necessary things are still the same
regards
Anton
| Did my post help answer your query? Help the Community by marking it as a solution |
Hi @WhiteRabit ,
for the desktop version - have you tried
.header-menu{
position:absolute;
right:50px
}
?
How did you do the sub menu? I can't see any indication for sub navigation links in the source code. Can you post a screenshot of how the advanced menu looks like?
Also it seems that there is a issue with the mobile navigation.
Do you use a free template or did you wrote it by yourself?
If you wrote it by yourself(or if it's somehow missing in the template) here's a helpful link How to implement a mobile navigation to your site
regards,
Anton
| Did my post help answer your query? Help the Community by marking it as a solution |
Hi @Anton
That code worked thank you it has shiffed the nav into the correct place thank you so much.
I set up the sub menu in HubSpot (see attached image)
I think the template is a free one as it was in my system automatically I have gone in and tweaked it. I have not looked at mobile yet.
Thanks so much for your help
Gem
Hi @WhiteRabit,
glad to hear that it worked
'...I think the template is a free one as it was in my system automatically I have gone in and tweaked it....'
I've took a look at your <head>. Your're using the "Sphere One" Template. You can find it here:
https://app.hubspot.com/marketplace/XXX/products/thebrandmanager-au-1/sphere-one
(replace the XXX with your HubID - otherwhise the link won't work).
The menu module must have following class:
custom-menu-primary
It's(in your case) the most important class in the header group. With this class you have the dropdown and mobile functionality(you can find all the settings in "mobile-menu.min.js" file)
Furthermore a tip: Don't try to rewrite template parts by yourself if you don't know what is what and what has dependencies to what
It's always easier to change the existing styling which were made by the template maker by inspecting them - search for the class/ID in the CSS and edit it.
Another tip: duolicate the vanilla files before editing them. By that you have to switch between the "original" and "your" version with ease.
regards
Anton
| Did my post help answer your query? Help the Community by marking it as a solution |
Hi @WhiteRabit,
sure. Or maybe you've deleted the "add the file/script to <head>" hubl
First:
- open your blog template in the design manager
- look on the right sidebar inside the "additional <head>" area. Is it empty? If yes:
- search in the left sidebar for mobile-menu-min.js
- once found, open it and click on options(in the top area of the left sidebar) and copy the public url
- go back to your blog template and write this code inside the "additional <head>" area
<script src="PASTE-THE-URL-HERE"></script>
- save the template
- open your blog and test it
- does this work? If yes:
- cut the code from the "additional <head>" area and insert it inside the footer group(within a rich-text module or better with a HTML-module which can be found in the marketplace for free)
If this won't work you shouldwalk trough the tutorial I've posted in the first answer. But: The tutorial was done with the old design manager which looked a bit different. But the necessary things are still the same
regards
Anton
| Did my post help answer your query? Help the Community by marking it as a solution |