Time for action – adding images to the product detail page

Let's extend this technique to show product images in our product listing page and in the product detail page. Perform the following steps:

  1. Open products.jsp; you can find products.jsp under the /src/main/webapp/WEB-INF/views/ directory in your project. Now, add the following <img> tag after the <div class="thumbnail"> tag:
    <img src="<c:url value="/resource/images/${product.productId}.png"></c:url>" alt="image"  style = "width:100%"/>
  2. Similarly, open product.jsp and add the following <img> tag after the <div class="row"> tag:
    <div class="col-md-5">
      <img src="<c:url value="/resource/images/${product.productId}.png"></c:url>" alt="image"  style = "width:100%"/>
    </div>
  3. Now, run our application and ...

Get Spring MVC Beginner’s Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.