I think you are struggling to find a comprehensive guide on how to create an e-commerce website with WooCommerce. No worries, I am here to help you. My name is Hassan, and I have 5 years of experience in this field. I have built numerous e-commerce websites with WooCommerce. Let’s create another one together:
Follow the step-by-step guidelines to create your online shop:
Step 0: Choose A Domain Name:
You are creating an e-commerce website, so you need a website name or domain name for your website. For example, amazon.com is the website name or domain name of the biggest e-commerce website in the world. So, Domain name is the name of your website. I think you understand what a domain is.
Now you have to select your domain name. For example, you can choose your domain as (elementordev.com).
Then you have to check if your domain name is available or not. There are many websites where you can check this, but I recommend you go to Hostinger.
Just type your domain name and click search.
If the domain name is unavailable, it will say (already taken).
If the domain name is available, it will say (Domain is Available).
So, you have now completed the first step. You have already selected your domain name and checked that it is available.
Step 1: Choose WordPress Hosting From Hostinger:
Once you have chosen your domain name, you need to purchase the best hosting for your website. I recommend Hostinger for purchasing hosting
Why Hostinger is Best Hosting For Get Started:
- Free .com Domain
- 100 GB SSD Storage
- 100 Websites
- Free Professional Email
- Super Fast Speed With LiteSpeed Server
- And Many More
Step 1.1:How to Purches Hostinger WordPress Hosting
Now, you have to choose between these two packages because they both support WooCommerce functionality. Click the “Add to Cart” button and proceed to the next page.
After clicking the “Add to Cart” button, you will land on this page (above image). Now, you have to select the period for which you want to purchase. It’s completely up to you. Just select either 12 Months or 24 Months.
1.2 Create your Hostinger account and complete the payment process.:
Fill up the form with your email address and password, or alternatively, click on the Google option. Follow the instructions in the above image.
After creating your account, proceed to the next step and select a payment method. You can pay with a credit card, PayPal, or Google Pay. Choose the payment method you prefer, fill up the payment form, and complete the purchase of Hostinger. Congratulations! You have now completed the payment process.
Step 2: Install WordPress with Few Clicks
After completing the payment process, you will be redirected to the Welcome page (above image). Click on the “Start Now” button and answer some basic questions.
After answering some basic questions, you will encounter the “Select a Platform” section. You have to choose WordPress. If you are not a beginner, you can select WooCommerce instead. However, I personally recommend selecting WordPress because you can install WooCommerce on your website manually later.
When you select WordPress, you will find two options below the selected section (follow the above image):
- Enter Administrator Email (this email will be used later to login to the WordPress Dashboard)
- Enter Administrator Password (this password will be used later to login to the WordPress Dashboard)
Then click the “Continue” button to proceed to the next step.
You will see this page (above image). This page asks what theme you want for your website. For now, we don’t need any theme for our e-commerce website. We will select it later from the WordPress dashboard. Just click “Skip”.
As previously mentioned, Hostinger provides a complimentary domain. Therefore, you should proceed to claim your free domain by selecting the corresponding free option.
I already explained in STEP 0 how to find your domain. I believe you have already selected your domain. Place your selected domain in the search field and search for it. If your domain is available after the search, then select it and click “Continue”.
We have just completed the Hostinger setup. Let’s finish the setup by clicking the “Finish Setup” button. After clicking this button, you will be redirected to the page shown below (image).
Simply click on Hostinger, and you will be redirected to the Hostinger Control Panel or HPanel.
Now, you can manage everything from here. Click on “Premium Web Hosting” to control your hosting. Click on “Websites” to manage, add, or remove websites. Additionally, you can check the “Emails” option to add a professional email.
Now, we need to start creating our e-commerce website. To do that, click on “Websites”, and then click on “Admin Panel”. Follow the above image for better understanding. When you click on “Admin Panel”, you will be redirected to the WordPress dashboard. Proceed to the next step and complete the basic WordPress setup.
Step 3: WordPress Basic Stepup With Best Practice
General Settings:
- Navigate to Settings > General.
- Set your Site Title and Tagline.
- Choose your preferred time zone and date/time formats.
- Optionally, set your site language and membership options.
- Save changes.
Change Theme to Astra
To perform basic settings, you need to change the WordPress theme. Follow the instructions in the image below:
- Navigate to the “Appearance” tab in the WordPress dashboard.
- Click on “Themes”.
- Select “Add New”.
- Browse through available themes or search for specific ones using keywords.
- Click on the desired theme.
- Click on “Install” and then “Activate” to apply the selected theme to your website
Set Permalinks to Post name
Permalink Structure:
- Go to Settings > Permalinks.
- Choose a permalink structure that is SEO-friendly, such as Post Name.
- Save changes.
- Just follow the below image instuction and set the Permalinks to post name.
Step 4: Add Woocommerce Plugin and Setup it
To add the WooCommerce plugin, you have to click on the “Plugins” option. Then, click on “Add New Plugin” and search for WooCommerce. Next, install and activate it. Follow the image instructions for better understanding.
After activating the WooCommerce plugin, you will find numerous options in your admin panel, along with some pages. Please follow the image for better understanding.
You will get the 5 option in your admin panel:
- Woocommerce
- Products – Use for add product
- Payments – Use for Receive Payments
- Analytics – Use for see the all analytics of your online store
- Marketing – Use for creating coupons and marketing
You will get 5 page in pages option:
- Cart
- Checkout
- My account
- Shop
- Refund and Retuns Policy
To understand all of these options, please read the WooCommerce documentation. Check Woocommerce documentation
Step 5: Create page and Menu
Now, assuming that you know how to add products to your website and you already understand what the cart, checkout, and My Account pages are for, it’s time to display these products on the front end of your website and design your website front. To do this, you need to create some pages.
To create a page, click on the “Pages” option, then select “Add New Page”. Give the page a name and publish it. Follow the image instructions for better understanding.
So now you have added some pages that you want to show on your website frontend
After that, we need to create a menu to display these pages on the website header. To do that, click on “Appearance”, then “Menu”. Give the menu a name, add your desired pages to the menu, set a menu location, and then save it. Follow the image instructions for better understanding.
After creating a menu, add your desired pages to it. Follow the image instructions:
Last Step : Finishing Touch
Now, visit your website. Your website is ready now, and all your products are available on the shop page. If you want to design your website’s front page, you can use the Elementor plugin for that purpose. You already know how to add plugins to a WordPress website. Simply search for Elementor, install, and activate it. Then, design your website’s homepage using the Elementor page builder. To learn how to design a page with Elementor, visit this link: Elementor Help Center
By the way, thank you for reading this article. I hope it will help you in creating your own online store.
