🛒 How to Add a Product in WordPress with WooCommerce and Elementor

---

This guide explains how to add a new product to your WooCommerce store and customize its design using Elementor.

✅ Prerequisites

---

• WordPress installed
• WooCommerce plugin activated and configured (store settings, payments, shipping, etc.)
• Elementor plugin installed (for product page customization

Step 1: Log in to WordPress Dashboard

---

1. Visit https://yourdomain.com/wp-admin

Replace the Wordpress login URL with your actual loin URL.

1. Enter your login credentials
2. You’ll be redirected to the WordPress Dashboard

Step 2: Add a New Product

---

1. From the Dashboard menu, go to: Products -> Add New

1. Enter the Product Name

Step 3: Configure Product Data

---

As shown in the above screen capture, you will see the additional product details as follows:

• Product Data

  • Simple Product: For single items
  • Variable Product: For items with variations (e.g., color, size)

• General

  • Regular Price: Main price
  • Sale Price: Discounted price (optional)

• Inventory

  • SKU: Unique product code
  • Stock Management: Enable if you want to track stock

• Shipping

  • Weight, dimensions, and shipping class
• Linked Products Allows you to recommend and promote other products on your site.
  • Upsells: Products that are higher-end alternatives to the one being viewed.
  • Cross-sells: Products suggested in the cart page, usually complementary items.
• Attributes & Variations (for variable products)
  • Define options like color, size, storage

You will also see additional features in this panel. Review each option and enable them only if they are required for your product.

Step 4: Add Product Images

---

1. In the right sidebar:
   • Product Image: Upload the main product image
   • Product Gallery: Add multiple images (e.g., different angles)

Step 5: Set Categories & Tags

---

1. In the Product Categories box -> Choose or create a category (e.g., Smartphones, Laptops, Accessories)
2. Add relevant tags (e.g., iPhone, Apple, 256GB, 5G)

Step 6: Publish the Product

---

1. Double-check product details
2. Click Publish
3. The product is now live on your site

Step 7: Customize Product Page with Elementor

---

1. Go to Products -> All Products
2. Hover over your product -> Click Edit with Elementor
3. In Elementor:
   • Use WooCommerce widgets (Product Title, Price, Add to Cart, Reviews, etc.)
   • Add custom sections (Specifications, Features, FAQs)
   • Customize layout & design to match your branding

Step 8: Preview & Test

---

1. View the product page on the frontend
2. Check that:
   • Images display correctly
   • Add to Cart works
   • Pricing & stock show properly
   • Design looks consistent

Step 9: Optional Enhancements

---

• Add a FAQ or Specifications tab using Elementor widgets
• Optimize product images for faster loading
• Use Elementor templates for consistent product layouts

✅ You’ve now added and customized a product in WordPress using WooCommerce and Elementor. Repeat the same for another product you want to add.