Oqtane Tutorials
Oqtane Tutorials

Basics: Linking and URL Parameters

Tutorial Home › Linking
Switch to view by URL
#5 Safely Linking URLs with Umlauts and similar
Set Page Title, Keywords, Descriptions etc.
Requirements
Resources

Safely Linking URLs with Umlauts and similar

⬇️ Result | Source ➡️

☝🏽 this image is called göögle plus.png - which must be encoded to g%C3%B6%C3%B6gle%20plus.png 

@inherits Custom.Hybrid.Razor14
@using ToSic.Razor.Blade

@{
  var path = App.Path + "/razorblade/tags/img/";
  var exampleImgName = "göögle plus.png";
  var resizeParameters = "?w=100";
  var safeUrl = Tags.SafeUrl(path + exampleImgName + resizeParameters);
}
<img loading="lazy" src='@safeUrl' id="demo-logo">
<p>
  ☝🏽 this image is called <code>@exampleImgName</code>
  - which must be encoded to
  <code>@Tags.SafeUrl(exampleImgName)</code>
</p>
<style>
  #demo-logo {
    width: 50px;
    padding-right: 20px;
  }
</style>

Sometimes you have files with unexpected characters - like umlauts or spaces. The best way to encode this is using Tags.SafeUrl(...) from RazorBlade, or Uri.EscapeUriString(...) from .net.

Important notes

  • Two characters won't resolve properly on a standard web server: + and %. There are ways to work around this, but we would avoid them at all cost.
  • Other characters like spaces, umlauts (öäè) etc. are no problem.
  • You may also find suggestions to use Server.UrlEcode(...). This often doesn't work!
  • Remember to add @@using System to make this fly

 

Switch to view by URL
#5 Safely Linking URLs with Umlauts and similar
Set Page Title, Keywords, Descriptions etc.