{"id":3103,"date":"2014-07-13T01:03:45","date_gmt":"2014-07-13T01:03:45","guid":{"rendered":"http:\/\/www.tipsandtricks-hq.com\/ecommerce\/?p=3103"},"modified":"2020-01-05T11:02:29","modified_gmt":"2020-01-05T00:02:29","slug":"showing-a-shopping-cart-with-product-image-thumbnails","status":"publish","type":"post","link":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/showing-a-shopping-cart-with-product-image-thumbnails-3103","title":{"rendered":"Showing a Shopping Cart with Product Image Thumbnails"},"content":{"rendered":"<p>In this tutorial, I will show you how you can show an image thumbnail of\u00c2\u00a0your product in the shopping cart when using the <a href=\"http:\/\/www.tipsandtricks-hq.com\/wordpress-simple-paypal-shopping-cart-plugin-768\">Simple\u00c2\u00a0Shopping Cart<\/a> plugin. The goal is to create a shopping cart that looks like the following example:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3104\" src=\"http:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2014\/07\/shopping-cart-with-product-image-thumbnail.png\" alt=\"shopping-cart-with-product-image-thumbnail\" width=\"494\" height=\"439\" srcset=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2014\/07\/shopping-cart-with-product-image-thumbnail.png 494w, https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2014\/07\/shopping-cart-with-product-image-thumbnail-300x266.png 300w\" sizes=\"(max-width: 494px) 100vw, 494px\" \/><\/p>\n<h3>Step 1. Specify the Thumbnail Image URL in the Button Shortcode<\/h3>\n<p>Specify\u00c2\u00a0your thumbnail image in the add to cart button shortcode using the &#8220;thumbnail&#8221; parameter. See example below:<\/p>\n<pre>[wp_cart_button name=\"Test Product\" price=\"19.95\" thumbnail=\"http:\/\/www.example.com\/my-product-image.jpg\"]\n<\/pre>\n<h3>Step 2. Specify the Show Thumbnail Parameter in the Shopping Cart Shortcode<\/h3>\n<p>Add the\u00c2\u00a0&#8220;show_thumbnail&#8221; parameter in your shopping cart shortcode. See example below:<\/p>\n<pre>[show_wp_shopping_cart\u00c2\u00a0show_thumbnail=\"1\"]\n<\/pre>\n<p>or<\/p>\n<pre>[always_show_wp_shopping_cart show_thumbnail=\"1\"]\n<\/pre>\n<p>Now, when your customers add items to the cart, they will see the product image thumbnails that you specified in the add to cart button shortcode.<\/p>\n<h2>What If I am Using WP eStore Plugin?<\/h2>\n<p>There is a similar feature in the <a href=\"http:\/\/www.tipsandtricks-hq.com\/wordpress-estore-plugin-complete-solution-to-sell-digital-products-from-your-wordpress-blog-securely-1059\">WP eStore<\/a> plugin also. So\u00c2\u00a0you will be able to create a shopping cart with product image thumbnails\u00c2\u00a0if you are using that plugin also.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In this tutorial, I will show you how you can show an image thumbnail of\u00c2\u00a0your product in the shopping cart when using the Simple\u00c2\u00a0Shopping Cart plugin. The goal is to create a shopping cart that looks like the following example: Step 1. Specify the Thumbnail Image URL in the Button Shortcode Specify\u00c2\u00a0your thumbnail image in [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","footnotes":""},"categories":[30],"tags":[5,178,32],"class_list":{"0":"post-3103","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-wordpress-shopping-cart","7":"tag-add-to-cart-button","8":"tag-cart-shortcode","9":"tag-wp-shopping-cart","10":"entry"},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/posts\/3103"}],"collection":[{"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/comments?post=3103"}],"version-history":[{"count":0,"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/posts\/3103\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/media?parent=3103"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/categories?post=3103"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/tags?post=3103"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}