Woostify Tutorial: Build a Professional WooCommerce Store for Free

video thumbnail for 'Woostify Tutorial ONLINE STORE: How to Create an eCommerce Website with WordPress'

I’ll walk you through creating a modern, conversion-ready online store using Woostify, WordPress, and a set of free tools. This guide covers hosting and domain choices, WordPress setup, the Woostify theme, essential plugins, product creation, shipping and payments, and a simple Elementor homepage that looks great on mobile.

Table of Contents

Step 1: Choose hosting and register your domain

Pick a reliable host and a domain name you want to keep long term. I recommend picking a plan that includes a staging site so you can make changes safely without affecting live traffic. On SiteGround, the GrowBig plan is the sweet spot because it supports multiple sites and includes staging.

SiteGround 'Pick A Domain And Get Online' page with domain search box and illustration
Type your desired domain into the search box and click Search to check availability.

Key choices:

  • Data center – choose the location closest to your customers for better speed.
  • Billing term – annual plans often have discounts; monthly plans are fine while testing.
  • Domain – pick something memorable; domains are essentially permanent unless you buy a new one.

Step 2: Install WordPress via your host tools

Use your host’s control panel to install WordPress (SiteGround Tools > Install and Manage WordPress is a common example). Make sure WordPress installs in the main folder (not a subfolder) and create a strong admin username and password.

SiteGround Install & Manage WordPress screen showing WordPress and WordPress + WooCommerce install options with Select buttons
Choose the WordPress installer or WordPress + WooCommerce option to install your site.

Step 3: Configure WordPress basics

Before adding a theme or plugins, set up these essentials:

  • Settings → General: site title, tagline, admin email, and membership (enable “Anyone can register” if you want accounts).
  • Settings → Permalinks: set to Post name for SEO-friendly URLs.
  • Remove default content and unused plugins or themes to keep the dashboard tidy.

Step 4: Install the Woostify theme

Woostify is optimized for WooCommerce, lightweight, and integrates with Elementor. Install the free Woostify theme by downloading the zip and uploading it to Appearance → Themes → Add New → Upload Theme. Then activate it.

Woostify homepage hero reading 'Free WooCommerce Themes for Boosting Sales' with a prominent 'Get Woostify Free' button
Woostify homepage hero with headline and download CTA.

Step 5: Install the essential plugins

Install and activate these free plugins from Plugins → Add New:

  • Elementor – page builder (free version is enough to start).
  • Flow Forms – easy drag-and-drop contact forms.
  • TI WooCommerce Wishlist – customer wishlists.
  • WooCommerce – the core e-commerce plugin.
  • Stripe Payment Gateway – accept card payments via Stripe.
WordPress Add Plugins results showing Elementor Website Builder with Install Now button
Install the Elementor Website Builder plugin from the Add Plugins screen.

Step 6: Configure the wishlist and WooCommerce initial setup

Run the wishlist setup wizard and choose sensible defaults: create the wishlist page automatically, place the wishlist button after add-to-cart, and enable sharing if you want social reach.

TI Wishlist page setup showing the 'My Wishlist' dropdown with 'Create Automatically' selected
Select ‘Create Automatically’ to let the plugin create the wishlist page for you.

Then run the WooCommerce setup (start selling). For a basic store I skip most optional add-ons and keep the active theme chosen by Woostify. Fill in your address, industry, product types, and whether you sell elsewhere.

Step 7: Fine-tune WooCommerce settings

Open WooCommerce → Settings and walk through each tab. Key items:

  • General: set selling countries, currency, and enable taxes if you need them.
  • Products: keep “Redirect to cart after successful addition” unchecked so customers can add multiple items; set dimensions and enable reviews.
  • Inventory: enable stock management and set thresholds.
  • Emails: add a branded image to email templates by uploading a media file and copying its URL into WooCommerce email settings.
WooCommerce settings — General tab showing selling location, shipping location, default customer location and the 'Enable taxes' checkbox.
I set selling/shipping locations and enable taxes from the General tab.

Step 8: Add tax rates and shipping logic

Create tax rates (for example, a California rate) in WooCommerce → Settings → Tax. Add rows for country and state codes and set the tax percentage. Save changes.

Shipping zones require a little formula work when you want per-item shipping. If your flat rate is $3 per item, enter the cost as:

3 * [qty]

That syntax charges $3 for each quantity added. Use shipping classes to handle items with different shipping weights, for example shoe and shirt, and add class-specific costs if needed.

WooCommerce Shipping zones page showing example text: 'Local zone = California ZIP 90210 = Local pickup' and 'US domestic zone = All US states = Flat rate shipping'
Example shipping-zone descriptions (local California ZIP and US domestic flat rate).

