How to Make a Multi Vendor Ecommerce Website with WordPress

Do you want to make a multi vendor eCommerce website in WordPress?

A multi-vendor eCommerce website allows you to have multiple vendors and sellers sell their products on your marketplace for a small fee or commission.

In this article, we’ll show you how to easily create a multi vendor eCommerce marketplace using WordPress open source software.

What is a Multi Vendor Ecommerce Website?

A multi vendor eCommerce website is a platform where multiple vendors, sellers, and businesses can add and sell their own products and services.

It is a popular online business idea that allows the website owner to make money online by charging a fee or commission for each transaction.

Some of the most popular eCommere websites like Amazon, eBay, Etsy, are all examples of a multi-vendor eCommerce marketplace.

You can make a multi-vendor site easily for the relatively small cost of making an eCommerce website using WordPress.

That being said, let’s take a look at how you can easily make a multi-vendor eCommerce website without any technical skills.

What Do You Need to Start a Multi Vendor Ecommerce Website?

First you need to make sure that you’re using the right website builder platform to build your multi vendor eCommerce website.

We always use and recommend WordPress because it powers 43% of all websites on the internet. It is a free open source software that also allows you to add multi-vendor features on your site.

To create a multi-vendor website in WordPress, you will need:

• A domain name idea, this will be your website’s name on the internet (think amazon.com, google.com, etc).
• Web hosting account – this is where your website lives on the internet. All websites need web hosting.
• SSL certificate – this allows you to securely accept payments online.

Normally, a domain name would cost you around $14.99 per year and web hosting starts at $7.99 per month (usually paid annually).

This can be a significant amount of money for those who’re just starting out.

Luckily, the folks at Bluehost have agreed to offer WPBeginner users a generous 63% discount on web hosting with a free domain name and SSL certificate.

Basically, you can use our Bluehost coupon to get started for $2.75 per month.

→ Click Here to Claim This Exclusive Bluehost Offer ←

Note: you can of course use any other web hosting provider as well. We have a list of hosting service providers that specializes in WooCommerce hosting because this is the WordPress plugin that we’ll be using for our eCommerce platform.

Once you have signed up for hosting, you can follow our WooCommerce tutorial to install the eCommerce functionality in WordPress.

After that, you’re ready to add the multi vendor functionality in WordPress.

Adding Multi Vendor Functionality in WooCommerce

WooCommerce doesn’t come with support for multi-vendor stores. To add this, you need a WooCommerce multi vendor addon.

We recommend using WC Vendors as the best WooCommerce multi vendor plugin. It is super easy to set up and comes with all the features you need to have multiple vendors set up their own stores on your marketplace.

First, you will need to install and activate the free WC Vendors Marketplace plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Note: This is the limited free version of the plugin, and it provides only the core functionality. You still need the base free plugin in order to use the premium version of the plugin which has more features. We will cover that in the later steps.

Upon activation, you’ll be asked to run the setup wizard.

Next, you’ll see the first screen of the setup.

From here, you can choose if you want to manually approve vendors, give them shipping and tax options, and set a base commission rate.

Click on the Next button to continue.

On the Capabilities tab, you can fine-tune the user permissions for vendors. These are the actions they can perform on their own products and stores.

Once you’re done, click the Next button to go to the pages section.

WC Vendors can automatically create important pages needed to run your multi vendor store. But if you want to create your own pages, then you can select them here.

If you choose your own pages, then you’ll also need to manually add the shortcodes shown on screen to each page.

We recommend sticking with the default settings here to make the setup easy.

Simply click on the Next button to continue, and then click on ‘Return to Dashboard’ to exit the setup wizard.

Next, you need to install and activate the WC Vendors Pro plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, it will also ask you to run the setup wizard.

On the next screen, you can restrict vendors from accessing the WordPress admin dashboard.

This is a good practice to keep your WordPress site secure.

You can also choose different commission types like percentage, percentage + fee, fixed, and fixed + fee.

Once you select that, go ahead and click on the Next button to continue.

You’ll now see the features that you can enable for the Vendor dashboard. These options will give vendors access to more features to manage their store and products.

Simply choose the features that you want to enable and then click on the Next button.

On the pages screen, the plugin will automatically create a Pro Dashboard page for you.

Optionally, you can also choose a page to display vendor ratings. Simply create a new page in WordPress with the [wcv_feedback_form] shortcode inside it, then select the page here.

After that, you need to click on the Next button to finish the setup. WC Vendors Pro will also give you the option to edit different forms used by Vendors and install extensions to add new features.

You can now return to WordPress dashboard to continue the set up of your multi vendor website.

Setting Up Your WooCommerce for Multi Vendor Platform

