Ecommerce Seo

E-commerce SEO

Overview

E-commerce SEO covers the technical and content foundations that help search engines understand and rank your product pages: meta tags, structured data (JSON-LD), canonical URLs, XML sitemaps, and Core Web Vitals. Shopify and WooCommerce handle most technical SEO automatically; your effort should focus on optimizing titles, descriptions, and structured data quality — not plumbing.

When to Use This Skill

• When building product pages that need to rank in Google Shopping and organic search
• When implementing JSON-LD structured data for rich snippets (price, availability, reviews)
• When handling canonical URLs for products with multiple variants or filter combinations
• When generating XML sitemaps for a large catalog (10K+ products)
• When diagnosing why products are not appearing in Google Shopping rich results

Core Instructions

Step 1: Check what your platform handles automatically

Before installing anything, understand what is already built in:

Step 2: Install an SEO foundation

---

Shopify

Shopify handles sitemaps, canonicals, and basic schema automatically. Focus on:

1. Install a SEO app for enhanced structured data and bulk editing:

• Yoast SEO for Shopify ($19/mo) — most comprehensive
• Schema Plus (free tier) — focused on JSON-LD structured data
• SEO Manager ($20/mo) — bulk meta editing + structured data

2. Go to Shopify Admin → Online Store → Preferences and verify:

• Your homepage title and meta description are set
• Google Analytics is connected

3. Go to each product's page in admin and fill in the SEO section at the bottom:

• Write unique meta titles following: [Brand] [Product Name] - [Key Attribute] | [Store Name]
• Write unique meta descriptions (150–160 characters) that include price range, key benefit, and a call to action

4. Submit your sitemap to Google Search Console: go to search.google.com/search-console → Sitemaps → Add yourstore.com/sitemap.xml

---

WooCommerce

1. Install Yoast SEO (free) or Rank Math (free) from the WordPress plugin directory — these are required for proper WooCommerce SEO 2. After installing Yoast SEO:

• Go to Yoast SEO → Search Appearance → WooCommerce and configure product page templates
• Enable JSON-LD structured data under Yoast SEO → Search Appearance → Schema
• Go to Yoast SEO → Tools → Bulk Editor to edit meta titles and descriptions for all products at once

3. For enhanced product schema (price, availability, reviews):

• Install Rank Math which includes WooCommerce Product Schema with review aggregation built in

4. Submit sitemap to Google Search Console: Yoast auto-generates /sitemap_index.xml

---

BigCommerce

1. BigCommerce includes basic SEO features built-in. Go to BigCommerce Admin → Products → [Edit Product] → SEO tab 2. For enhanced structured data: install SEO Expert from the BigCommerce App Marketplace 3. Go to Store Setup → Search Engine Optimization to configure global defaults 4. Submit your sitemap at yourstore.com/xmlsitemap.xml to Google Search Console

---

Custom / Headless

For headless storefronts, implement structured data manually. Serve JSON-LD on every product page:

function buildProductJsonLd(product: Product, reviews: ReviewSummary) {
  return {
    '@context': 'https://schema.org',
    '@type': 'Product',
    name: product.title,
    image: product.images.map(img => img.src),
    description: product.metaDescription || product.description.slice(0, 200),
    sku: product.variants[0]?.sku,
    brand: { '@type': 'Brand', name: product.vendor },
    offers: product.variants.length === 1
      ? {
          '@type': 'Offer',
          url: `https://yourstore.com/products/${product.slug}`,
          priceCurrency: 'USD',
          price: (product.variants[0].priceInCents / 100).toFixed(2),
          availability: product.variants[0].inventoryQuantity > 0
            ? 'https://schema.org/InStock'
            : 'https://schema.org/OutOfStock',
        }
      : {
          '@type': 'AggregateOffer',
          lowPrice: (Math.min(...product.variants.map(v => v.priceInCents)) / 100).toFixed(2),
          highPrice: (Math.max(...product.variants.map(v => v.priceInCents)) / 100).toFixed(2),
          priceCurrency: 'USD',
          offerCount: product.variants.length,
        },
    ...(reviews.count > 0 ? {
      aggregateRating: {
        '@type': 'AggregateRating',
        ratingValue: reviews.average.toFixed(1),
        reviewCount: reviews.count,
        bestRating: '5',
      },
    } : {}),
  };
}

