How to add a shopping cart to any existing website in 5 minutes

By Ritvars Lauza read
05 Jun, 2024

So, you’ve successfully created your website. Now, you want to monetize it and sell products on it, too. You may wonder – should I start from zero and create an eCommerce site? Or is there a way to do it without the extra fuss? The answer – yes, there is! All you have to do is add a shopping cart to your existing website.

There were days when adding a shopping cart to an existing website seemed like a mission impossible for the average website owner. Thankfully, now we live in a time where we don’t have to be experts in coding, page interfacing tools, and payment processing. There are plenty of solutions that will help add a shopping cart to any website in a matter of minutes.

In this article we’ll cover:

What is a ”shopping cart” and why do you need one?
What are the types of shopping carts and which one is the best for you?
What is a Sellfy shopping cart and how to add it to your website?
Additional Sellfy shopping cart tips and tricks.

“Shopping cart” defined

Originally, the term ”shopping cart” referred to a cart used for holding merchandise when shopping. In eCommerce, it basically means the same thing. The only difference – the mentioned holding of merchandise happens online and via shopping cart software.

In other words, shopping cart software enables the customer to shop on your site. But how exactly does it work?

When your customer selects the products he or she is interested in buying, the goods go into their shopping cart. There, customers can view the list of products they’ve chosen, add or remove products from it, change quantities, etc.

After your customers have finished adding products to the cart, they can finalize their purchase. This is possible via the same shopping cart software, which is where your customers can pay for their products virtually and securely. After the purchase is made, the merchant is notified and can start to prepare the order for shipping.

Why does a business owner need a shopping cart?

The short answer is because having a shopping cart allows your business to be available 24/7.

Look: There are other ways your clients can order and pay for your products. For example, a client can contact you directly via your website and simply tell you what they want to buy. Then, you can create and send them an invoice, wait for the client to pay, and then deliver the goods – whether digital or tangible.

In the meantime, there are more practical ways to handle these transactions. You guessed it – by having a shopping cart software added to your website. That way, you can make your products available for purchase and generate revenue 24/7 as well as reduce the amount of manual work on your side because payments are processed automatically by the shopping cart software.

A shopping cart links the processes of selecting products and making the payment online. It helps to track the transaction count on your site, simplifies and automates the payment process, and improves the overall customer experience on your site.

Before making your decision on which shopping cart software to use you need to ask yourself the following questions:

What are my technical skills – do I have enough knowledge in coding or do I want some easy-to-use solutions?
What kind of payment plan do I prefer when it comes to shopping cart software – do I want to pay it all upfront or pay monthly?
Do I have the means to upkeep the shopping cart software on a server?
Do I have the skills and resources to be fully responsible for security and privacy issues regarding, for example, my client’s billing information?
Can I simply embed the shopping cart software on my existing website, blog, etc?

The types of online shopping carts

There are two types of shopping cart software – licensed and hosted. Let’s take a more detailed look at each of them.

#1: Licensed

Best for: Experienced and tech-savvy shop owners

Having a licensed (or self-hosted) shopping cart software means that you’re the owner of the software and you’re hosting it, meaning that you store your website and all the data on your own server. There’s usually a one-time fee to own this type of software.

When it comes to design, display, and functionality, this shopping cart type gives freedom and does not put any limits on your website. However, with freedom comes responsibility. If you choose to use a licensed shopping cart software you have to download and install it onto your web server by yourself. You would also be responsible for its maintenance, updates, and security. That means that working with this type of software requires some prior technical knowledge.

#2: Hosted

Best for: Beginner merchants, shop owners without extensive technical knowledge

If you’re not the technical kind of a person, hosted shopping cart software may be the most hassle-free option for you.

Hosted shopping cart software offers both the software and its hosting, meaning that it’s provided as a service so that you don’t have to deal with these things yourself. This type of software comes with either a monthly or an annual billing plan.

Some benefits of hosted shopping cart software:

No technical knowledge required
A variety of premade shopping cart templates that you can customize the way you prefer and add to your store (but within certain limits)
An easy store managing process, as you can add information and make edits to your store from a web-based interface, meaning that you can run your company via a web browser

Sellfy is one of the best-known examples of hosted shopping carts.

What is a Sellfy shopping cart

Sellfy is a hosted shopping cart software that allows you to add the shopping functionality to any existing website or blog fast and easy. In addition, you can embed the shopping cart widget to any existing website or blog fast and easily.

In addition, Sellfy shopping cart allows you to:

Have the freedom to customize the look of your shopping cart button the way you like it (see tips and tricks below)
Accept payments from all around the world by using Paypal or card payments
Embed your shopping cart anywhere you want and can paste HTML code – for example, on your WordPress website or blog
Be sure that both you and your client’s payments and purchases are handled securely.

thebrokencircle store-2

Now that you know all the perks of the Sellfy shopping cart, it’s time to see it in action!

How to add a Sellfy shopping cart to your website

Essentially you have two options with the Sellfy shopping cart – either you create a fully functional storefront or you add the shopping cart to a previously existing website. In this step-by-step guide, we’re going to show you how to add a Sellfy shopping cart to your website.

How to embed the Sellfy shopping cart directly into your site:

