How Do I Add An External "Buy Now"/Add To Cart Button For My Shift4Shop Store?

Instead of hosting and completely creating your online store with Shift4Shop, you may want to link products from Shift4Shop to your existing website or create a "Buy" button. When used, the "Buy" button will add the item to the shoppers cart and allow them to checkout as normal. You would use this method if you currently have an online presence hosted elsewhere and you do not want to make any changes to that website or switch fully to our hosting service.

Create a Buy Button

Your Shift4Shop store comes with a pre-made "buy.gif" image that you can use for this. However, you may want to create and upload your own. To create a buy button for each product on your website, you will first need to go to the File Manager to upload the buy.gif image that will be used for the button. To do this, log into your Shift4Shop Online Store Manager and, using the left hand navigaiton menu:

Go to Products >Images
Click on the "+Upload Files" button located at the top right.
Click Browse and choose the gif. file of your buy button – make sure it is titled "buy.gif".
Click Upload All

Now, you will retrieve the HTML code that will be used for each product's individual "Buy" button.

Go to Products >Product List
Find the product that you'd like to create the buy button for and click on the product's ID or Name to open it
Or look to the far right of the product and click on its "Action >Edit" button
Once you have the product open, look along the top and click on the product's Advanced Tab
Scroll down to the Buy Button field and click on the "Copy" button found to its right
Paste the link into the HTML of your existing website.

When using this setup however, you must enable a setting in your Shift4Shop Online Store Manager that will allow for the cart to be created when linked to from an external site. Failure to do so may result in your shoppers receiving a browser error indicating that their browser cookies are not allowed.

To correct this, and configure the setting, please use the following steps.

Log into your Shift4Shop Online Store Manager.
Using the left hand navigation menu, go to Settings >General >Store Settings.
Next, click on the "Checkout" tab found along the top of the page.

Once you arrive at the Checkout Tab page, make sure that there's a mark in the "Allow external 'Add to cart' links" checkbox.

Click "Save" at the top right of the page to commit your changes.

Once set, this setting will allow the Shift4Shop Shopping Cart software to create the order from an externally hosted link to your products.

Create a Link to the Product

Aside from the "Buy Now" button, you can also use an external link that merely takes the site visitor to the product listing on your store. Once there, the visitor can purchase the product as they would normally. Each of your products has the link automatically created for you and you simply need to retrieve it. To retrieve the direct link to the product:

Go to Products >Product List
Find the product that you'd like to retrieve the direct link for and click on the product's ID or Name to open it
Or look to the far right of the product and click on its "Action >Edit" button
Once you have the product open, look along the top and click on the product's Advanced Tab
Click Copy next to the "Link to this Product" field.
Paste the link into the HTML of your existing website.

Additional Information
Since you'll likely be using the Shift4Shop portion of the store just for the checkout functions, here are some other suggestions/considerations you might want to make:

Remove superfluous modules
Some modules are turned on by default and wouldn't really be needed if you're only favoring the checkout portion of the software. For example, Home Specials, Homepage Carousel, etc. You can view available modules by clicking on Modules in the navigation bar. Consider which ones you might want to enable/disable for your needs.
Remove certain navigation elements and extra pages
Your Shift4Shop store has some links and additional pages created for you that might not be needed if you're using the software just for product display and checkout. For example, the About Us, Contact Us, and Home Page links could probably be removed. Please click here to learn about the Site Content section of the store to learn how these sections can be hidden.
Customizing Page Settings
Again, if the store is being used just to display products and provide a checkout experience, then another consideration you may wish to make is to hide banner elements on pages that reference mailing lists, top sellers, manufacturers and more features that are probably not needed. Please click here to review what's possible on the store's Titles & Content section.