For canonical URL handling on variant pages — strip variant parameters:

// Always use the base product URL as canonical
// /products/blue-widget?variant=123 → canonical: /products/blue-widget
function getCanonicalUrl(path: string): string {
  // Strip variant query parameters
  return `https://yourstore.com${path.split('?')[0]}`;
}

For large catalogs (10k+ products), use a sitemap index:

// Serve /sitemap.xml as a sitemap index pointing to paginated product sitemaps
// Each child sitemap: max 50,000 URLs
// Regenerate every 6 hours or on product publish/unpublish events

Step 3: Optimize product titles and descriptions

This is the highest-ROI SEO work. Follow these title formats:

• Product title format: [Brand] [Product Name] [Key Attribute] - [Store Name]
• Example: "Nike Air Max 90 White - Running Store"
• Meta description format: Include price range, key benefit, and CTA in 150–160 characters
• Example: "Shop Nike Air Max 90 from $120. Lightweight cushioning for daily runs. Free shipping on orders over $75. Shop now."

Common issues to fix:

• Duplicate meta titles across variants (fix: add variant-specific attributes to the title)
• Meta descriptions that are just the product description truncated (fix: write purposeful descriptions)
• Missing alt text on product images (fix: use [Product Name] - [Color/View] format)

Step 4: Handle technical SEO issues

Canonical URLs for filter pages:

• Collection pages with active filters (/collections/shoes?color=red) should use self-referencing canonicals
• Pages with sort order only (/collections/shoes?sort=price-asc) should canonical back to the unfiltered collection URL

In Shopify, this is handled automatically. In WooCommerce with Yoast, go to Yoast SEO → Search Appearance → Taxonomies and configure canonical behavior for filtered pages.

Robots.txt — block these paths:

• /cart and /checkout — not indexable
• /account and /search? — not indexable
• Collection filter combinations with 3+ active filters — use noindex, follow meta tag

In Shopify: Online Store → Themes → Edit Code → robots.txt.liquid In WooCommerce: Yoast SEO manages robots.txt automatically

Step 5: Verify with Google tools

1. Google Rich Results Test (search.google.com/test/rich-results): paste any product URL and verify structured data is correct 2. Google Search Console: check for structured data errors under Enhancements → Products 3. PageSpeed Insights: test Core Web Vitals — target LCP under 2.5 seconds, CLS under 0.1

Best Practices

• Write unique meta descriptions for every product — avoid duplicating the product title; include key attributes (size, material, price) that help click-through rate
• Compress and properly size product images — oversized images are the #1 cause of slow LCP scores; Shopify compresses automatically; WooCommerce use ShortPixel or Imagify plugin
• Use JSON-LD over microdata — easier to maintain and Google recommends it
• Set canonical URLs on every page — self-referencing canonicals prevent duplicate content from URL parameters
• Update sitemaps automatically — Shopify and WooCommerce + Yoast do this; for custom builds, regenerate on product publish/unpublish events
• Add image sitemaps — include product images with descriptive alt text for Google Image search traffic

Common Pitfalls

Related Skills

• @google-shopping-feed
• @google-ads-ecommerce
• @content-commerce
• @social-proof-widgets

URL Canonicalization and Crawl Control Library

Problem Description

A mid-sized outdoor apparel retailer has recently hired an SEO consultant who discovered two serious issues with their current storefront: Google is indexing thousands of near-duplicate pages generated by their faceted navigation (combinations of color, size, brand filters combined with sort orders and pagination), and some of their product variant pages are competing against each other in search results. The consultant has recommended a systematic approach to URL canonicalization and crawler directives as the first step to fixing their duplicate content problem.

The engineering team needs to build a utility module that can be integrated into their Node.js storefront backend. The module should handle three distinct concerns: determining the correct canonical URL for any given page request, generating the appropriate robots crawl directives for different page types, and producing a robots.txt file. The module will be called at render time by the server to inject the correct meta tags into each page's <head>.

Output Specification

Write the solution as a TypeScript module seo-utils.ts that exports the necessary functions.

Also create a demo.ts file that calls these functions with a variety of representative inputs and logs the results. The demo should cover at minimum:

