如何用WP手搓一个POD站

 <script>document.addEventListener('DOMContentLoaded', function() {    const canvas = document.getElementById('hoodiePreview');    const ctx = canvas.getContext('2d');    const colorSelect = document.getElementById('hoodieColor');    const uploadStatus = document.getElementById('uploadStatus');
    let templateImage = new Image();    let userImage = new Image();    let userImageUploaded = false;
    //      function loadTemplate() {        templateImage.src = `/uploads/hoodie-template-${colorSelect.value}.jpg`;        templateImage.onload = drawCanvas;    }    colorSelect.addEventListener('change', loadTemplate);
    //      document.getElementById('customImage').addEventListener('change', function() {        const file = this.files[0];        if (!file) return;
        if (file.size > 5*1024*1024) {             alert("Image too large! Max 5MB.");             return;         }
        uploadStatus.style.color = 'blue';        uploadStatus.textContent = 'Uploading...';
        const reader = new FileReader();        reader.onload = function(e) {            userImage.src = e.target.result;            userImage.onload = function() {                drawCanvas();                userImageUploaded = true;                uploadStatus.style.color = 'green';                uploadStatus.textContent = 'Image loaded successfully!';            };        };        reader.readAsDataURL(file);    });
    //   Canvas    function drawCanvas() {        if (!templateImage.complete) return;
        ctx.clearRect(0, 0, canvas.width, canvas.height);        ctx.drawImage(templateImage, 0, 0, canvas.width, canvas.height);
        if (userImage.src) {            const x = 110, y = 130, w = 126, h = 126;            ctx.drawImage(userImage, x, y, w, h);        }    }
    // Add to Cart & Checkout     document.getElementById('customAddToCart').addEventListener('click', function() {    if (!userImageUploaded) {        alert("Please upload your image first.");        return;    }
    const color = document.getElementById('hoodieColor').value;    const size = document.getElementById('hoodieSize').value;    const finalImage = canvas.toDataURL('image/png');
    fetch('<?php echo admin_url("admin-ajax.php"); ?>', {        method: 'POST',        body: new URLSearchParams({            action: 'add_custom_hoodie_to_cart',            product_id: 12345,            color: color,            size: size,            image_data: finalImage        })    }).then(res => res.json())      .then(data => {          if(data.success){              window.location.href = data.data.checkout_url;          } else {              alert('Failed to add to cart: '+data.data.message);          }      }).catch(err => alert('AJAX error'));});
    //      loadTemplate();});</script>