# Navigation buttons (PageNavigationLink) in formatted content

{% hint style="info" %}
The availability of functionality depends on the license and may not be available in all deployments.
{% endhint %}

Example - clicking the button **Change** takes you to a previously defined page.

![Figure 1. Example content with a navigation button](https://content.gitbook.com/content/2CssJT0zIo4SJQLbSZ6l/blobs/zUKnglZoQOsQwD5A27J3/28k_files/zmien.png)

* To create such a link, we need to put into **Content** (TextContent) a div with the appropriate class and attribute:
  * class **page-link**
  * attribute **mid** with the value of the page MID to which we want to redirect
* For example, it would look as follows:

{% code title="Example link element" %}

```html
<div class="page-link" mid="Page1">Change</div>
```

{% endcode %}

* The above link will redirect to Page1, if it exists.

## HTML code creating the Content (TextContent) from the screenshot above

{% code title="Sample HTML" expandable="true" %}

```html
<div style="background-color: #eeeeee; padding: 20px; position: relative;">
  <div>
    <span style="font-size: 1.17em; font-weight: bold;">Selected card</span>
  </div>
  <div class="page-link" mid="Page1" style="position: absolute; padding: 20px; right: 0; top: 0; color: #003574">
    Change >
  </div>
  <div>
    <img src="form/biz/spotify-gift-card.png" height="83" width="127">
  </div>
  <div>
    <p>Card type<br>
      <span style="font-weight: bold">Spotify</span>
    </p>
  </div>
  <div>
    <p>Price<br>
      <span style="font-weight: bold">200.00 PLN</span>
    </p>
  </div>
</div>
```

{% endcode %}

{% hint style="info" %}
Demo request: demoSidebar
{% endhint %}
