Hire the author: Moses N
Image source: Wp-DaVinci
Get the complete project from GitHub
Introduction
In this tutorial, I am going to show you how to create a WordPress e-commerce website using Davinci woo-commerce theme. You might be asking yourself why WordPress? Why not use Drupal or Joomla? Nevertheless, we choose WordPress because WordPress is the most popular website platform in the world. It powers nearly 28% of all websites on the internet. WordPress is free and comes with thousands of website designs and extensions. It is extremely flexible and works with almost every third-party tool and service available to website owners. Sounds cool to know you are in the right direction? Let’s go ahead and list the things we will be tackling in this blog.
- Installing WordPress In your local machine
- Installing a software with MySQL database.
- Creating WordPress database
- Installing all the required plugins.
- Uploading Images.
- Customizing woo-commerce plugin and product plugin.
- Customizing the website.
With that said, I believe we are in the right direction.
Photo Preview
Glossary
- WordPress – WordPress is a free and open-source content management system written in PHP and paired with a MySQL or MariaDB database
- E-commerce (electronic commerce)-is the activity of electronically buying or selling of products on online services or over the Internet
- woo-Commerce– is an open-source e-commerce plugin for WordPress. It is designed for small to large-sized online merchants using WordPress
- Joomla – Joomla is a free and open-source content management system for publishing web content, developed by Open Source Matters, Inc. It is built on a model–view–controller web application framework that can be used independently of the Content Management System
- Drupal –Drupal is a free and open-source web content management framework written in PHP and distributed under the GNU General Public License. Drupal provides a back-end framework for at least 2.3% of all websites worldwide
In conclusion, I believe we are on the same page now. Therefore, let’s take our time to talk about the Project Requirement for the Davinci woo-commerce WordPress e-commerce website.
Project requirements for Davinci woo-commerce WordPress e-commerce website
- WordPress – we will be installing WordPress on our local machine, hence we will need to download it from here.
- Xampp/Wamp – these are free and open-source cross-platform web server solution stack package developed by Apache Friends. They have MySQL database in them. We will be using one of them as our database.
Download Wamp from here, alternatively you can download Xampp from here also. - Internet – we will require internet connectivity for updating our plugins and installing Davinci woo them child theme.
- Git – This is kinda optional but I still recommend having git installed. This will prove useful if you ever want to deploy your code or push to a remote repository. You can download and install git through Git.
- Browser – This will be used to load our website. There are a variety of browsers such a Firefox, chrome, edge, slim-jet, etc. You can choose to use your most favorite.
So far so good, we are doing quite well, let’s dig in more.
Step by step procedure for Davinci woo-commerce WordPress e-commerce website.
Step 1: Installing WordPress in your local machine.
Firstly, after downloading the WordPress you will realize it comes as a zip file. In order for it to work in your machine, we will have to change the path of WordPress. Unzip the file and copy its files to this location on your machine.
- For Wamp
C:\wamp64\www\fashionDesign- For Xampp
C:\Xampp\htdocs\fashionDesignSecondly lets now load our website in the browser.
- Open your browser and type
http://localhost/ or http://127.0.0.1/Then select your WordPress folder. You can rename it to match the website you are creating. In our case, let’s name it “e-commerce”.pon loading your website you will get the WordPress installation phase as shown below;
Click continue, then click on let’s go.
Step 2:Creating database
With that done, on your browser type.
http://localhost/phpmyadmin/Create a new database then on your WordPress fill in the details as shown in the screenshot below. Submit and continue with the installation.
Step 3: Installing themes and plugins
To install the required plugins:
- Click on plugins.
- Add a new plugin or upload it if you have already downloaded it.
In our case install the following plugins and themes:
- woo-commerce
- products
- Davinci woo theme
Mostly you will get the following error while trying to upload large files. “The uploaded file exceeds the upload_max_filesize directive in php.ini.” Nevertheless, this should not worry you, just locate the following lines in your php.ini file to look like this:
After installing all plugin and themes, remember to activate them. Visit your website and it should look as shown below.
Step 4: Customizing Davinci woo-commerce WordPress e-commerce website
This stage mostly depends on the developer’s creativity, depending on how you wish your website to look like all the editing tools are available on the left menu bar. You can edit the header, footer, menus, color and also add additional CSS to make your website look more attractive.
Products plugin
It allows you to add, edit, trash, and set the product prices. It’s through this plugin one is able to upload new products, give their descriptions and Name. You can also edit the price of products and show the discount percentage.
Woo-commerce plugin
Woo-Commerce is a plugin that integrates easily with your existing WordPress site, turning your site into a fully functional WordPress e-commerce website with just a few clicks. We will be using woo-commerce in our case to manage orders. We will also be checking the progress of a product that is from pending payment, processing, completed, and canceled. It’s via this plugin we are able to verify coupons and also generate reports.
In conclusion, this brings to our end of “How to create a WordPress e-commerce website using the Davinci woo-commerce theme”. With all tools installed and working you can play around them to discover more things, you can do.
Reflective Analysis
Davinci woo-commerce WordPress e-commerce website did not involve much coding, but I was still able to gain some deeper insights into WordPress. Working with plugins and templates rather than coding the whole website from scratch.
Future Directions
Most applications that are been created on this generation generate the code from back-end as you use the Graphical User Interface. Content Management Systems use Gui through plugins and themes.
The future direction of this project include:
- Adding method of payment like pay via pay-pal account.
- We can also create registration forms to capture new users.
Learning Strategies and Tools
There are a lot of learning tools online, I would recommend using some youtube tutorials and also doing some WordPress courses on Udemy.
While doing research for this project, I started off with trying to understand what WordPress is and the advantages over other content management systems. I started off by developing a simple WordPress website online and then went further to localhost.
It took me a total of 7 hours to finish the project and the blog.
Get the complete project from GitHub