shopfront

витрина

• Введение и вдохновение
• Только статический клиент Hugo MVP

Зависимости

• Хьюго
• НПМ

Установка и локальная разработка

 npm i
npm audit fix

Найдите секретный ключ вашей полосы здесь. (Рассмотрите возможность использования /test/apikeys во время тестирования).

 echo STRIPE_SECRET=sk... > .env
edit config.toml
hugo server

Создание продукта

Создавайте продукты в content/2020/

Файл содержимого продукта

Структура содержания продукта:

 content/YYYY/SKU/index.md

В content/2020/wrt1/index.md Front Matter является единственным источником правды о продукте . Из public/*/index.json список продуктов в формате JSON синхронизируется с серверной частью Stripe через make .

Отдельные страницы продукта затем ссылаются на требуемый идентификатор цены оформления заказа только для клиента из каталога data/price через шаблоны Hugo Data.

Синхронизация с полосой

Вам не нужно создавать свой продукт на Stripe; stripe-sync.sh сделает это за вас.

 make

Опубликовать на своем сайте

Переместите содержимое public на свой веб-сервер.

Режим Stripe только для клиента

• https://useshoppingcart.com/usage/cartprovider#client-only-checkout-mode

Структура данных

Следует https://useshoppingcart.com/usage/cartprovider/ в layouts/_default/single.html .

Варианты доставки

Как рекламировать ограничения доставки как можно скорее, чтобы не тратить время зря?

Например, https://online.vicsmeat.com.au/ сразу запрашивает почтовый индекс.

Решение: предложите кнопку, позволяющую GPS автоматически заполнять местоположение, а также разрешить пользователям вводить его.

В Stripe есть Shipping_address_collection.allowed_countries , как описано в сеансе validateCartItems.