I Built a Chrome Extension to Solve My Alibaba Import Problem (And You Can Too)

Nasratul Nayem — Mon, 24 Aug 2026 19:37:06 +0000

I was spending 2+ hours per product importing from Alibaba to WooCommerce. For 50 products? That's 100+ hours.

I tried everything:

Manual copy-paste (too slow, too many errors)
CSV imports (images never import correctly)
Various plugins (expensive, limited)
Virtual assistants (expensive, still makes mistakes)

After burning $2,000+ on failed methods, I decided to build my own solution.

What I Built

A Chrome extension + WordPress plugin that captures product data from Alibaba and imports it to WooCommerce in one click.

Here's what it does:

Chrome Extension — captures product data from any Alibaba page
WordPress Plugin — receives data, stores in queue, imports to WooCommerce
AI Rewriting — generates SEO titles and descriptions
Batch Processing — imports 100+ products at once

The Tech Stack

Chrome Extension (Manifest V3)

// content.js — captures product data from Alibaba page
function captureProduct() {
  const product = {
    title: document.querySelector('.title-text')?.innerText,
    price: document.querySelector('.price-text')?.innerText,
    images: [...document.querySelectorAll('.image-slide img')].map(img => img.src),
    description: document.querySelector('.description-text')?.innerText,
    variations: captureVariations()
  };

  // Send to WordPress plugin via API
  chrome.runtime.sendMessage({
    action: 'importProduct',
    data: product
  });
}

function captureVariations() {
  const variations = [];
  document.querySelectorAll('.sku-item').forEach(item => {
    variations.push({
      name: item.querySelector('.sku-name')?.innerText,
      price: item.querySelector('.sku-price')?.innerText,
      image: item.querySelector('.sku-image')?.src
    });
  });
  return variations;
}

WordPress Plugin (PHP + React)

// class-importon-bridge.php — handles product import
class Importon_Bridge {
    private $api_url = 'https://your-api.com/wp-json/importon-bridge/v1';

    public function import_product($product_data) {
        // Create WooCommerce product
        $product = new WC_Product_Simple();
        $product->set_name($product_data['title']);
        $product->set_regular_price($product_data['price']);
        $product->set_description($product_data['description']);
        $product->set_short_description($this->generate_short_description($product_data));

        // Download and attach images
        $image_ids = $this->download_images($product_data['images']);
        $product->set_image_id($image_ids[0]);
        $product->set_gallery_image_ids(array_slice($image_ids, 1));

        // Save product
        $product_id = $product->save();

        // Add variations
        if (!empty($product_data['variations'])) {
            $this->add_variations($product_id, $product_data['variations']);
        }

        return $product_id;
    }

    private function download_images($image_urls) {
        $image_ids = [];
        foreach ($image_urls as $url) {
            $image_id = media_sideload_image($url, 0);
            if (!is_wp_error($image_id)) {
                $image_ids[] = $image_id;
            }
        }
        return $image_ids;
    }
}

AI Content Rewriting

// ai-rewriter.js — generates SEO content
async function rewriteContent(productData) {
  const prompt = `Rewrite this product title for SEO: "${productData.title}". 
  Make it keyword-rich, under 60 characters, and optimized for WooCommerce.`;

  const response = await fetch('https://api.openai.com/v1/chat/completions', {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${OPENAI_API_KEY}`,
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      model: 'gpt-4',
      messages: [{ role: 'user', content: prompt }]
    })
  });

  const data = await response.json();
  return data.choices[0].message.content;
}

The Queue System

For batch imports, I built a custom queue:

// queue-manager.php — handles batch processing
class Queue_Manager {
    private $queue = [];
    private $batch_size = 10;

    public function add_to_queue($product_data) {
        $this->queue[] = $product_data;

        if (count($this->queue) >= $this->batch_size) {
            $this->process_batch();
        }
    }

    public function process_batch() {
        foreach ($this->queue as $product_data) {
            $this->import_product($product_data);

            // Update progress in UI
            $this->update_progress();

            // Rate limiting — don't overload the server
            sleep(1);
        }

        $this->queue = [];
    }
}

Results

Before:

2+ hours per product
High error rate (manual copy-paste)
Not scalable

After:

10 minutes for 100 products
Near-zero error rate
Fully automated

What I Learned

Chrome Extensions are powerful — they can interact with any webpage
WordPress hooks are flexible — you can customize almost anything
AI content generation works — but needs human review
Queue systems prevent crashes — don't import everything at once
User experience matters — a simple UI makes complex tasks easy

What's Next?

Bulk editing capabilities
Price monitoring and alerts
Supplier comparison features
Integration with more platforms (Amazon, Shopify)

Thanks for reading! If you have questions about the tech stack or the development process, feel free to ask in the comments.

P.S. — I'm a WordPress developer available for hire. If you need custom plugins, WooCommerce customization, or API integrations, let me know.

DEV Community: Nasratul Nayem