how to change the size of image under recently review nopcommerce
- go to nop.web\views\catalog\recentlyviewproductblock.cshtml
- change the following code
{ <div class="product-picture"> <a href="@Url.RouteUrl("Product", new { SeName = product.SeName })" title="@product.DefaultPictureModel.Title"> <img class="recentviewimg"alt="@product.DefaultPictureModel.AlternateText" src="@product.DefaultPictureModel.ImageUrl" title="@product.DefaultPictureModel.Title" /> </a> </div> }
to
{ <div class="product-picture"> <a href="@Url.RouteUrl("Product", new { SeName = product.SeName })" title="@product.DefaultPictureModel.Title"> <img class="recentviewimg"alt="@product.DefaultPictureModel.AlternateText" src="@product.DefaultPictureModel.FullSizeImageUrl" title="@product.DefaultPictureModel.Title" /> </a> </div> }
the reason is:
if we choose imageUrl,it will load image from thumb but if we choose Fullsizeimageurl,then it will load from full size.
___could be found in nop.web\controllers\catalogcontroller.cs like this below:
var defaultPictureModel = new PictureModel()
{
ImageUrl = _pictureService.GetPictureUrl(pictures.FirstOrDefault(), defaultPictureSize, !isAssociatedProduct),
FullSizeImageUrl = _pictureService.GetPictureUrl(pictures.FirstOrDefault(), 0, !isAssociatedProduct),
Title = string.Format(_localizationService.GetResource("Media.Product.ImageLinkTitleFormat.Details"), model.Name),
AlternateText = string.Format(_localizationService.GetResource("Media.Product.ImageAlternateTextFormat.Details"), model.Name),
};
add css for the size of image
class=”recentviewimg”
and add css in theme.block-recently-viewed-products li {
background: none;
height: 55px;
clear: both;
margin:0px;
border-bottom: 1px solid #e5e5e5;
}.block-recently-viewed-products li.last {
border-bottom: none;
}.block-recently-viewed-products .product-picture {
float: left;
height: 55px;
width: 55px;
margin: 0px;
padding:0px;
}
.recentviewimg
{float: left; height: 50px; width: 50px; margin-right: 5px; padding:0px;
}