---
title: "Navigation element: your site's link list"
description: "Show a row of horizontal or vertical links; it's the main block of your site's navigation bar and footer."
url: https://docs.vivlab.com/en/editor/menu/navigation
---

# Navigation

The **Navigation** element shows a series of horizontal or vertical links. It's the main block of the navigation bar and the footer: it lists the links to the important sections of the site.

<DocsScreenshot name="editor-navigation-link" alt="The Home label and Website page action of a navigation link." :width="346" :height="222" />

## Link list

The side panel shows the list of links. Click on a link to edit it, or use the list actions to **duplicate**, **delete** or add a new one.

For each link:

- **Navigation bar text**: the visible label (for example "Home", "Our products", "Contact").
- **Action on click**: the link target. See the [button](https://docs.vivlab.com/en/editor/menu/button.md) for the full list of available actions (page, anchor, product, category, external link, email, phone, PDF…).

## Navigation style

The [style panel](https://docs.vivlab.com/en/editor/style/index.md) lets you adjust the [text style](https://docs.vivlab.com/en/editor/style/text.md) of the links: pick their **Color** and **Font** to match your [theme](https://docs.vivlab.com/en/sections/themes-brands.md), and also set the size, case, weight and spacing. The color and font apply to **all the links** of the navigation at once, for a consistent look.

The panel also gathers the [background](https://docs.vivlab.com/en/editor/style/background.md), [borders](https://docs.vivlab.com/en/editor/style/border.md), [shadow](https://docs.vivlab.com/en/editor/style/box-shadow.md), [inner margins](https://docs.vivlab.com/en/editor/style/padding.md), [positioning](https://docs.vivlab.com/en/editor/style/align.md) (that's where you pick the horizontal or vertical direction of the links) and [transitions](https://docs.vivlab.com/en/editor/style/transition.md).

To add a dropdown to your navigation, use the [Dropdown menu](https://docs.vivlab.com/en/editor/menu/menu.md) element instead, which offers sub-items with descriptions.