NopCommerce - Category Images not displaying - asp.net

Question

I can't get category images to display in a NopCommerce theme. This is the code I'm using, on the CategoryTemplate.ProductsInGridOrLines.cshtml page.
#if (Model.PictureModel != null && !String.IsNullOrWhiteSpace(Model.PictureModel.ImageUrl))
{
<div class="category-picture">
<img alt="#Model.PictureModel.AlternateText" src="#Model.PictureModel.ImageUrl" title="#Model.PictureModel.Title" />
</div>
}
I've tried removing the if statement, and it just generates <img>.

Answer 1

as far as i am aware, category images should be accessed like this..
#foreach (var item in Model.SubCategories)
{
count3++;
<div class="sub-category-item col-4 alignCenter">
<h2 class="title">
<a href="#Url.RouteUrl("Category", new { SeName = item.SeName })" title="#item.PictureModel.Title" class="green">
#item.Name</a>
</h2>
<div class="picture">
<a href="#Url.RouteUrl("Category", new { SeName = item.SeName })" title="#item.PictureModel.Title">
<img alt="#item.PictureModel.AlternateText" src="#item.PictureModel.ImageUrl"
title="#item.PictureModel.Title" /></a>
</div>
</div>
if (count3 %3 == 0)
{
#Html.Raw("</div><div class='row'>")
}
}
this is a slightly modified version of the original nopcommerce code in a site i'm currently working on and this code works.
note that images are taken from the item.pictureModel rather than Model.PictureModel.
this is assuming that you have not moved this code into a separate file.
hope this helps

Answer 2

Before using your code you should add the following code to the Category method in the CatalogController:
//prepare category picture model
int picId = category.PictureId;
int picSize = _mediaSettings.CategoryThumbPictureSize;
var categoryPicCacheKey = string.Format(ModelCacheEventConsumer.CATEGORY_PICTURE_MODEL_KEY, model.Id, picSize, true, _workContext.WorkingLanguage.Id, _webHelper.IsCurrentConnectionSecured(), _storeContext.CurrentStore.Id);
model.PictureModel = _cacheManager.Get(categoryPicCacheKey, () =>
{
var pictureModel = new PictureModel()
{
FullSizeImageUrl = _pictureService.GetPictureUrl(picId),
ImageUrl = _pictureService.GetPictureUrl(picId, picSize),
Title = string.Format(_localizationService.GetResource("Media.Category.ImageLinkTitleFormat"), model.Name),
AlternateText = string.Format(_localizationService.GetResource("Media.Category.ImageAlternateTextFormat"), model.Name)
};
return pictureModel;
});`