First, you need to log in to your Sellfy account. If you don’t have one, you can make it in 5 minutes and for free! Join our free trial here.
Navigate to Store settings → Embed options
Click the Buy Now button in the Choose Embed Type section
Select a product from the drop-down menu
Scroll down and copy the generated code from the Embed shopping cart window (the code will be the same for all products)
Paste the code into your website HTML (here’s a tutorial on how you can do it).

add shopping cart

And that’s it. Once you’ve copied the HTML shopping cart code into your website, the shopping cart button will be visible and accessible to your customers.

What about payment options?

Now that you’ve created your shopping cart, it’s time to activate payment options. With Sellfy you can use PayPal or Stripe to accept payments from customers around the world.

Let’s take a closer look at PayPal, as it is the easiest and the fastest payment option that can be set up in 10 minutes. All you need to do is to make a PayPal account for your website and connect it to your Sellfy store.

After your PayPal account is made, follow these steps to connect it to your Sellfy account:

When you’ve logged into your Sellfy account, navigate to Store Settings → Payment options
Turn on the Toggle switch (it should be green)
In the provided field, enter your PayPal email address
Click Save.

Sellfy payment settings

It’s as easy as that.

Now that we’ve got all the technical matters covered, let’s talk about what you should keep in mind when embedding a shopping cart to your website.

Some additional Sellfy shopping cart tips

When you add a Sellfy shopping cart to your website you have to think about it strategically – from the user experience and the conversion optimization perspective.

In other words, you have to think of things like where you’re going to put the shopping cart on your site, what color the shopping cart button is going to be, what will be the text on it, etc.

It’s important to pay attention to these details, as they can affect your sales. But first, to manage your Sellfy shopping cart button (such as its position and text), you have to understand the three main components in the code – user ID, data type, and data text.

Here’s a sample code of a Sellfy shopping cart button:

The “data-id” part is unique for your store; therefore, you need to copy this part of the code exactly the way it’s presented for your shopping cart to function properly. Whereas ”data -type” is where you choose the position of your shopping cart button and ”data text” is where you change its text.

Now, let’s look into these 3 aspects – the position, color, and text of the shopping cart – and how to change them.

Shopping cart position on the website

The most important thing to remember when it comes to using a shopping cart on your site is its location, meaning you have to put the shopping cart button in a place where your customers can easily spot it. Otherwise, if your customers don’t see the option to add a product to the cart, your sales will suffer.

So, in order to change the shopping cart button’s position on your site, you need to edit the data-type=”floating” part of the code.

Sellfy offers two options for button positioning: floating and in-line. Thus, in the code snippet, you have to write either “floating” or “Inline”, depending on which option you want to go for.

The “floating” button will stay in a continuous floating mode while the user is scrolling on your site but the “in-line” button will stay in one place.

Here’s how the Sellfy shopping cart buttons can be positioned:

Floating shopping cart

This example demonstrates how the shopping cart button stays at the same place or “floats” when you scroll the page down.

In-line shopping cart

In this example, you can see that the “Buy Now” button is not staying at the same place when you scroll down the page. It stays in line.

Text on the shopping cart button

Did you know that some texts on a shopping cart button work better than others? Several marketers have looked into this subject and concluded that the text “Add to cart” works better than “Buy now”, for example.

You can write the text that works the best for your store; however, we suggest sticking to a 3-word maximum.

To change the text on your shopping cart button you have to edit this part of the code – data-text= “Cart”. The word ”cart” you would replace with your call-to-action, such as ”Order now”, ”Add to cart”, ”Shop”, or something else.

Shape and color of the shopping cart button

The color of your shopping cart button also matters. There have been various research regarding which type of shopping cart button color works best for certain types of businesses. For example, if you want to seem “trustworthy”, choose a blue shopping cart button. Or if you want to radiate a “luxury” vibe, go for a black button.

Regardless of your choice of color, the most important is that the button stands out in the design. So, if your website’s color is blue, you should not use the same color for your call-to-action buttons.

You can change the color or the shape of your Sellfy shopping cart button without changing the code. All you have to do is go to Store settings → Customization. Then, go to the Style section and scroll down to the Button style. Once you’ve made the changes, click Save at the top.

In conclusion

First of all, can we all agree that adding a shopping cart to your website is easier than you initially thought?

Now, all you need to do is follow this tutorial, keep in mind the tips mentioned above, and get to selling your amazing product. Good luck!

Find out more about all the features provided by Sellfy here.

FAQ: How to add a shopping cart to a website

How can I add a shopping cart to my website?

There are several ways to integrate a shopping cart into an existing website. However, the easiest way is to use an eCommerce platform like Sellfy with a built-in shopping cart feature. Sellfy provides customizable “Buy Now” buttons and widgets that you can easily integrate into your website to enable a fully functional shopping cart system.

Why should I add a shopping cart to my website?

Adding a shopping cart to your website is essential for creating a seamless and convenient shopping experience for your customers. It allows them to select multiple products, review their selections, and proceed to checkout in a single transaction. A shopping cart simplifies the buying process, increases customer satisfaction, and ultimately boosts your online sales.

How do I add a shopping cart to my WordPress website?

Adding a shopping cart to your WordPress website is simple with Sellfy. Start by signing up for a Sellfy account and creating your product listings. Then, install the Sellfy WordPress plugin and connect it to your Sellfy account. Use the plugin’s shortcode feature to embed customizable shopping cart buttons and widgets into your WordPress pages or posts. This enables seamless integration of Sellfy’s shopping cart functionality into your WordPress website.