{"id":4884,"date":"2023-07-09T13:20:37","date_gmt":"2023-07-09T03:20:37","guid":{"rendered":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/?page_id=4884"},"modified":"2025-01-20T02:23:30","modified_gmt":"2025-01-19T15:23:30","slug":"simple-shopping-cart-blocks","status":"publish","type":"page","link":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/simple-shopping-cart-blocks","title":{"rendered":"Simple Shopping Cart Blocks (Gutenberg Blocks)"},"content":{"rendered":"\n<p>The <strong><a href=\"https:\/\/wordpress.org\/plugins\/wordpress-simple-paypal-shopping-cart\/\" target=\"_blank\" rel=\"noopener\" title=\"\">Simple Shopping Cart Plugin<\/a><\/strong> offers various blocks that allow you to easily insert add to cart buttons and the shopping cart into your website. These blocks provide a convenient way to integrate the functionality of the shopping cart into your desired pages or posts.<\/p>\n\n\n\n<p class=\"has-background\" style=\"background-color:#e1f3ff\"><br>You have the flexibility to utilize both the <a href=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/simple-wp-shopping-cart-installation-usage-290\" title=\"\"><strong>shortcodes provided by the plugin<\/strong><\/a> and the blocks explained in this documentation to seamlessly incorporate add to cart buttons and the shopping cart into your WordPress site. Whether you prefer the simplicity of shortcodes or the enhanced functionality of blocks, the choice is yours to make based on your specific needs and preferences.<\/p>\n\n\n<h2 class=\"simpletoc-title\">Table of Contents<\/h2>\n<ul class=\"simpletoc-list\">\n<li><a href=\"#video-summary\">Video Summary<\/a>\n\n<\/li>\n<li><a href=\"#simple-cart-blocks\">Simple Cart Blocks<\/a>\n\n<\/li>\n<li><a href=\"#using-the-simple-cart-blocks\">Using the Simple Cart Blocks<\/a>\n\n\n<ul><li>\n<a href=\"#step-1-add-an-add-to-cart-button-block\">Step 1) Add an &#8216;Add to Cart&#8217; Button Block<\/a>\n\n<\/li>\n<li><a href=\"#step-2-add-the-shopping-cart-block\">Step 2) Add the &#8216;Shopping Cart&#8217; Block<\/a>\n<\/li>\n<\/ul>\n<\/li><\/ul>\n\n<h2 class=\"wp-block-heading\" id=\"video-summary\">Video Summary<\/h2>\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Simple Shopping Cart Blocks: A Step-by-Step Guide\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/9f5mIwxyo4U?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"simple-cart-blocks\">Simple Cart Blocks<\/h2>\n\n\n<p>In the block editor, you can easily locate the blocks offered by the Simple Shopping Cart plugin by using the keyword &#8220;simple cart&#8221; in the search bar. This convenient search feature enables you to quickly find and access the relevant blocks for seamless integration into your content creation process.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2023\/07\/simple-shopping-cart-blocks.png\"><img loading=\"lazy\" decoding=\"async\" width=\"348\" height=\"321\" src=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2023\/07\/simple-shopping-cart-blocks.png\" alt=\"\" class=\"wp-image-4891\" srcset=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2023\/07\/simple-shopping-cart-blocks.png 348w, https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2023\/07\/simple-shopping-cart-blocks-300x277.png 300w\" sizes=\"(max-width: 348px) 100vw, 348px\" \/><\/a><\/figure>\n\n\n\n<div style=\"height:30px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"using-the-simple-cart-blocks\">Using the Simple Cart Blocks<\/h2>\n\n<h3 class=\"wp-block-heading\" id=\"step-1-add-an-add-to-cart-button-block\">Step 1) Add an &#8216;Add to Cart&#8217; Button Block<\/h3>\n\n\n<p>First, you&#8217;ll need to utilize one of the following blocks to incorporate an &#8216;Add to Cart&#8217; button on your page. This button enables customers to click on it, adding the item to their cart for purchase:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Simple Cart &#8211; Add to Cart Button<\/li>\n\n\n\n<li>Simple Cart &#8211; Product Box<\/li>\n<\/ul>\n\n\n\n<p>You can utilize these blocks to incorporate as many products or items as you&#8217;d like on a page. <\/p>\n\n\n\n<p>The screenshot below provides an illustration of a product box block.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2023\/10\/simple-cart-product-box-block-example-sc-1.png\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"753\" src=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2023\/10\/simple-cart-product-box-block-example-sc-1.png\" alt=\"\" class=\"wp-image-4947\" srcset=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2023\/10\/simple-cart-product-box-block-example-sc-1.png 600w, https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-content\/uploads\/2023\/10\/simple-cart-product-box-block-example-sc-1-239x300.png 239w\" sizes=\"(max-width: 600px) 100vw, 600px\" \/><\/a><\/figure>\n\n\n<h3 class=\"wp-block-heading\" id=\"step-2-add-the-shopping-cart-block\">Step 2) Add the &#8216;Shopping Cart&#8217; Block<\/h3>\n\n\n<p>Following that, you can employ the &#8216;Simple Cart &#8211; Shopping Cart&#8217; block to insert the shopping cart functionality on your website. This shopping cart displays to the customer the items they&#8217;ve added, facilitating checkout and payment. You can place it within a post, page, or even in a sidebar \u2013 anywhere a block can be used.<\/p>\n\n\n\n<p class=\"has-background\" style=\"background-color:#e4f5ff\">Some users choose to add the shopping cart to a particular page. <a href=\"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/simple-shopping-cart-creating-a-specific-checkout-page-4116\" title=\"\"><strong>Follow these instructions<\/strong><\/a> if you wish to do so.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The Simple Shopping Cart Plugin offers various blocks that allow you to easily insert add to cart buttons and the shopping cart into your website. These blocks provide a convenient way to integrate the functionality of the shopping cart into your desired pages or posts. You have the flexibility to utilize both the shortcodes provided [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","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":""},"class_list":{"0":"post-4884","1":"page","2":"type-page","3":"status-publish","5":"entry"},"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/pages\/4884"}],"collection":[{"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/types\/page"}],"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=4884"}],"version-history":[{"count":0,"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/pages\/4884\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.tipsandtricks-hq.com\/ecommerce\/wp-json\/wp\/v2\/media?parent=4884"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}