# Nav

The `nav` block is the ultimate no-code mega menu builder that allows you to create the ultimate navigation experience for your users.

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

{% embed url="<https://www.youtube.com/watch?v=_5v8ceDOo7w>" %}

You can craft a fully customisable, easy to use, multi-level, single markup menu that displays a range of navigation choices in an optimised layout from desktop to mobile devices.&#x20;

The Cwicly `nav` block is specifically designed with focused accessibility in mind.

With an increasing number of users browsing the web on mobile devices, Cwicly manages all the gear changes between different breakpoints  and modal views, optimising user experience at every level thanks to smart single markup.

You can also apply pre-made styling options in a click.

We have made it easy to add or remove items from your menu using three different blocks:

The `nav link` block, which is a simple link

The `nav dropdown` block, to group multiple links within a dropdown or add your own custom blocks.

The `nav menu` block, to import a WordPress menu directly into your mega menu

For added flexibility, these blocks are contained within the Nav Items block, allowing you to add custom blocks to the main Nav block structure while respecting accessibility guidelines.

## Add a Nav

* Open the Block inserter and find the `nav` block.
* Click to add it to your page.

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

* You can choose between a Preset Nav to get you started or a Blank Nav which will give you the bare bones.
* Click the Preset Nav.

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

### Preset Nav

* The preset nav comes with all the necessary elements to make a fully functioning mega menu that can be customised as required.

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

* &#x20;As you can see, the modal view is automatically set up and will adjust to any changes that are made.

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

You will find:&#x20;

A Nav Block

A Nav Items block containing:

* A nav dropdown block (Home) with two groups, their titles and descriptions.
* A nav dropdown block (Solutions) with the addition of a pre-styled footer section
* A simple link block (New Link) with its link set to cwicly.com.
* A custom dropdown (Custom Dropdown) with a simple header and paragraph.

{% content-ref url="/pages/xlN0pwmsQRqVggkmltu8" %}
[Nav Block Settings and Styles](/blocks/nav/nav-block-settings-and-styles.md)
{% endcontent-ref %}

{% content-ref url="/pages/2bHPOLbXefqngUY9cIVK" %}
[Nav Items Block](/blocks/nav/nav-items-block.md)
{% endcontent-ref %}

{% content-ref url="/pages/7zbIUurz0ajEWRoP7ScS" %}
[Nav Dropdown Block](/blocks/nav/nav-dropdown-block.md)
{% endcontent-ref %}

{% content-ref url="/pages/3W0ijjt3D7ZvhUOcLXXS" %}
[Nav Link](/blocks/nav/nav-link.md)
{% endcontent-ref %}

{% content-ref url="/pages/eUpu2i19g29rNMadw1yd" %}
[Custom Dropdown Block](/blocks/nav/custom-dropdown-block.md)
{% endcontent-ref %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.cwicly.com/blocks/nav.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.