Now that you have set up WC Vendor, the next step is to enable user account registration in WooCommerce.

First, you need to create a new page in WordPress and name it Account. Inside the page editor, you need to add the [woocommerce_my_account] shortcode.

Don’t forget to save and publish your page.

Next, head over to the WooCommerce » Settings page and switch to the Account & Privacy tab.

From here, you need to make sure that ‘Allow customer to create an account on the “My Account” page’ option is checked.

After that, switch to the Advanced tab. Under the Page setup section, choose the page you created earlier next to the ‘My account page’ option.

Don’t forget to click on Save changes button to store your settings.

Adding a Link to Sign Up as Vendor

Now you have set up WooCommerce for your multi-vendor eCommerce platform. Next, you would want to add links on your site, so that visitors can register as vendors.

Simply head over to the Appearance » Menus page and add the ‘Account’ page you created earlier to your main navigation menu.

If you like, you can rename the navigation menu option to something like ‘Sign in or Register’ or ‘My Account’.

Don’t forget to save your changes and preview your website.

You can quickly see what it looks like for logged-out visitors by opening a new browser tab in incognito mode.

The account page link will appear at the top.

Clicking on it will take users to account registration page where they can apply to become a vendor on your website.

Managing Your Multi Vendor Ecommerce Store

Once users sign up as a vendor, they may be automatically approved, or you’ll need to manually approve them, depending on which option you choose during the set up wizard.

If you need to manually approve them, then simply go to the Users page in WordPress admin area and switch to the Pending Vendor tab.

From here you can approve or deny a vendor application.

After a vendor is approved, they will get a notification and be able to log into their account to manage their vendor store.

From their vendor dashboard, they can add new products to sell, as well as manage orders, store settings, and more.

For instance, your vendors can enter their payment information under the Settings tab.

When Vendors add new products, you’ll get an email notification.

You can then manually approve and publish a product or delete it.

Products on your shop pages will now appear with vendor names.

Users can click on a vendor name to browse more of their products.

Customizing Your Multi Vendor Ecommerce Website Design

WordPress comes with thousands of pre-made templates that you can use to get started. We have made a list of best WooCommerce themes that you can choose from.

Sometimes, you’ll find a theme that matches exactly what you need. However, in most cases, you would want to customize the look and feel of your brand.

In that case, you will need a WordPress page builder plugin like SeedProd. It’s a drag & drop website builder tool that allows you to create completely custom WordPress themes without writing any code.

It comes with pre-made WooCommerce blocks that you can use to customize your product page, cart pages, and every other page on your store.

For more details, see our step by step guide on how to create a custom WordPress theme without writing any code.

Growing Your Multi Vendor Ecommerce Website

Now that you have created a multi vendor eCommerce website, the next step is to promote your website, so that more sellers and customers can find it.

Our team of experts have created a comprehensive list of the best WooCommerce plugins that you need to grow you your online store.

Following are a few of our absolute favorites and must have tools that we recommend:

1. All in One SEO for WordPress – The best WordPress SEO plugin on the market that comes with built-in support for WooCommerce SEO. It’s used by over 3 million websites to rank higher in Google. There’s a free version that you can use as well if you’re on a budget.

2. MonsterInsights – It is the best Google Analytics plugin for WordPress that allows you to setup enhanced eCommerce tracking. This helps you track the performance of products so you can see what’s working on your site.

3. WP Mail SMTP – This helps fix the WordPress email deliverability issues to ensure important website emails like purchase receipts, user registration emails, etc always get delivered in the user’s inbox.

4. WPForms – The best WordPress form builder plugin on the market. It allows you to easily create all sorts of forms that you’ll need to promote and grow your multi-vendor store such as user survey, contact form, polls, etc. There’s also a free version that you can use as well.

5. OptinMonster – It is the #1 conversion optimization toolkit for WordPress. It helps you convert website visitors into leads and customers. You can use it to add special free shipping bars, seasonal promotions, spin a wheel gamifications, and more.

WordPress comes with over 59,000+ free plugins. This is why it’s the top choice for experts when building any type of website including multi-vendor eCommerce stores.

We hope this article helped you learn how to create a multi vendor eCommerce website. You may also want to see our ultimate conversion tracking guide, and our tips on converting abandoned cart sales in WooCommerce.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Make a Multi Vendor Ecommerce Website with WordPress first appeared on WPBeginner.

July 11, 2022 at 02:00PM

How to Add Taxonomy Images (Category Icons) in WordPress

Do you want to display taxonomy images or category icons in WordPress?

By default, WordPress does not come with an option to upload a taxonomy image or category icon. It simply just displays a category or taxonomy name on the archive pages.

