{"id":10780,"date":"2021-07-29T12:50:21","date_gmt":"2021-07-29T07:20:21","guid":{"rendered":"https:\/\/magecomp.com\/support\/?post_type=manual_documentation&#038;p=10780"},"modified":"2021-07-29T12:50:21","modified_gmt":"2021-07-29T07:20:21","slug":"frontend-display-shipping-calculator","status":"publish","type":"manual_documentation","link":"https:\/\/magecomp.com\/support\/docs\/shipping-calculator-magento-2\/frontend-display-shipping-calculator\/","title":{"rendered":"Frontend Display of Shipping Calculator"},"content":{"rendered":"<p><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone size-full wp-image-10781\" src=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/frontend-display-product-page.png\" alt=\"frontend display - product page\" width=\"1250\" height=\"600\" srcset=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/frontend-display-product-page.png 1250w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/frontend-display-product-page-300x144.png 300w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/frontend-display-product-page-1024x492.png 1024w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/frontend-display-product-page-768x369.png 768w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/frontend-display-product-page-600x288.png 600w\" sizes=\"(max-width: 1250px) 100vw, 1250px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Shipping Calculator will be displayed to customers on the Product Page under the Product Description as shown in the image. When the customer clicks on the Calculate button, the shipping cost will be evaluated based on the shipping address. Customers can even change the Shipping Address.<\/span><\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-10782\" src=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/popup-view-product-page.png\" alt=\"popup view - product page\" width=\"1250\" height=\"600\" srcset=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/popup-view-product-page.png 1250w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/popup-view-product-page-300x144.png 300w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/popup-view-product-page-1024x492.png 1024w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/popup-view-product-page-768x369.png 768w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/popup-view-product-page-600x288.png 600w\" sizes=\"(max-width: 1250px) 100vw, 1250px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">When the user clicks on Change Shipping Address, a popup will be generated requesting the user to change the location. Customers can change the Country and State by selecting an option from the drop-down list. Also, the customer can enter the Zip\/Postal Code. As the customer clicks on Submit, the shipping address gets successfully changed.<\/span><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p><img decoding=\"async\" class=\"alignnone size-full wp-image-10785\" src=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/shipping-cost-additional-tab.png\" alt=\"shipping cost additional tab\" width=\"1250\" height=\"600\" srcset=\"https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/shipping-cost-additional-tab.png 1250w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/shipping-cost-additional-tab-300x144.png 300w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/shipping-cost-additional-tab-1024x492.png 1024w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/shipping-cost-additional-tab-768x369.png 768w, https:\/\/magecomp.com\/support\/wp-content\/uploads\/2021\/07\/shipping-cost-additional-tab-600x288.png 600w\" sizes=\"(max-width: 1250px) 100vw, 1250px\" \/><\/p>\n<p><span style=\"font-weight: 400;\">An additional tab is added on the Product Page as shown in the image when the Show Shipping Calculator field is set to In Additional Tab.\u00a0 When the customer clicks on the Calculate button, the shipping cost will be evaluated based on the shipping address. Customers can even change the Shipping Address.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">If anything goes wrong, please contact us at <\/span><a href=\"mailto:support@magecomp.com\"><span style=\"font-weight: 400;\">support@magecomp.com<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":10771,"menu_order":2,"template":"","manualdocumentationcategory":[3998],"manual_doc_tag":[],"class_list":["post-10780","manual_documentation","type-manual_documentation","status-publish","hentry","manualdocumentationcategory-m2-shipping-calculator"],"_links":{"self":[{"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation\/10780","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation"}],"about":[{"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/types\/manual_documentation"}],"author":[{"embeddable":true,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":1,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation\/10780\/revisions"}],"predecessor-version":[{"id":10786,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation\/10780\/revisions\/10786"}],"up":[{"embeddable":true,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_documentation\/10771"}],"wp:attachment":[{"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/media?parent=10780"}],"wp:term":[{"taxonomy":"manualdocumentationcategory","embeddable":true,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manualdocumentationcategory?post=10780"},{"taxonomy":"manual_doc_tag","embeddable":true,"href":"https:\/\/magecomp.com\/support\/wp-json\/wp\/v2\/manual_doc_tag?post=10780"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}