# Links block

In the footer, show menu links from one of your [Shopify navigation menus](https://help.shopify.com/en/manual/online-store/menus-and-links).

<figure><img src="https://3688473072-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FHUe2h5JnXOGnUNdkJwav%2Fuploads%2FJvkbwNEoaC6U32SSKbyS%2Ffooter-links.png?alt=media&#x26;token=78e13f8d-32d7-4890-a1e4-419ad5334d4b" alt=""><figcaption><p>Three links blocks in the footer</p></figcaption></figure>

## Add links block

***

Click the arrow next to the **Footer** section, then click **(+) Add block** and select **Links**. Use the drag-and-drop handles **`⋮⋮`** to re-order blocks. Click the block to start adding content.

Click the **Links** block to **select a menu** that you've created in the Shopify admin.

`Click Links block to find settings`

<table><thead><tr><th width="149">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Menu</mark></td><td><p>Select a menu of links that you've created in your Shopify admin.</p><p>Only top-level links are displayed, so dropdown menus will not appear.</p></td></tr></tbody></table>

## Change block width

***

Change the block width to adjust the layout with other footer blocks.

`Click Links block to find settings`

<table><thead><tr><th width="178">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Desktop width</mark></td><td><p>Use the slider to increase the width of the footer block on desktop.</p><p>To keep all columns in a single row, make sure all footer block widths add up to 100%. To display block on its own row, set the desktop width to 100%.</p></td><td><strong>10 - 100%</strong> <em><mark style="background-color:yellow;">Default</mark></em><mark style="background-color:yellow;">: 20%</mark></td></tr><tr><td><mark style="color:blue;">Mobile width</mark></td><td>Set the width of the footer block on mobile. Set the width to `100%` to avoid line breaks in link names.</td><td><strong>50%</strong> <em><mark style="background-color:yellow;">Default</mark></em><br><strong>100%</strong></td></tr></tbody></table>

## Select menu links

***

Click a **Links block** to select a menu that you've created in the Shopify admin.

`Click Links block to find settings`

<table><thead><tr><th width="190">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Menu</mark></td><td><p>Select a menu of links that you've created in your Shopify admin.</p><p>Only top-level links are displayed, so dropdown menus will not appear.</p></td><td><mark style="background-color:yellow;">Default: Footer menu</mark></td></tr></tbody></table>

## Change heading

***

Change the heading text above the links and choose whether to show the heading on desktop.

`Click Links block to find settings`

<table><thead><tr><th width="190">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Heading</mark></td><td>The title of the links block. Leave the field blank to remove the heading. However, a heading is required when collapsible rows on mobile are enabled.</td><td><mark style="background-color:yellow;">Default: Links</mark></td></tr><tr><td><mark style="color:blue;">Show heading on desktop</mark></td><td>Choose whether to show the block heading on desktop screens.</td><td><mark style="background-color:yellow;">Default: Enabled</mark></td></tr></tbody></table>

## Display collapsible row on mobile

***

On mobile screens, you can display the links block in a collapsible row, instead of as a column.

> **Note**: A **heading** is required for the collapsible row.

`Click Links block to find settings`

<table><thead><tr><th width="190">Setting</th><th width="400">Description</th><th>Options</th></tr></thead><tbody><tr><td><mark style="color:blue;">Collapsible row on mobile</mark></td><td>Display the block as an expandable row that reveals the block content when clicked.</td><td><mark style="background-color:yellow;">Default: Disabled</mark></td></tr></tbody></table>