In this article, we’ll show you how to easily add taxonomy images or category icons in WordPress. We’ll also show you how to display taxonomy images on your archive pages.

Why Add Taxonomy Images in WordPress?

By default, your WordPress website does not come with an option to add images for your taxonomies like categories and tags (or any other custom taxonomy).

It simply uses taxonomy names everywhere including the category archives or taxonomy archive pages.

This looks kind of plain and boring.

If you get a lot of search traffic to your taxonomy pages, then you may want to make them look more engaging.

The easiest way to make a page more interesting is by adding images. You can add taxonomy images or category icons to make these pages more user-friendly and engaging.

A good example of it is a site like NerdWallet that uses category icons in their header:

You can also use it create beautiful navigational sections on your homepage like Bankrate:

That being said, let’s take a look at how to easily add taxonomy images in WordPress.

Easily Add Taxonomy Images in WordPress

First thing you need to do is install and activate the Categories Images plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

Upon activation, you can simply go to the Posts » Categories page. You’ll notice the plugin will be showing a placeholder image for your existing categories.

To choose your own category icon, you need to click on the Edit link below a category.

On the Edit category page, scroll down to the bottom and you’ll find a form to upload your own taxonomy image.

Simply click on the ‘Upload/Add New Image’ button to upload the image you want to use for that particular category.

Don’t forget to click on the Add Category or Update button to save your changes.

Next, you can repeat the process to upload images for other category images. You can also upload images for your tags and any other taxonomies as well.

Now the problem is that after adding the images, if you visit a category page, then you won’t see your category image there.

To display it, you will need to edit your WordPress theme or child theme. If this is your first time editing WordPress files, then you may want to see our guide on how to copy and paste code in WordPress.

First, you will need to connect to your WordPress site using an FTP client or your WordPress hosting file manager.

Once connected, you will need to find the template responsible for displaying your taxonomy archives. This could be archives.php, category.php, tag.php, or taxonomy.php files.

For more details, see our guide on how to find which files to edit in a WordPress theme.

Once you have found the file, you’ll need to download it to your computer and open in a text editor like Notepad or TextEdit.

Now paste the following code where you want to display your taxonomy image. Usually, you would want to add it before the taxonomy title or the_archive_title() tag.

<?php if( is_category() ) { ?> 
<div class="taxonomy-image">
<img class="taxonomy-img" src="<?php if (function_exists('z_taxonomy_image_url')) echo z_taxonomy_image_url(); ?>"  alt="" / >
</div>
<?php 
} else {  
//do nothing
} 
?>

After adding the code, you need to save this file and upload it back to your website using FTP.

You can now visit the taxonomy archive page to see it display your taxonomy image. Here is how it looked on our demo archive page.

Now, it may still look a bit awkward, but don’t worry. You can style that using a little bit of custom CSS.

Here is the custom CSS we used for the taxonomy image.

img.taxonomy-img {
    float: left;
    max-height: 100px;
    max-width: 100px;
    display: inline-block;
}

Depending on your theme, you may also need to style surrounding elements like taxonomy title and description.

We simply wrapped our taxonomy archive title and description in a <div> element and added a custom CSS class. We then used the following CSS code to adjust title and description.

.taxonomy-title-description {
    display: inline-block;
    padding: 18px;
}

Here is how it looked afterward on our test website.

Exclude Taxonomies from Displaying Taxonomy Images

Now some users may only want to use taxonomy images for specific taxonomies.

For instance, if you run an online store using WooCommerce, then you may want to exclude product categories.

Simply go back to the Categories Images page in WordPress admin area and check the taxonomies you want to exclude.

Don’t forget to click on the Save Changes button to store your settings.

We hope this article helped you learn how to easily add taxonomy images in WordPress. You may also want to see these useful category hacks and plugins for WordPress or see our tips on getting more traffic from search engines.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Taxonomy Images (Category Icons) in WordPress first appeared on WPBeginner.

July 10, 2022 at 07:02PM

How to Add Old Post Notification on Your WordPress Blog

Do you want to add an old post notification in WordPress?

If you have been producing content for some time now, then there is a chance that some of your content may be outdated.

In this article, we’ll show you how to easily add old post notification to your WordPress blog.

Why Add Old Post Notification to WordPress Blog Posts

Content decay (outdated blog posts) can be a bit of a problem for a growing WordPress blogs.

Depending on your niche, sometimes your content may become irrelevant, incorrect, or inappropriate over a period of time. This may cause a bad user experience, a higher bounce rate, and lower search rankings.

Ideally, you would want to edit those articles and update them with more useful, accurate, and up-to-date information.

But that’s not always possible because your site may have too many old articles, and you may not have enough resources to update them. In that case, adding an old post notification may be helpful for your users.

