Add Styling to Menu in Hubspot

iamathlete
Contributor | Platinum Partner

I'm not a graphic designer and figured I'd ask for help before I end up hiring someone for 10 minutes to fix this.

 

Here's my landing page menu:

http://terrapinevents-6487217.hs-sites.com/terrapin-events-portland-oregon-join-our-mailing-list

 

Here's what I want them to look like (this site is NOT in Hubspot):

https://terrapinevents.com/sponsor-vendor/

 

Anybody have any advice on how I can make my landing page menu look like it's supposed to?

- Words in white

- Spacing between each item

(forget the arrows - I don' tneed those)

0 Upvotes
3 Replies 3
bschneidewind
Top Contributor | Diamond Partner

You should be able to just copy and paste the menu module between the templates using the hubx plugin: https://chrome.google.com/webstore/detail/hubx-by-neambo/dmgpiodabbkeicgkhpokecnlpjddjmah

After that, you'd just want to make sure the same stylesheets that style the menu are present on the new template. 
------------------------------------------------

iamathlete
Contributor | Platinum Partner

Thanks, however the second website (www.terrapinevents.com) is not on Hubspot.  I already have the menu on the hubspot page (http://terrapinevents-6487217.hs-sites.com/terrapin-events-portland-oregon-join-our-mailing-list) I just don't have the skillset to create a stylesheet to match what's on (terrapinevents.com)

 

0 Upvotes
daveroma
Contributor | Platinum Partner

We've had success adding custom styles to HubSpot menus by adding CSS rules to the selectors that HubSpot uses for menu styling. This article explains the markup that is outputted by menu modules and goes over some of the CSS selectors that can be used to style them. @iamathlete 

https://designers.hubspot.com/docs/cms/hubspot-menu-markup

 

--

Dave Roma | Drive Growth Agency