Receber por email
← Voltar para o catálogo

wordpress-woocommerce-development

WooCommerce store development workflow covering store setup, payment integration, shipping configuration, customization, and WordPress 7.0 features: AI connectors, DataViews, and collaboration tools.

141estrelas
Atualizado há 4 meses

Ver no GitHub ↗ Licença: MIT

Como adicionar

/plugin marketplace add lingxling/awesome-skills-cn

O comando exato pode variar conforme o repositório. Confira o README no GitHub.

Para o autor da skill

Cole no README do seu repo

Mostra que sua skill está catalogada na Skillteca, gera backlink e tráfego rastreável.

[![Skillteca](https://www.skillteca.com.br/api/badge/wordpress-woocommerce-development/svg)](https://www.skillteca.com.br/skills/wordpress-woocommerce-development)

Alerta por categoria

Receba novas skills de Design e Frontend toda segunda

1 email curto, só com as skills novas de Design e Frontend. 4 minutos de leitura, sem spam, cancela com 1 clique.

Você confirma o email no primeiro envio. Sem spam. Cancela com 1 clique.

Ler descrição completa

WordPress WooCommerce Development Workflow

Overview

Specialized workflow for building WooCommerce stores including setup, payment gateway integration, shipping configuration, custom product types, store optimization, and WordPress 7.0 enhancements.

WordPress 7.0 + WooCommerce Features

  1. AI Integration
  2. Auto-generate product descriptions
  3. AI-powered customer service responses
  4. Product summary generation
  5. Marketing copy assistance
  1. DataViews for Orders
  2. Modern order management interfaces
  3. Enhanced filtering and sorting
  4. Activity layout for order history
  1. Real-Time Collaboration
  2. Collaborative order editing
  3. Team notes and communication
  4. Live inventory updates
  1. Admin Refresh
  2. Consistent WooCommerce admin styling
  3. View transitions between screens
  1. Abilities API
  2. AI-powered order processing
  3. Automated inventory management
  4. Smart shipping recommendations

When to Use This Workflow

Use this workflow when:

  • Setting up WooCommerce stores
  • Integrating payment gateways
  • Configuring shipping methods
  • Creating custom product types
  • Building subscription products
  • Implementing AI-powered features (WP 7.0)

Workflow Phases

Phase 1: Store Setup

Skills to Invoke

  • app-builder - Project scaffolding
  • wordpress-penetration-testing - WordPress patterns

Actions

  1. Install WooCommerce
  2. Run setup wizard
  3. Configure store settings
  4. Set up tax rules
  5. Configure currency
  6. Test with WordPress 7.0 admin

WordPress 7.0 + WooCommerce Setup

// Minimum requirements for WP 7.0 + WooCommerce
// Add to wp-config.php for collaboration settings
define('WP_COLLABORATION_MAX_USERS', 10);

// AI features are enabled by installing a provider plugin
// Install OpenAI, Anthropic, or Gemini connector from WordPress.org
// Then configure via Settings > Connectors in admin panel

Copy-Paste Prompts

Use @app-builder to set up WooCommerce store

Phase 2: Product Configuration

Skills to Invoke

  • wordpress-penetration-testing - WooCommerce patterns

Actions

  1. Create product categories
  2. Add product attributes
  3. Configure product types
  4. Set up variable products
  5. Add product images

AI-Powered Product Descriptions (WP 7.0)

// Auto-generate product descriptions with AI
add_action('woocommerce_new_product', 'generate_ai_description', 10, 2);

function generate_ai_product_description($product_id, $product) {
    if ($product->get_description()) {
        return; // Skip if description exists
    }
    
    // Check if AI client is available
    if (!function_exists('wp_ai_client_prompt')) {
        return;
    }
    
    $title = $product->get_name();
    $short_description = $product->get_short_description();
    
    $prompt = sprintf(
        'Write a compelling WooCommerce product description for "%s" that highlights key features and benefits. Make it SEO-friendly and persuasive.',
        $title
    );
    
    if ($short_description) {
        $prompt .= "\n\nShort description: " . $short_description;
    }
    
    $result = wp_ai_client_prompt($prompt);
    
    if (is_wp_error($result)) {
        return;
    }
    
    // Use temperature for consistent output
    $result->using_temperature(0.3);
    $description = $result->generate_text();
    
    if ($description && !is_wp_error($description)) {
        $product->set_description($description);
        $product->save();
    }
}

Copy-Paste Prompts

Use @wordpress-penetration-testing to configure WooCommerce products

Phase 3: Payment Integration

Skills to Invoke

  • payment-integration - Payment processing
  • stripe-integration - Stripe
  • paypal-integration - PayPal

Actions

  1. Choose payment gateways
  2. Configure Stripe
  3. Set up PayPal
  4. Add offline payments
  5. Test payment flows

WordPress 7.0 AI for Payments

// AI-powered fraud detection
// Note: This is a demonstration - implement proper fraud detection with multiple signals

// Use AI to analyze order for fraud indicators
function ai_check_order_fraud($order_id) {
    // Check if AI client is available
    if (!function_exists('wp_ai_client_prompt')) {
        return false; // Default to no suspicion if AI unavailable
    }
    
    $order = wc_get_order($order_id);
    if (!$order) {
        return false;
    }
    
    $prompt = sprintf(
        'Analyze this order for potential fraud. Order total: $%s. Shipping address: %s, %s. Billing: %s. Is this suspicious? Return only "suspicious" or "clean" without explanation.',
        $order->get_total(),
        $order->get_shipping_address_1(),
        $order->get_shipping_city(),
        $order->get_billing_email()
    );
    
    $result = wp_ai_client_prompt($prompt);
    
    if (is_wp_error($result)) {
        return false;
    }
    
    $result->using_temperature(0.1); // Low temp for consistent classification
    $analysis = $result->generate_text();
    
    return (strpos($analysis, 'suspicious') !== false);
}

Copy-Paste Prompts

Use @stripe-integration to integrate Stripe payments
Use @paypal-integration to integrate PayPal

Phase 4: Shipping Configuration

Skills to Invoke

  • wordpress-penetration-testing - WooCommerce shipping

Actions

  1. Set up shipping zones
  2. Configure shipping methods
  3. Add flat rate shipping
  4. Set up free shipping
  5. Integrate carriers

AI Shipping Recommendations (WP 7.0)

// AI-powered shipping recommendations
add_action('woocommerce_after_checkout_form', 'ai_shipping_recommendations');

function ai_shipping_recommendations($checkout) {
    // Check if AI client is available
    if (!function_exists('wp_ai_client_prompt')) {
        return;
    }
    
    $cart = WC()->cart;
    if ($cart->is_empty() || !$cart->get_cart_contents_weight()) {
        return;
    }
    
    $prompt = sprintf(
        'Based on this cart (total weight: %d kg, destination: %s), recommend the best shipping method from: free shipping (orders over $100), flat rate ($9.99), or express ($24.99). Consider delivery time and cost efficiency. Respond with just the recommended method name.',
        $cart->get_cart_contents_weight(),
        WC()->customer->get_shipping_country()
    );
    
    $result = wp_ai_client_prompt($prompt);
    
    if (is_wp_error($result)) {
        return;
    }
    
    $result->using_temperature(0.1); // Low temp for consistent recommendation
    $recommendation = $result->generate_text();
    
    if (strpos($recommendation, 'express') !== false) {
        wc_add_notice(esc_html__('AI Recommendation: Consider Express shipping for faster delivery!', 'woocommerce'), 'info');
    }
}

Copy-Paste Prompts

Use @wordpress-penetration-testing to configure shipping

Phase 5: Store Customization

Skills to Invoke

  • frontend-developer - Store customization
  • frontend-design - Store design

Actions

  1. Customize product pages
  2. Modify cart page
  3. Style checkout flow
  4. Create custom templates
  5. Add custom fields

WordPress 7.0 Template Customization

// Custom product template with WP 7.0 blocks
add_action('woocommerce_after_main_content', 'add_product_ai_chat');

function add_product_ai_chat() {
    if (!is_product()) return;
    
    global $product;
    ?>
    <div class="product-ai-assistant">
        <h3>AI Shopping Assistant</h3>
        <button id="ai-chat-toggle" type="button">Ask about this product</button>
        <div id="ai-chat-panel" style="display:none;">
            <div id="ai-chat-messages"></div>
            <input type="text" id="ai-chat-input" placeholder="Ask about sizing, materials, etc.">
        </div>
    </div>
    <script>
    document.getElementById('ai-chat-toggle').addEventListener('click', function() {
        const panel = document.getElementById('ai-chat-panel');
        panel.style.display = panel.style.display === 'none' ? 
Compartilhar X LinkedIn