How Toolset’s post relationships and OceanWP will help build a great e-commerce site

Time and cost.

These are two factors both developers and businesses would love to limit when building an e-commerce website.

Fortunately, combining OceanWP with Toolset will go a long way to achieving this.

Toolset’s suite of plugins makes it easy to add some really advanced features to WordPress websites. That’s because you do not need to use any PHP to create them.OceanWP is a great theme because it comes packed with a number of WooCommerce features which can really enhance your product page such as a multi-step checkout to increase conversions or a cart icon shortcode to show how many products have been added so far.

We can already use Toolset and OceanWP to build advanced websites using custom post types. Now we will explore how adding post relationships to the equation will bring more success to both the developer and the company. Post relationships can combine your WooCommerce product pages with items from other custom post types. For example, any shoes you are selling can also appear on your “Stores” custom posts to show where they can be bought. This means you can avoid data duplication as you only need to edit each item once for the changes to appear on your website.

Here is what we will create using a relationship between our products page (the shoes) and the stores where you can find them:

Choosing the right post relationships  for your e-commerce site

There are three post relationships to choose from when building your business website and deciding how exactly you want to connect items from different custom post types.

One-to-one relationships are an exclusive connection between a child and parent custom post type. For example, you might want to combine shops which stock your products with their addresses so it would be easy for people to browse where they can buy your product.

One-to-many relationships allow you to connect multiple child items from a custom post type with the parent of another. For an e-commerce website, you will probably want to link each customer’s account with all of the purchases they have made, for example.

However, you will discover that the most popular option is the many-to-many relationship which enables you to link multiple items from one custom post type with many items from another. Developers will have complete flexibility to create whatever combinations they deem necessary.

Let’s use our demo e-commerce website to create a many-to-many relationship and explore just how easy it is.

How to create a many-to-many relationship for your e-commerce website

To create our many-to-many relationships, we will use Toolset’s relationships wizard. With it, we will create a connection between the shoes we have on sale and the stores in which you can find them.

1. Choose the many-to-many relationships option

First, we need to access the relationships wizard from Toolset > Relationships. Once that is done, we can select the ‘Add New’ option which will take us to the first screen. From here, we will choose the many-to-many relationship.

2. Select the post types we want to connect

On the next screen, we will identify what exactly we want to combine in order to create a many-to-many relationships. We have selected the “Stores” custom post type which will link with our product page.

3. Set limits on the number of posts we want to connect

There will be some instances where we might want to limit how many items from one custom post type are linked with another – a doctor and the number of patients assigned to them, for example. However, in this instance, it is unnecessary so we will move on to the next step.

4. Add relationship fields

Relationship fields are useful when you want to add important information to a connection. For example, the track number between the “Song” and “Album” custom post types. Once again, however, we will not need any for the relationship we are creating so we will skip it.

5. Name your many-to-many relationship

The last thing we need to do is give our relationships a name. We will call this one “Stores Products.”

Our many-to-many relationship is now ready to be put to the test.

Connect posts using our many-to-many relationships

Now that we have our many-to-many relationship, we can start to form connections between our “Stores” custom post type and our product page.

Let’s imagine that the Fitnessrun store now has the Life In Pink Adidas shoe in stock. Therefore, we will want to display that store on the product page so customers know where they can buy it and vice versa. To do this we can create the connection on the back-end. All we need to do is click “Connect existing store” as we edit the Life In Pink product page and we can select Fitnessrun.

If we now head to the front-end, we can see on our OceanWP-built product page that Fitnessrun has been added to the post.

We can also see that the shoe can now be found on the Fitnessrun post as well.

Toolset and OceanWP will help you build great e-commerce websites more quickly

By incorporating Toolset’s repeatable field groups with OceanWP, you will be able to extend the capabilities of your e-commerce website and create an experience which will see your customers returning again and again. Better yet, its simplicity ensures you can build these new features quicker than ever before.