Desktop Page Menu Stopped Working
SOLVE
1 Accepted solution
Desktop Page Menu Stopped Working
SOLVEHey @PAubrey4,
it seems like you're using the Elevate theme.
I'm assuming that as it's a theme provided by HubSpot, they may have pushed an update to a file which is causing the error.
Also - it's the newest theme from HubSpot and is written in a different way than all previous themes and comes with a few - imo - major downsides for non-developers.
Most important downside(imo): You can't find and access it via the Design-Manager as it's created with so-called HubSpot Projects.
The only way to modify it is to enable the CRM development beta, set up local development(install node, VSCode, VSCode HubSpot plugin and a few other things), fetch the elevate source code from GitHub and go from there.
As a developer I cannot understand who thought that such a setup and basically locking out non-devs was a good idea... But here we are.
But don't panic - there are a few solutions:
1. Create a child-theme from elevate
- Open the Design-Manager(left sidebar -> Content -> Design Manager)
- Create a new theme
- Select "Blank theme" as starting point
- Add a name of the theme. Can be anything you like. The only thing I'm recommending is to either write the name in one word or replacing "spaces" with "-" or "_".
- Once the theme was created, open the theme.json file and add
"extends" : "@hubspot/elevate",to it like this:
- Save the file
- Congratulations, you've created your child-theme! 🥳
- Now you have to open every page and select the child-theme as your "template"
(click "Set as active theme" on the card with your child-themes name) -
Select the same template as you've used when initially creating the page
-
Preview the page if everything is fine
-
Save/Update/Publish the page
-
Done
This gives you the ability to modify every aspect of everything of the theme in the future.
2. Download a different theme from the marketplace
You don't have to use Elevate at all - HubSpot has a vast variety of amazing themes in the marketplace. Free and paid ones. Completely up to you. From my expereince more expensive themes are better developed but there are amazing free ones out there.
Two things I'd recommend: Look for a theme that meet's about 80% your criteria(functionality wise - not just look&feel) and buy/download it. The other 20% can be implemented with custom development.
As for every HubSpot or Marketplace theme, I highly recommend to create a child-theme of the chosen theme before using. The good thing: As bought/downloaded themes appear in the design-manager, you can simply right-click it and select "create child-theme".
3. Go full custom
Imo THE way to go, but it can be quite expesive and time consuming creating a full custom theme, on the other hand it can be tailored to your exact needs and provide a unique building experience for you.
Now that I've provided a bit of background information, that should help you in the future, let's dive into the situation you're facing.
Unlike @GiantFocal result, the CORS errors are not present in my test. Also CORS errors are not really responsible for misbehaving jumpmark navigations. Especially since the mobile version is working.
What I'm encountering are a few errors in the react-combined.mjs file(JavaScript). This file is part of the Elevate theme. So there are two things I could think of:
- HubSpot pushed an update to Elevate and this causes the error - unlikely but still possible (to prevent this - child-themes are the way to go 😉 )
- You might have changed something that results in this error
Also - since it's a onepager, check your "home" for the "Content slug" in the page settings. It should be empty.
Last but not least - if you need dev support, feel free to book a meeting by clicking on my signature. Will be happy to help
best,
Anton
Desktop Page Menu Stopped Working
SOLVEHey @PAubrey4,
it seems like you're using the Elevate theme.
I'm assuming that as it's a theme provided by HubSpot, they may have pushed an update to a file which is causing the error.
Also - it's the newest theme from HubSpot and is written in a different way than all previous themes and comes with a few - imo - major downsides for non-developers.
Most important downside(imo): You can't find and access it via the Design-Manager as it's created with so-called HubSpot Projects.
The only way to modify it is to enable the CRM development beta, set up local development(install node, VSCode, VSCode HubSpot plugin and a few other things), fetch the elevate source code from GitHub and go from there.
As a developer I cannot understand who thought that such a setup and basically locking out non-devs was a good idea... But here we are.
But don't panic - there are a few solutions:
1. Create a child-theme from elevate
- Open the Design-Manager(left sidebar -> Content -> Design Manager)
- Create a new theme
- Select "Blank theme" as starting point
- Add a name of the theme. Can be anything you like. The only thing I'm recommending is to either write the name in one word or replacing "spaces" with "-" or "_".
- Once the theme was created, open the theme.json file and add
"extends" : "@hubspot/elevate",to it like this:
- Save the file
- Congratulations, you've created your child-theme! 🥳
- Now you have to open every page and select the child-theme as your "template"
(click "Set as active theme" on the card with your child-themes name) -
Select the same template as you've used when initially creating the page
-
Preview the page if everything is fine
-
Save/Update/Publish the page
-
Done
This gives you the ability to modify every aspect of everything of the theme in the future.
2. Download a different theme from the marketplace
You don't have to use Elevate at all - HubSpot has a vast variety of amazing themes in the marketplace. Free and paid ones. Completely up to you. From my expereince more expensive themes are better developed but there are amazing free ones out there.
Two things I'd recommend: Look for a theme that meet's about 80% your criteria(functionality wise - not just look&feel) and buy/download it. The other 20% can be implemented with custom development.
As for every HubSpot or Marketplace theme, I highly recommend to create a child-theme of the chosen theme before using. The good thing: As bought/downloaded themes appear in the design-manager, you can simply right-click it and select "create child-theme".
3. Go full custom
Imo THE way to go, but it can be quite expesive and time consuming creating a full custom theme, on the other hand it can be tailored to your exact needs and provide a unique building experience for you.
Now that I've provided a bit of background information, that should help you in the future, let's dive into the situation you're facing.
Unlike @GiantFocal result, the CORS errors are not present in my test. Also CORS errors are not really responsible for misbehaving jumpmark navigations. Especially since the mobile version is working.
What I'm encountering are a few errors in the react-combined.mjs file(JavaScript). This file is part of the Elevate theme. So there are two things I could think of:
- HubSpot pushed an update to Elevate and this causes the error - unlikely but still possible (to prevent this - child-themes are the way to go 😉 )
- You might have changed something that results in this error
Also - since it's a onepager, check your "home" for the "Content slug" in the page settings. It should be empty.
Last but not least - if you need dev support, feel free to book a meeting by clicking on my signature. Will be happy to help
best,
Anton
Desktop Page Menu Stopped Working
SOLVE
Desktop Page Menu Stopped Working
SOLVEHi @PAubrey4,
There seem to be a lot of JS issues on your website:
You'll need to review and fix these, one of them should be the reason why the menu stops working.
Best regards,
Ernesto @ GiantFocal
Found this answer helpful?
Marking it as the solution helps both the community and me - thanks in advance!
Ernesto @ GiantFocal
Found this answer helpful?
Marking it as the solution helps both the community and me - thanks in advance!