Step 9: Set up Stripe for payments

Enable Stripe in WooCommerce → Settings → Payments. For production, always use live keys. To configure webhooks, copy the webhook endpoint from your WooCommerce Stripe settings into your Stripe dashboard, select charge events, and add the endpoint. Then copy the webhook secret back into WooCommerce and save.

WooCommerce admin modal titled 'Edit test account keys & webhooks' with fields for test publishable key, test secret key and instructions showing the webhook endpoint URL.
WooCommerce Stripe settings — enter test publishable & secret keys and webhook endpoint.

Step 10: Create products — simple and variable

Products are where the store comes alive. Two types you’ll use most:

  • Simple product — single SKU, single price. Fill title, description, regular and sale price, inventory, shipping weight, and product image(s). Assign a product category and publish.
  • Variable product — multiple options such as size or color. Under Product data choose Variable product, add attributes (for example “Type” with values separated by a pipe: shoe | cap), save attributes, then create variations from all attributes. Set price, SKU, stock, weight, and a specific image per variation.
WordPress Add New Product admin screen showing the product title field, content editor and the Publish panel
Add New Product screen — where you enter title, description and publish product settings.

Step 11: Test checkout and manage orders

Place a test order (use Stripe test cards if in test mode). The checkout will show shipping and tax calculations and payment method. After a successful order, check WooCommerce → Orders to see status updates, fees, and payouts. Mark orders completed only after shipping.

WooCommerce checkout page with billing fields on the left and order summary on the right showing Subtotal $20, Shipping $3.00, CA Tax $2.00 and Total $25.00
Checkout page showing order summary with shipping, CA tax and total — ready for a test order.

Step 12: Build a homepage with Elementor and Woostify

Create a new page called “Home,” set the page layout to full-width, and publish. Then edit with Elementor. Use sections and inner sections to build a hero, category tiles, featured products (via WooCommerce shortcodes), trust icons, and an Instagram-style gallery.

Elementor editor open on a WordPress site with the widget library on the left and a blank hero section on the page displaying 'Drag widget here'.
Edit the Home page with Elementor — drag sections, headings and product widgets into the canvas.

Tips for a fast, mobile-friendly homepage:

  • Use local fonts where possible to improve performance.
  • Keep hero images centered and set background size to cover.
  • Optimize tablet and mobile typography using Elementor’s responsive controls.
  • Use Woostify widgets for product lists, sales, and countdowns when available.

Create your primary navigation under Appearance → Menus and assign it as the Primary Menu. For the shop sidebar, use Appearance → Widgets and add WooCommerce widgets such as Product Search, Product Categories, Filter by Price, and Product Filters.

Build footer widgets using navigation menus and blocks in the widget area for copyright, social icons, newsletter signup (connect to your email provider later), and quick links.

Step 14: Marketing basics

Getting traffic is the next step. Practical channels:

  • Google Merchant Center — connect your product feed for Shopping ads and listings.
  • Content marketing — use a blog to rank for product-related searches and answer customer questions.
  • Social platforms — TikTok, Instagram, and Pinterest are excellent for product discovery.
  • Email — capture emails with Flow Forms or a dedicated marketing plugin and send targeted campaigns.

If you need help with setup or ongoing marketing, consider hiring an expert to build and scale the store.

Frequently asked questions

Do I have to pay for Woostify to get a professional store?

No. The free Woostify theme plus free plugins like WooCommerce and Elementor allow you to build a professional store. Paid Woostify addons and Elementor Pro unlock additional widgets and templates but are optional for a solid launch.

Which WooCommerce settings are most important for beginners?

Set your currency, selling locations, tax settings, and shipping zones first. Enable stock management if you track inventory, and choose post-name permalinks for SEO. Keep checkout steps minimal to reduce abandonment.

How do I charge shipping per item rather than per order?

Use the flat-rate cost formula in WooCommerce shipping method: for $3 per item enter 3 * [qty] as the cost. Use shipping classes for items with different weights or handling fees.

Can I test payments before going live?

Yes. Stripe provides test keys and test cards. Configure Stripe in test mode, validate orders, webhooks, and refund flows, then switch to live keys before launch.

Is Elementor required to use Woostify?

Elementor is not strictly required but it integrates tightly with Woostify and makes building custom pages much faster. The free Elementor version is sufficient for most homepage and landing-page builds.

What’s the simplest way to display new products on the homepage?

Use the WooCommerce shortcode for newest products: [products limit=”4″ columns=”4″ orderby=”date” order=”DESC”] or use Woostify/Elementor product widgets to show new arrivals dynamically.