DEV Community

Cover image for Routing in Umbraco Part 1: URL segments
Morten Hartvig
Morten Hartvig

Posted on • Edited on

2

Routing in Umbraco Part 1: URL segments

If you have ever paid attention to the URL structure of nodes in Umbraco while going hard at your various Umbraco endeavours, you might have noticed that URLs are generated based on a node's placement in the content tree followed by its name. Usually this poses no issue but what if you wanted to change how the URL is made?

Say, for example, that you have a blog and you would like the create date (year) of each post shown in the URL. How would you do this?

You could use one of the built-in property type aliases such as umbracoUrlName, as Umbraco will use that property instead of the node's name for the URL segment:

Textstring property with umbracoUrlName as the alias:

Image description

New URL:

Image description

However, who wants to do this for each blog posts?

Luckily Umbraco has some tricks up its sleeve and allows you to easily change how URLs behave by using your own URL providers.

Creating your own URL segment provider

Create a class that implements IUrlSegmentProvider. All the magic will take place in GetUrlSegment():

using Umbraco.Cms.Core.Models;
using Umbraco.Cms.Core.Strings;

namespace Adventures;

public class BlogPostUrlSegmentProvider : IUrlSegmentProvider
{
    private readonly IUrlSegmentProvider _segmentProvider;

    public BlogPostUrlSegmentProvider(IShortStringHelper shortStringHelper)
    {
        _segmentProvider = new DefaultUrlSegmentProvider(shortStringHelper);
    }

    public string? GetUrlSegment(IContentBase content, string? culture = null)
    {
        // Do code
    }
}
Enter fullscreen mode Exit fullscreen mode

By using _segmentProvider.GetUrlSegment(content, culture) we can get the current URL segment for the given node and its culture.

In order to prepend the year of the blog post to the URL, all you have to do is make sure content.CreateDate.Year is part the string that is returned.

CreateDate is used for simplicity's sake. Typically you would want a separate DateTime property to assign a publish date. Otherwise, a post that you started in December of a given year but is not published until January will have the previous year in the URL - and you might not want that :-)

public string? GetUrlSegment(IContentBase content, string? culture = null)
{
    if (content.ContentType.Alias != "blogPost")
        return null;

    var segment = _segmentProvider.GetUrlSegment(content, culture);

    return $"{content.CreateDate.Year}-{segment}";
}
Enter fullscreen mode Exit fullscreen mode

With the segment provider in place you can now register it:

using Umbraco.Cms.Core.Composing;

namespace Adventures;

public class BlogPostUrlComposer : IComposer
{
    public void Compose(IUmbracoBuilder builder)
    {
        builder.UrlSegmentProviders()
            .Insert<BlogPostUrlSegmentProvider>();
    }
}
Enter fullscreen mode Exit fullscreen mode

If you have previously worked with custom URLs you might have experience with your own Content Finders. These are not required when only the segment is changed.

Build your solution and republish a relevant node in Umbraco and you will have an updated URL:

Image description

oh.. and if the node has previously been published, Umbraco will automatically created a redirect. Neat :-)

Do your career a big favor. Join DEV. (The website you're on right now)

It takes one minute, it's free, and is worth it for your career.

Get started

Community matters

Top comments (0)

👋 Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay