WooCommerce 是一个流行的 WordPress 插件,用于创建和管理在线商店。注册表单是用户在网站上注册时填写的表单。添加图片上传功能到 WooCommerce 注册表单允许用户在注册时上传个人头像或其他图片。
<!-- 在 WooCommerce 注册表单中添加文件上传字段 -->
<form id="register_form">
<!-- 其他表单字段 -->
<input type="file" id="avatar_upload" name="avatar_upload" accept="image/*">
<button type="submit">注册</button>
</form>
<script>
document.getElementById('register_form').addEventListener('submit', function(event) {
event.preventDefault();
const formData = new FormData(this);
fetch('/wp-json/wc/v3/customers', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
console.log('Success:', data);
})
.catch((error) => {
console.error('Error:', error);
});
});
</script>
add_action('woocommerce_created_customer', 'save_avatar_on_registration', 10, 3);
function save_avatar_on_registration($customer_id, $new_customer_data, $password_generated) {
if (isset($_FILES['avatar_upload'])) {
$file = $_FILES['avatar_upload'];
$upload_overrides = array( 'test_form' => false );
$movefile = wp_handle_upload($file, $upload_overrides);
if ($movefile && !isset($movefile['error'])) {
update_user_meta($customer_id, 'avatar_upload', $movefile['url']);
}
}
}
原因:
解决方法:
php.ini
文件中的 upload_max_filesize
和 post_max_size
设置。accept
属性设置正确,允许上传的文件类型。原因:
解决方法:
update_user_meta
函数正确执行,并且路径正确。通过以上步骤和代码示例,您可以成功地将图片上传功能添加到 WooCommerce 注册表单,并在管理后端显示上传的图片。
没有搜到相关的沙龙
领取专属 10元无门槛券
手把手带您无忧上云