It will let them know that the content is a bit older, and they should keep this in mind when using the information presented on that page.

Another solution that many blogs use is by simply adding the ‘Last updated date’ instead of the publishing date.

That being said, let’s take a look at how you can add the old post notification in WordPress, and how to display the last updated date on your articles.

• Method 1. Display Old Post Notification Using a Plugin
• Method 2. Display Last Updated Date in WordPress
• Method 3. Display Old Post Notification without Plugin (Code Method)

Method 1. Display Old Post Notification Using Plugin

This method is easier and recommended for all users that want to display an old post notification.

First, you need to install and activate the DX Out of Date plugin. For more details, see our step-by-step guide on how to install a WordPress plugin.

Upon activation, you need to visit the Settings » Out of Date page to configure plugin settings.

Here, you need to choose the period and duration. This is the time after which a post will be considered old by the plugin.

Below that you can provide a custom message to display on older posts and enable the notification to be displayed for all old posts. Don’t worry, you’ll be able to hide it for specific posts by editing them.

On the settings page, you can also choose post types, colors for the notification box, and add custom CSS if needed.

Don’t forget to click on the Save Changes button to store your settings.

You can now visit an old post on your website to see the plugin in action.

Hiding Old Post Notification on Individual Posts

Now let’s say you have an article that is older, but it is still accurate, up-to-date, and has great search rankings. You may want to hide the old post notification there.

Similarly, what if you have updated an old post with new information. The plugin will keep showing old post notification because it uses the post’s published date to determine its age.

To fix this, you can edit the post and scroll down to the ‘Out of Date Notification’ tab under the Post panel of the block editor. From here, simply uncheck the notification option and save your changes.

The plugin will now stop showing old post notification on this particular article.

Method 2. Display Last Modified Date for Your Posts

A lot of WordPress websites display the last modified date for their blog posts. Some replace the publish date with the last modified date as well.

The advantage of this method is that it shows users when a post was last updated without showing an old post message.

First, you need to install and activate the WP Last Modified Info plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, head over to Settings » WP Last Modified Info page to configure plugin settings.

On the settings page, you need to turn on the Global display of the last modified info toggle. After that, you can choose how you want to display the modified date.

You can replace the published date, show it before or after the content, or manually insert it into a post.

Below that, you’ll find a bunch of options. If you are unsure, then you can leave them to default.

Don’t forget to click on the Save Settings button to store your changes.

You can now visit your website to see the last updated information for all your blog posts.

This problem with this method is that it will show the last updated date for all posts including the newer posts.

You can set a time gap under plugin settings. But this gap is only limited to 30 days.

The plugin also provides three blocks that you can manually insert into a post or page to display last modified info.

You also have the option to use custom CSS to style your last updated date notice. We used the following custom CSS in the screenshots above.

p.post-modified-info {
    background: #fbffd8;
    padding: 10px;
    border: 1px solid orange;
    font-size: small;
    font-weight: bold;
}

Method 3. Add Old Post Notification Using Code

This method requires you to manually add code to your WordPress theme files. If you haven’t done this before, then take a look at our guide on how to add custom code snippets in WordPress.

Simply copy and paste the following code in your theme’s single.php template.

// Define old post duration to one year
$time_defined_as_old = 60*60*24*365; 

// Check to see if a post is older than a year
if((date('U')-get_the_time('U')) > $time_defined_as_old) {

$lastmodified = get_the_modified_time('U');
$posted = get_the_time('U');

//check if the post was updated after being published
 if ($lastmodified > $posted) {
 
// Display last updated notice
      echo '<p class="old-article-notice">This article was last updated ' . human_time_diff($lastmodified,current_time('U')) . ' ago</p>';   

  } else { 
// Display last published notice 
echo '<p class="old-article-notice">This article was published ' . human_time_diff($posted,current_time( 'U' )). 'ago</p>';

}
}

This code defines old posts to be any articles published at least one year ago.

After that, it checks if a post is older than a year. If it is, then it checks if the post was updated after publication. Then it displays a notice based on those checks.

Here is how it looked on our demo website for post that is old and was never updated.

Here is how it looked for a post that is old, but it was updated after being published.

We customized the old post notification with the following custom CSS.

p.old-article-notice {
    background: #fbffd8;
    padding: 10px;
    border: 1px solid orange;
    font-size: small;
    font-weight: bold;
}

We hope this article helped you learn how to easily display old post notification on your WordPress blog. You may also want to see our WordPress SEO guide or see our pick of the best popular posts plugins for WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Add Old Post Notification on Your WordPress Blog first appeared on WPBeginner.

July 09, 2022 at 03:00PM