Hi,

Have you tried using something like Html.PropertyFor(x => x.MainImage) to display the image instead? 

I would recommend creating a Html helper function for this that you can reuse throughout your project(s):

    public static class MediaHelpers
    {
        public static string GetImageVaultMediaUrl<T>(this HtmlHelper<T> html, Expression<Func<T, MediaReference>> expression) {
            var modelMetadata = ModelMetadata.FromLambdaExpression(expression, html.ViewData);
            var mediaReference = modelMetadata.Model as MediaReference;
            var settings = ServiceLocator.Current.GetInstance<PropertySettingsResolver>().GetSettings(typeof(PropertyMediaSettings), modelMetadata.ModelType, modelMetadata.PropertyName) as PropertyMediaSettings;
            var client = ClientFactory.GetSdkClient();
            var media = client.Load<Thumbnail>(mediaReference, settings).FirstOrDefault();
            return media?.Url;
        }
    }

And then call it like this whenever you need the URL:

    <header style="background-image: url('@Html.GetImageVaultMediaUrl(m => m.HeaderImage)');">

Best regards,
Robert
ImageVault