Navigation buttons (PageNavigationLink) in formatted Content

The availability of features depends on the license and may not be available in all deployments.

Example - clicking the button Change directs to a previously defined page.

Illustration 1. Example content with a navigation button

• To create such a link we need to put into Content (the TextContent) a div with the appropriate class and attribute:

  • class page-link

  • attribute mid with the value of the mid of the page we want to redirect to

• For example it would look as follows:

Example link element

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

• The above link will redirect to Page1, if such exists.

HTML code creating the Content (TextContent) from the above screen

Sample 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>

Demo application: demoSidebar