# Mobile menu toggle style

**URL:** <https://community.hubspot.com/t/mobile-menu-toggle-style/3032>\
**Category:** CMS Development\
**Created:** [August 15, 2017, 7:39am UTC](https://community.hubspot.com/t/mobile-menu-toggle-style/3032 "2017-08-15T07:39:42Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![MariS](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/maris/32/43030_2.png) [@MariS](https://community.hubspot.com/u/MariS)\
**Post date:** [August 15, 2017, 7:39am UTC](https://community.hubspot.com/t/mobile-menu-toggle-style/3032/1 "2017-08-15T07:39:42Z")

</div>

Hi team

I am having difficulty with my mobile menu styling. I followed exact instructions here, but it’s still displaying as a list from my sitemap, rather than the three line style for mobile.

Instructions followed here:

> **[Menus and Navigation - HubSpot docs](https://developers.hubspot.com/docs/cms/start-building/building-blocks/modules/menus-and-navigation)**
>
> HubSpot has a few built-in tools to make the creation and management of these menus easy, and on the code side multiple solutions for displaying menus so you can pick the solution that makes the most sense for your website.

My page:

[http://2920131.hs-sites.com/securing-wordpress-15-steps](http://2920131.hs-sites.com/securing-wordpress-15-steps)

(view on mobile to see what I mean).

Basically I want it to look like a normal mobile menu with the three lines that you click on and then they open.

---

<div class="post-metadata">

**Author:** ![Jsum](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jsum/32/20405_2.png) [@Jsum](https://community.hubspot.com/u/Jsum)\
**Post date:** [August 15, 2017, 10:17am UTC](https://community.hubspot.com/t/mobile-menu-toggle-style/3032/2 "2017-08-15T10:17:01Z")

</div>

@MariS,

`<script src="//cdn2.hubspot.net/hub/2920131/hub_generated/template_assets/1502784463787/Custom/page/ALT_Digital_August2017-theme/ALT_Digital_August2017-main.min.js")%20}}"></script>`

Check out the link to your main.min.js javascript file. It’s a bit screwy.

Your javascript isn’t loading because the link is broken. Check the code for nesting quotations.

```auto
" ' ' " <!-- ok-->
' " " ' <!-- ok -->
' " ' " <!-- nope -->

```

---

<div class="post-metadata">

**Author:** ![MariS](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/maris/32/43030_2.png) [@MariS](https://community.hubspot.com/u/MariS)\
**Post date:** [August 15, 2017, 11:42am UTC](https://community.hubspot.com/t/mobile-menu-toggle-style/3032/3 "2017-08-15T11:42:31Z")

</div>

Thanks @Jsum

The JS code was lifted straight off the Hubspot page I referenced. Is there another source I should use, or must I just replace the quotation marks as discussed.

Also (sorry if it’s a dumb question) but you refer to my main.min.js file but I only have a main.js file. Am I supposed to rename it?

---

<div class="post-metadata">

**Author:** ![MariS](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/maris/32/43030_2.png) [@MariS](https://community.hubspot.com/u/MariS)\
**Post date:** [August 15, 2017, 12:26pm UTC](https://community.hubspot.com/t/mobile-menu-toggle-style/3032/4 "2017-08-15T12:26:19Z")

</div>

Hi again

Okay I made changes by creating a fresh JS file for this purpose, and applied your syntax notes. But it still won’t work. Can you see if you can see why?