Showing the "View on website" link in the Episerver Options menu for content without a template

You've maybe noticed already that if you're editing content in Episerver that doesn't have a template (amongst other things) then the "View on website" option is hidden. Most of the time this isn't a hassle and is in fact exactly what you want — but other times it would be really convenient to show that link.

For instance, I've see complex catalog hierarchies where neither products nor variants have templates, meaning editors always have to keep traversing up the catalog to find something they can view easily.

Take the Episerver Quicksilver reference site as an example, variants are shown on products so don't have a template. As such, if I drop down the options menu I see:

[missing screen]

Pretty trivial honestly but wouldn't it be nicer if I could see the link and the variant URL?

[missing screen]

This can be achieved really easily, all you have to do is create an IModelTransform (EPiServer.Cms.Shell.UI­.Rest.Models.Transforms) implementation, here is an example using Quicksilver (in this case we implement the TransformBase<T> abstract class which implements IModelTransform):

[ServiceConfiguration(typeof(IModelTransform), Lifecycle = ServiceInstanceScope.Singleton)]
public class VariantContentDataModelBaseTransform : TransformBase<ContentDataStoreModelBase>
{
    public override TransformOrder Order => TransformOrder.TransformEnd;

    protected override bool ShouldTransformInstance(IModelTransformContext context)
    {
        return context.Source is VariationContent;
    }

    public override void TransformInstance(IContent source, ContentDataStoreModelBase target,
        IModelTransformContext context)
    {
        var variant = source as VariationContent;

        if (variant == null)
        {
            return;
        }

        // Set the public URL as required
        target.PublicUrl = variant.GetUrl();
    }
}

Just a word on what happens here:

When the data is requested from the content data REST store the IContentStoreModelCreator (EPiServer.Cms.Shell.UI.Rest) is used to create the model. This in turn gets all the registered IModelTransform implementations, verifies they can be executed (by the type) orders them and then calls the Execute method (which in the TransformBase<T> implementation calls TransformInstance).

With that in mind, you can see what we're doing is simple. This just registers a transform that should be applied at the end of the sequence (TransformOrder.TransformEnd) and sets the public URL for the variant to an actual URL (using an extension method in Quicksilver).

This is admittedly a nice easy example — but you could use it to do something cooler — like thumbnails for blocks.

Have fun!