> For the complete documentation index, see [llms.txt](https://menudocs.nx8apps.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://menudocs.nx8apps.com/replace-menu-by-smart-selector.md).

# Replace menu by smart selector

#### How to use smart selector?

**Step 1**. Click Design > Choose "Replace a menu by CSS selector" > Click "Smart selector".

<figure><img src="/files/kqqJQ5eOaofv8SELyry7" alt=""><figcaption><p>Smart selector 1</p></figcaption></figure>

**Step 2**. Move mouse to menu that you want to replace by "Extra menu". If the menu appears blue bordered, click on it and there will be a confirmation message. Click "OK" to confirm.

![Smart selector 2](https://hypermenu.sgp1.digitaloceanspaces.com/hyper-menu/docs/v1/smart-selector-2.png)

You will see result like image bellow.

<figure><img src="/files/RxQDdN6TwGfaobG9P6bm" alt=""><figcaption><p>Smart selector 3</p></figcaption></figure>

**Step 3**. Choose mobile menu selector. Click "Smart selector"

<figure><img src="/files/TbI1AeIhx6RuaWy6OBHK" alt=""><figcaption></figcaption></figure>

Open mobile menu

![Smart selector 5](https://hypermenu.sgp1.digitaloceanspaces.com/hyper-menu/docs/v1/smart-selector-5.png)

**Step 4**. Move mouse to mobile menu that you want to replace. If the menu appears blue bordered, click on it and there will be a confirmation message. Click "OK" to confirm

![Smart selector 6](https://hypermenu.sgp1.digitaloceanspaces.com/hyper-menu/docs/v1/smart-selector-6.png)

**Step 5**. Check result and save menu data to accept all changes.&#x20;

<figure><img src="/files/wm49IzUgzJWRta6mezPY" alt=""><figcaption><p>Smart selector 7</p></figcaption></figure>