CMS Development

joshdev99
Member

Navigation Bar from scratch

SOLVE

Hello guys I am new in HubL CMS development. I want to build a navbar from scratch but when I try to, css styles wont apply. I am using the Hubspot boilerplate. Thanks

0 Upvotes
1 Accepted solution
Anton
Solution
Recognized Expert | Diamond Partner
Recognized Expert | Diamond Partner

Navigation Bar from scratch

SOLVE

Hi @joshdev99

 

if you want to build an own nav-bar:
- create a new HTML file(if you want as global-partial but in this case it shouldn't be necessary)

- work with the grid system(HubSpot still uses Bootstrap 2 by default) you'd like to create the layout you want. If you want to work with something else e.g Bootstrap4 modify the base.html file
- use the menu module and other modules to create the desired menu. Info: Mega-menus are a **bleep** of a custom job and this is something that needs a lot of custom work. If you want to create a mega-menu I recommend you to create a custom module for this - it's definitly not an easy job. @dennisedson: idea 😁

- add your classes to the HTML file

- create a new CSS file with all of your stylings(or write them - for test purposes - directly into the theme-override.css)

- add the CSS file into the main.css file or after the main.css and theme-override.css in the base.html

 

 

Hope this helps, 

 

best, 

Anton

 


@dennisedson - not half bad at this HubSpot dev stuff...😶 thank you. Rather tell me how i can use giphy in the community 😎

Anton Bujanowski Signature

View solution in original post

2 Replies 2
dennisedson
HubSpot Product Team
HubSpot Product Team

Navigation Bar from scratch

SOLVE

Hey @joshdev99 !

Might need to add some code so we can see what you are up to.  Because I yelled at @Anton for another post you did, I will yell at him again 😀

He is not half bad at this HubSpot development stuff

Anton
Solution
Recognized Expert | Diamond Partner
Recognized Expert | Diamond Partner

Navigation Bar from scratch

SOLVE

Hi @joshdev99

 

if you want to build an own nav-bar:
- create a new HTML file(if you want as global-partial but in this case it shouldn't be necessary)

- work with the grid system(HubSpot still uses Bootstrap 2 by default) you'd like to create the layout you want. If you want to work with something else e.g Bootstrap4 modify the base.html file
- use the menu module and other modules to create the desired menu. Info: Mega-menus are a **bleep** of a custom job and this is something that needs a lot of custom work. If you want to create a mega-menu I recommend you to create a custom module for this - it's definitly not an easy job. @dennisedson: idea 😁

- add your classes to the HTML file

- create a new CSS file with all of your stylings(or write them - for test purposes - directly into the theme-override.css)

- add the CSS file into the main.css file or after the main.css and theme-override.css in the base.html

 

 

Hope this helps, 

 

best, 

Anton

 


@dennisedson - not half bad at this HubSpot dev stuff...😶 thank you. Rather tell me how i can use giphy in the community 😎

Anton Bujanowski Signature