Add a small image to your product list

In : Admin hints & code snippets | 0 comments

Candypress comes with a decent secure administration to handle your products and customers orders.

When you use it on a daily basis there are small things that can be improved with very small "code snippets". Today I'm gonna show you how to add an a small image to your product list.

It's really simple and you don't need to be an asp coder to make this implementation.
Below you can see a small preview about what you are about to implement.

Start your code editor and find sa_prod.asp inside your /admin folder.

1. Modify at line #450 the product query to include the small Image Url & " reviewAllow,sortOrder, smallImageUrl, " _
2. You can add the image tag inside an existing table cell. To display the small image above the product ID change line #589 to : <td bgcolor="<%=rowColor%>" valign="top">
<img src="../prodImages/<%=rs("smallImageUrl")%>" border="0" width="100" />
<br /> <%=rs("idProduct")%></td>
3. If you want to display it a bit more clean, just change some more lines and you're done.
   Here we go. First next after line #568, add : <td class="listRowHead"><b>Image</b></td>
4. Next find line #590 which displays the Product Id, after that line enter this : <td bgcolor="<%=rowColor%>" valign="top">
<img src="../prodImages/<%=rs("smallImageUrl")%>" border="0" width="100" />
</td>
5. To finish this off, you need to adjust the colspan from 3 to 4 on 2 lines. Change line #547 to: <td nowrap="" colspan="4" class="listRowTop">
6. And finally change line #663 to look like : <td nowrap="" colspan="4" class="listRowBot">
7. You can turn the image into a link to your product detail page on your store front, add the url and product ID to your image tag like : <a href="../scripts/prodview.asp?idProduct=<%=rs("idProduct")%>" title="Display
product on front store"><img src="../prodImages/<%=rs("smallImageUrl")%>"
border="0" width="100" /></a>

Change the width inside the image tag to whatever size you like the small image to be resized.

That's it, nothing special, just an easier way to find the product you need to edit.
This works fine for both CP5 and CP6.