• A product page URL with a variant parameter in the query string
• A collection page URL with multiple filter parameters including sort and page
• A collection page URL with only 1 filter parameter
• A paginated collection (page 1, page 2, and a middle page)
• A heavily filtered collection page with multiple concurrent filter facets applied
• A search results page
• A standard product page

Also output the generated robots.txt content to a file called robots.txt.

No build toolchain required — plain TypeScript files are fine. All outputs should be written to the working directory so they can be reviewed.

Product Page SEO Module

Problem Description

A fashion retailer is launching a new direct-to-consumer storefront. Their marketing team has been told by their SEO agency that product pages need to be "structured data ready" to qualify for Google Shopping rich results and achieve strong organic rankings before their Q3 launch. The engineering team has been asked to build a reusable TypeScript module that generates all SEO-relevant markup for a product page.

The module needs to support two product shapes: simple products (single option, one price) and configurable products (multiple variants with different prices). Reviews are stored separately and may or may not exist for every product. The agency flagged that a previous implementation had validation errors in Google Search Console because availability was set incorrectly and ratings appeared on products with no reviews.

Output Specification

Write the module as a single TypeScript file product-seo.ts. It should export the functions needed to produce the full SEO markup for a product page, including:

• Open Graph and standard HTML meta tags
• Machine-readable structured data markup for Google rich results, embeddable in an HTML page <head>

Also create a short demo.ts (or equivalent runnable script) that exercises the module with representative test data covering:

• A single-variant product with reviews
• A multi-variant product without reviews
• An out-of-stock product

The demo should print or log the generated outputs so the results can be inspected. No build toolchain is required — plain .ts files with type annotations are fine if the logic is clear.

Automated Sitemap Generation for Large Product Catalog

Problem Description

A home goods retailer has grown their online catalog to over 120,000 active product SKUs across 400+ collections. Their current sitemap is a single hand-maintained XML file that hasn't been updated in months and is causing Google Search Console to report that many new products are not being indexed. The SEO team has flagged this as a top priority before their upcoming product line launch.

The engineering team needs to build an automated sitemap generation script that can handle a catalog of this size and be run on a schedule. The script should produce all necessary sitemap files and ensure that search engines are notified when they are regenerated. Product images are also important for the business — they drive significant traffic through Google Image Search — so those should be represented in the sitemap too.

The team is working in a Node.js/TypeScript environment. They've noted that the existing code in their codebase uses a consistent pattern of storing prices in integer cents, and their product records include an updatedAt timestamp and an images array where each image has src and alt properties.

Output Specification

Write the solution as a TypeScript script regenerate-sitemaps.ts that, when run, generates the complete sitemap file set.

Since there is no live database available, use the following mock data module as a stand-in. Extract the file below before starting, then import it in your script.

The script should write output sitemap files to disk so they can be inspected.

Also write a brief sitemap-plan.md document (1 page) explaining the structure of the sitemap output, what files are created, how products are distributed across child sitemaps, and how the script should be integrated into a production workflow (e.g. when to trigger regeneration, how to schedule it).

=============== FILE: mock-db.ts =============== // Mock database module for sitemap generation // In production this would query a real database

export interface Product { id: number; slug: string; title: string; updatedAt: Date; images: { src: string; alt: string }[]; }

export interface Collection { slug: string; title: string; updatedAt: Date; }

// Simulate a catalog of 120,000 products split across pages export const db = { products: { async countActive(): Promise<number> { return 120000; }, async findActive(opts: { limit: number; offset: number }): Promise<Product[]> { const products: Product[] = []; const start = opts.offset + 1; const end = Math.min(opts.offset + opts.limit, 120000); for (let i = start; i <= end; i++) { products.push({ id: i, slug: product-${i}, title: Home Goods Item ${i}, updatedAt: new Date('2026-03-10T08:00:00Z'), images: [ { src: https://cdn.example.com/products/${i}/main.jpg, alt: i % 3 === 0 ? Home Goods Item ${i} - Front View : '', }, ], }); } return products; }, }, collections: { async findPublished(): Promise<Collection[]> { return Array.from({ length: 400 }, (_, i) => ({ slug: collection-${i + 1}, title: Collection ${i + 1}, updatedAt: new Date('2026-03-11T08:00:00Z'), })); }, }, };