Головна/WordPress Fullstack/Блупринти/WooCommerce/Розробка кастомного методу доставки з інтеграцією карти та пунктів видачі (ПВЗ)
До карток розділу «WooCommerce»
WooCommerce(ТЗ 40 из 54)
ТЗ: Розробка кастомного методу доставки з інтеграцією карти та пунктів видачі (ПВЗ)
WooCommerce5 шагов • +25 XP

ТЗ: Розробка кастомного методу доставки з інтеграцією карти та пунктів видачі (ПВЗ)

Створення розширення доставки на базі WC_Shipping_Method: динамічний розрахунок тарифів, інтеграція з API мережі поштоматів/пунктів видачі, вибір на інтерактивній карті Leaflet та збереження точки в метадані замовлення.

~14 ч работыУровень: MiddleWC_Shipping_MethodWC_Shipping_RateLeaflet / OpenStreetMapCheckout Modal APIHPOS Shipping MetaREST API Courier Integration
+5 XP за шаг
Выполнено 0 из 5 шагов (0%)
Трудозатраты~14 рабочих часов
Фриланс вилка~$630 – $1,050 (€560 – €980)
Оценка веб-студии~$1,330 – $2,240 (€1260 – €2100)

ТЗ заказчика (исходный бриф):

Ми хочемо створити окремий спосіб доставки 'Самовивіз із поштомату'. Покупець на чекауті повинен бачити інтерактивну карту, обирати найближчий пункт видачі, а його адреса має зберігатися в замовленні.
Ключевые требования:
  • •Створення класу методу доставки на базі WC_Shipping_Method, зареєстрованого у woocommerce_shipping_methods
  • •Розрахунок вартості доставки залежно від загальної ваги кошика та зони доставки
  • •Модальне вікно з картою на базі безкоштовної бібліотеки Leaflet для вибору найближчого відділення
  • •Обов'язкова валідація вибору пункту перед підтвердженням замовлення
  • •Збереження номера відділення та адреси в метадані замовлення
Ограничения проекта:
  • •Повна відмова від комерційних плагінів із щомісячною підпискою
  • •Використання карт OpenStreetMap без платних ключів Google Maps API
  • •Підтримка як класичного, так і блокового чекауту
Критерии приёмки (KPI):
  • Завантаження карти відділень < 300мс
  • 100% замовлень із цим методом містять коректний номер відділення
  • Нуль помилок розрахунку вартості під час оформлення

Конфигурация блупринта под условия проекта

Выберите архитектуру и стек — шаги роадмапа, структура файлов и примеры кода переключатся автоматически:

Пошаговое практическое руководство по ТЗ

Подробный разбор архитектуры, код реализации и советы эксперта по каждому этапу:

1
Этап 1 из 5

Крок 1: Створення класу доставки на базі WC_Shipping_Method

~50 минСредний

Практическое руководство:

Опишіть клас WC_Shipping_Custom_Pickup. Визначте параметри id, method_title та supports. Підключіться до 'woocommerce_shipping_init' та зареєструйте метод через фільтр 'woocommerce_shipping_methods'.

План и контрольные точки реализации:
1Унаследовать класс от WC_Shipping_Method
2Определить поля init_form_fields() для настройки тарифов
3Реализовать метод calculate_shipping с динамическим расчетом стоимости
Важные технические нюансы и подводные камни:

Реалізуйте init_form_fields(), щоб базова вартість та умови безкоштовної доставки налаштовувалися в адмінці.

Совет эксперта (Best Practice):

Округление веса в большую сторону: Большинство курьерских служб тарифицируют вес с округлением вверх до целого килограмма (ceil($total_weight)). Учитывайте это при калькуляции. (Важно: Если у товара не указан вес в админке, $product->get_weight() вернет пустую строку — обязательно приводите к (float).)

Ожидаемый артефакт этапа:

Полноценный метод доставки в зонах доставки WooCommerce.

PHP
<?php
declare(strict_types=1);

if (!defined('ABSPATH')) exit;

class WC_Shipping_Pvz extends \WC_Shipping_Method {
    public function __construct(int $instance_id = 0) {
        $this->id                 = 'pvz_shipping';
        $this->instance_id        = $instance_id;
        $this->method_title       = __('Доставка в ПВЗ (Самовывоз)', 'agenticlab');
        $this->method_description = __('Доставка до пункта выдачи с динамическим расчетом по весу и картой.', 'agenticlab');
        $this->supports           = ['shipping-zones', 'instance-settings'];

        $this->init();
    }

    public function init(): void {
        $this->init_form_fields();
        $this->init_settings();

        $this->title = $this->get_option('title', 'Самовывоз из ПВЗ');
        $this->enabled = $this->get_option('enabled', 'yes');

        add_action('woocommerce_update_options_shipping_' . $this->id, [$this, 'process_admin_options']);
    }

    public function init_form_fields(): void {
        $this->form_fields = [
            'enabled' => [
                'title'   => __('Включить', 'agenticlab'),
                'type'    => 'checkbox',
                'default' => 'yes',
            ],
            'title' => [
                'title'   => __('Название на чекауте', 'agenticlab'),
                'type'    => 'text',
                'default' => __('Пункт выдачи заказов (ПВЗ)', 'agenticlab'),
            ],
            'base_cost' => [
                'title'   => __('Базовая стоимость ($)', 'agenticlab'),
                'type'    => 'price',
                'default' => '250',
            ],
            'cost_per_kg' => [
                'title'   => __('Доплата за каждый 1 кг ($)', 'agenticlab'),
                'type'    => 'price',
                'default' => '50',
            ],
        ];
    }

    public function calculate_shipping($package = []): void {
        $base_cost = (float) $this->get_option('base_cost', 250);
        $cost_per_kg = (float) $this->get_option('cost_per_kg', 50);

        $total_weight = 0.0;
        foreach ($package['contents'] as $item) {
            /** @var \WC_Product $product */
            $product = $item['data'];
            $weight = (float) $product->get_weight();
            $total_weight += ($weight * (int) $item['quantity']);
        }

        $final_cost = $base_cost + ($total_weight * $cost_per_kg);

        $this->add_rate([
            'id'        => $this->get_rate_id(),
            'label'     => $this->title,
            'cost'      => $final_cost,
            'package'   => $package,
        ]);
    }
}

add_filter('woocommerce_shipping_methods', function ($methods) {
    $methods['pvz_shipping'] = 'WC_Shipping_Pvz';
    return $methods;
});
2
Этап 2 из 5

Крок 2: Динамічний розрахунок вартості доставки

~60 минСложный
3
Этап 3 из 5

Крок 3: Інтерактивна карта на Leaflet та API пунктів видачі

~35 минСредний
4
Этап 4 из 5

Крок 4: Прив'язка вибору до форми та серверна валідація

~40 минСредний
5
Этап 5 из 5

Крок 5: Збереження в метадані та вивід у кабінеті й листах

~30 минЛегкий

Типичные грабли на этом ТЗ

2 антипаттерна

Инструменты экосистемы Fullstack AI Lab для этого ТЗ

Интеграция