<html>

<head>
  <title>template_html_3</title>
  <style>
    a {
      color: #0f7afc;
      border-bottom-color: rgba(15, 122, 252, 0.2);
      text-decoration: none
    }

    a:hover {
      color: #cf0000;
      border-bottom-color: rgba(208, 64, 0, 0.2);
      text-decoration: none
    }

    a:visited {
      color: #800080;
      border-bottom-color: rgba(128, 0, 128, 0.2);
      text-decoration: none
    }
  </style>
</head>

<body>

  <a href="{{urlpath "my-page1"}}">/mypath</a>
  <br />
  <br />

  <a href="{{urlpath "my-page2" "theParam1" "theParam2"}}">/mypath2/{paramfirst}/{paramsecond}</a>
  <br />
  <br />

  <a href="{{urlpath "my-page3" "theParam1" "theParam2AfterStatic"}}">/mypath3/{paramfirst}/statichere/{paramsecond}</a>
  <br />
  <br />

  <a href="{{urlpath "my-page4" "theParam1" "theparam2AfterStatic"  "otherParam"  "matchAnything"}}">
    /mypath4/{paramfirst}/statichere/{paramsecond}/{otherparam}/{something:path}</a>
  <br />
  <br />

  <a href="{{urlpath "my-page5" "theParam1" "theParam2Afterstatichere" "otherParam"  "matchAnythingAfterStatic"}}">
    /mypath5/{paramfirst}/statichere/{paramsecond}/{otherparam}/anything/{anything:path}</a>
  <br />
  <br />

  <a href={{urlpath "my-page6" .ParamsAsArray }}>
    /mypath6/{paramfirst}/{paramsecond}/statichere/{paramThirdAfterStatic}
  </a>
</body>

</html>