Commit 3d403a02 by zl

Update

parent 12e9a362
...@@ -4,6 +4,7 @@ import {defineConfig} from 'vitepress' ...@@ -4,6 +4,7 @@ import {defineConfig} from 'vitepress'
export default defineConfig({ export default defineConfig({
title: "JOCUSTOM", title: "JOCUSTOM",
description: "Documentation for JOCUSTOM", description: "Documentation for JOCUSTOM",
componentsDir: '../components',
themeConfig: { themeConfig: {
// https://vitepress.dev/reference/default-theme-config // https://vitepress.dev/reference/default-theme-config
/*nav: [ /*nav: [
......
import DefaultTheme from 'vitepress/theme' import DefaultTheme from 'vitepress/theme'
import Layout from './Layout.vue' import Layout from './Layout.vue'
import BigImage from '../../components/bigImage.md'
export default { export default {
extends: DefaultTheme, extends: DefaultTheme,
Layout Layout,
enhanceApp({ app }) {
// 注册自定义全局组件
app.component('BigImage', BigImage)
}
} }
\ No newline at end of file
...@@ -5,33 +5,33 @@ This interface will provide detailed instructions on how to customize and genera ...@@ -5,33 +5,33 @@ This interface will provide detailed instructions on how to customize and genera
## Select the base template you wish to customize ## Select the base template you wish to customize
![Customizer for merchant](/assets/design/customize/4.png) <BigImage src="/assets/design/customize/4.png" />
## Load the template customizer interface ## Load the template customizer interface
![Customizer for merchant](/assets/design/customize/5.png) <BigImage src="/assets/design/customize/5.png" />
## Add image assets to the customization area ## Add image assets to the customization area
![Customizer for merchant](/assets/design/customize/6.png) <BigImage src="/assets/design/customize/6.png" />
## Add text content to the customizable area ## Add text content to the customizable area
![Customizer for merchant](/assets/design/customize/7.png) <BigImage src="/assets/design/customize/7.png" />
## Upload an image and use that image material ## Upload an image and use that image material
![Customizer for merchant](/assets/design/customize/8.png) <BigImage src="/assets/design/customize/8.png" />
![Customizer for merchant](/assets/design/customize/9.png) <BigImage src="/assets/design/customize/9.png" />
## Select the manufacturing process and save the design. ## Select the manufacturing process and save the design.
![Customizer for merchant](/assets/design/customize/10.png) <BigImage src="/assets/design/customize/10.png" />
## Close Customizer ## Close Customizer
![Customizer for merchant](/assets/design/customize/11.png) <BigImage src="/assets/design/customize/11.png" />
::: tip ::: tip
......
...@@ -5,11 +5,11 @@ This interface displays a list of all basic templates supported by the applicati ...@@ -5,11 +5,11 @@ This interface displays a list of all basic templates supported by the applicati
## View Basic Template Information ## View Basic Template Information
![Customizer for merchant](/assets/design/1.png) <BigImage src="/assets/design/1.png" />
## Edit Basic Template Information ## Edit Basic Template Information
![Customizer for merchant](/assets/design/1.png) <BigImage src="/assets/design/2.png" />
::: warning ::: warning
......
...@@ -2,6 +2,6 @@ ...@@ -2,6 +2,6 @@
This section will explain how to view your order payment history. This section will explain how to view your order payment history.
![Customizer for merchant](/assets/invoice/1.png) <BigImage src="/assets/invoice/1.png" />
You can view your payment history through the bill list and export it as an Excel document. You can view your payment history through the bill list and export it as an Excel document.
\ No newline at end of file
...@@ -4,18 +4,18 @@ ...@@ -4,18 +4,18 @@
### Log in to your backend account. ### Log in to your backend account.
![Customizer for merchant](/assets/login/1.png) <BigImage src="/assets/login/1.png" />
### Click to jump to the app interface. ### Click to jump to the app interface.
![Customizer for merchant](/assets/login/3.png) <BigImage src="/assets/login/3.png" />
## Shopline ## Shopline
### Log in to your backend account. ### Log in to your backend account.
![Customizer for merchant](/assets/login/2.png) <BigImage src="/assets/login/2.png" />
### Click to jump to the app interface. ### Click to jump to the app interface.
![Customizer for merchant](/assets/login/3.png) <BigImage src="/assets/login/3.png" />
...@@ -4,21 +4,21 @@ This section primarily describes how to manage your own assets, categorize them, ...@@ -4,21 +4,21 @@ This section primarily describes how to manage your own assets, categorize them,
## Add material category ## Add material category
![Customizer for merchant](/assets/material/5.png) <BigImage src="/assets/material/5.png" />
![Customizer for merchant](/assets/material/4.png) <BigImage src="/assets/material/4.png" />
## Add material tag ## Add material tag
![Customizer for merchant](/assets/material/3.png) <BigImage src="/assets/material/3.png" />
![Customizer for merchant](/assets/material/2.png) <BigImage src="/assets/material/2.png" />
## Add material ## Add material
![Customizer for merchant](/assets/material/6.png) <BigImage src="/assets/material/6.png" />
![Customizer for merchant](/assets/material/1.png) <BigImage src="/assets/material/1.png" />
::: tip ::: tip
......
...@@ -6,11 +6,11 @@ This section will explain how to view the order list and details for your linked ...@@ -6,11 +6,11 @@ This section will explain how to view the order list and details for your linked
When a customer places an order in your store, our app will collect that order and include only information about products pushed to the store by the app. When a customer places an order in your store, our app will collect that order and include only information about products pushed to the store by the app.
![Customizer for merchant](/assets/order/1.png) <BigImage src="/assets/order/1.png" />
When an order fails to sync from the store to the app backend, the error message shown below will appear. You may contact the administrator to check and handle the issue. When an order fails to sync from the store to the app backend, the error message shown below will appear. You may contact the administrator to check and handle the issue.
![Customizer for merchant](/assets/order/2.png) <BigImage src="/assets/order/2.png" />
## Order Status ## Order Status
...@@ -33,6 +33,6 @@ You can filter and search the list based on the order status bar above. ...@@ -33,6 +33,6 @@ You can filter and search the list based on the order status bar above.
Click the View button to display the order details page, which includes the shipping method, custom product display, total amount, and order status section. Click the View button to display the order details page, which includes the shipping method, custom product display, total amount, and order status section.
![Customizer for merchant](/assets/order/3.png) <BigImage src="/assets/order/3.png" />
![Customizer for merchant](/assets/order/4.png) <BigImage src="/assets/order/4.png" />
\ No newline at end of file \ No newline at end of file
...@@ -4,9 +4,9 @@ Edit Product Information Interface ...@@ -4,9 +4,9 @@ Edit Product Information Interface
## Modify product basic information ## Modify product basic information
![Customizer for merchant](/assets/product/edit/4.png) <BigImage src="/assets/product/edit/4.png" />
![Customizer for merchant](/assets/product/edit/5.png) <BigImage src="/assets/product/edit/5.png" />
::: tip ::: tip
1. Product Title 1. Product Title
...@@ -26,28 +26,28 @@ Edit Product Information Interface ...@@ -26,28 +26,28 @@ Edit Product Information Interface
### Shopify ### Shopify
![Customizer for merchant](/assets/product/edit/7.png) <BigImage src="/assets/product/edit/7.png" />
![Customizer for merchant](/assets/product/edit/11.png) <BigImage src="/assets/product/edit/11.png" />
### Shopline ### Shopline
![Customizer for merchant](/assets/product/edit/8.png) <BigImage src="/assets/product/edit/8.png" />
![Customizer for merchant](/assets/product/edit/9.png) <BigImage src="/assets/product/edit/9.png" />
## Modify product variant information ## Modify product variant information
![Customizer for merchant](/assets/product/edit/6.png) <BigImage src="/assets/product/edit/6.png" />
### Shopify ### Shopify
![Customizer for merchant](/assets/product/edit/10.png) <BigImage src="/assets/product/edit/10.png" />
### Shopline ### Shopline
![Customizer for merchant](/assets/product/edit/12.png) <BigImage src="/assets/product/edit/12.png" />
::: tip ::: tip
The list displays variant images, attributes such as color and size, along with base garment price, craftsmanship cost, product weight, SKU identifier, and the selling price for each variant. The list displays variant images, attributes such as color and size, along with base garment price, craftsmanship cost, product weight, SKU identifier, and the selling price for each variant.
......
...@@ -4,15 +4,15 @@ This interface displays the unique personalized product you created in the previ ...@@ -4,15 +4,15 @@ This interface displays the unique personalized product you created in the previ
## Product generation in progress ## Product generation in progress
![Customizer for merchant](/assets/product/1.png) <BigImage src="/assets/product/1.png" />
## Product generation successful ## Product generation successful
![Customizer for merchant](/assets/product/2.png) <BigImage src="/assets/product/2.png" />
## Synchronize Products ## Synchronize Products
![Customizer for merchant](/assets/product/13.png) <BigImage src="/assets/product/13.png" />
::: tip ::: tip
After editing and clicking Save, you will return to the product list interface. At this point, you can click the Sync button to synchronize the product to your store. After editing and clicking Save, you will return to the product list interface. At this point, you can click the Sync button to synchronize the product to your store.
...@@ -22,15 +22,15 @@ After successfully syncing the product to your store, you can navigate to your s ...@@ -22,15 +22,15 @@ After successfully syncing the product to your store, you can navigate to your s
### Shopify ### Shopify
![Customizer for merchant](/assets/product/14.png) <BigImage src="/assets/product/14.png" />
![Customizer for merchant](/assets/product/15.png) <BigImage src="/assets/product/15.png" />
### Shopline ### Shopline
![Customizer for merchant](/assets/product/16.png) <BigImage src="/assets/product/16.png" />
![Customizer for merchant](/assets/product/17.png) <BigImage src="/assets/product/17.png" />
_______________ _______________
...@@ -40,6 +40,6 @@ You can edit, synchronize, and delete all products displayed in the product list ...@@ -40,6 +40,6 @@ You can edit, synchronize, and delete all products displayed in the product list
Please exercise caution when performing a deletion operation. Once executed, the item will be permanently removed. Please exercise caution when performing a deletion operation. Once executed, the item will be permanently removed.
::: :::
![Customizer for merchant](/assets/product/3.png) <BigImage src="/assets/product/3.png" />
...@@ -4,26 +4,26 @@ This section primarily explains how to manage the size chart information for you ...@@ -4,26 +4,26 @@ This section primarily explains how to manage the size chart information for you
## Size Chart List ## Size Chart List
![Customizer for merchant](/assets/sizechart/1.png) <BigImage src="/assets/sizechart/1.png" />
## Add and Edit Size Charts ## Add and Edit Size Charts
![Customizer for merchant](/assets/sizechart/3.png) <BigImage src="/assets/sizechart/3.png" />
![Customizer for merchant](/assets/sizechart/4.png) <BigImage src="/assets/sizechart/4.png" />
::: tip ::: tip
We provide default size charts for 8 product types. You can load them directly and modify them for use. We provide default size charts for 8 product types. You can load them directly and modify them for use.
::: :::
![Customizer for merchant](/assets/sizechart/5.png) <BigImage src="/assets/sizechart/5.png" />
## Size Chart Preview ## Size Chart Preview
![Customizer for merchant](/assets/sizechart/2.png) <BigImage src="/assets/sizechart/2.png" />
## 店铺展示 ## 店铺展示
![Customizer for merchant](/assets/sizechart/6.png) <BigImage src="/assets/sizechart/6.png" />
Once you add a size chart for this model, a size chart pop-up link will appear in your Shopify or Shopline store. Once you add a size chart for this model, a size chart pop-up link will appear in your Shopify or Shopline store.
...@@ -5,33 +5,33 @@ ...@@ -5,33 +5,33 @@
## 选择您想要自定义的基础模板 ## 选择您想要自定义的基础模板
![Customizer for merchant](/assets/design/customize/4.png) <BigImage src="/assets/design/customize/4.png" />
## 加载模板自定义界面 ## 加载模板自定义界面
![Customizer for merchant](/assets/design/customize/5.png) <BigImage src="/assets/design/customize/5.png" />
## 将图像资源添加到自定义区域 ## 将图像资源添加到自定义区域
![Customizer for merchant](/assets/design/customize/6.png) <BigImage src="/assets/design/customize/6.png" />
## 在自定义区域添加文本内容 ## 在自定义区域添加文本内容
![Customizer for merchant](/assets/design/customize/7.png) <BigImage src="/assets/design/customize/7.png" />
## 上传一张图片并使用该图片素材 ## 上传一张图片并使用该图片素材
![Customizer for merchant](/assets/design/customize/8.png) <BigImage src="/assets/design/customize/8.png" />
![Customizer for merchant](/assets/design/customize/9.png) <BigImage src="/assets/design/customize/9.png" />
## 选择制造工艺并保存设计。 ## 选择制造工艺并保存设计。
![Customizer for merchant](/assets/design/customize/10.png) <BigImage src="/assets/design/customize/10.png" />
## 关闭定制器 ## 关闭定制器
![Customizer for merchant](/assets/design/customize/11.png) <BigImage src="/assets/design/customize/11.png" />
::: tip ::: tip
......
...@@ -4,11 +4,11 @@ ...@@ -4,11 +4,11 @@
## 查看基础模板信息 ## 查看基础模板信息
![Customizer for merchant](/assets/design/1.png) <BigImage src="/assets/design/1.png" />
## 编辑基础模板信息 ## 编辑基础模板信息
![Customizer for merchant](/assets/design/1.png) <BigImage src="/assets/design/2.png" />
::: warning ::: warning
......
...@@ -2,6 +2,6 @@ ...@@ -2,6 +2,6 @@
本节将介绍如何查看您订单支付历史记录。 本节将介绍如何查看您订单支付历史记录。
![Customizer for merchant](/assets/invoice/1.png) <BigImage src="/assets/invoice/1.png" />
您可以通过账单列表查看您的支付记录, 以及导出excel文档 您可以通过账单列表查看您的支付记录, 以及导出excel文档
\ No newline at end of file
...@@ -4,18 +4,18 @@ ...@@ -4,18 +4,18 @@
### 登录您的Shopify后台账号 ### 登录您的Shopify后台账号
![Customizer for merchant](/assets/login/1.png) <BigImage src="/assets/login/1.png" />
### 点击已安装的应用到应用后台界面 ### 点击已安装的应用到应用后台界面
![Customizer for merchant](/assets/login/3.png) <BigImage src="/assets/login/3.png" />
## Shopline ## Shopline
### 登录您的Shopline后台账号 ### 登录您的Shopline后台账号
![Customizer for merchant](/assets/login/2.png) <BigImage src="/assets/login/2.png" />
### 点击已安装的应用到应用后台界面 ### 点击已安装的应用到应用后台界面
![Customizer for merchant](/assets/login/3.png) <BigImage src="/assets/login/3.png" />
...@@ -4,21 +4,21 @@ ...@@ -4,21 +4,21 @@
## 添加素材分类 ## 添加素材分类
![Customizer for merchant](/assets/material/5.png) <BigImage src="/assets/material/5.png" />
![Customizer for merchant](/assets/material/4.png) <BigImage src="/assets/material/4.png" />
## 添加素材标签 ## 添加素材标签
![Customizer for merchant](/assets/material/3.png) <BigImage src="/assets/material/3.png" />
![Customizer for merchant](/assets/material/2.png) <BigImage src="/assets/material/2.png" />
## 添加素材 ## 添加素材
![Customizer for merchant](/assets/material/6.png) <BigImage src="/assets/material/6.png" />
![Customizer for merchant](/assets/material/1.png) <BigImage src="/assets/material/1.png" />
::: tip ::: tip
......
...@@ -6,11 +6,11 @@ ...@@ -6,11 +6,11 @@
当您的店铺有顾客下单后,我们的应用会收集该订单并仅包含由应用推送到店铺的商品的信息 当您的店铺有顾客下单后,我们的应用会收集该订单并仅包含由应用推送到店铺的商品的信息
![Customizer for merchant](/assets/order/1.png) <BigImage src="/assets/order/1.png" />
当订单由店铺同步到应用后台失败时,会出现下图的错误提示,可以联系管理员检查并处理 当订单由店铺同步到应用后台失败时,会出现下图的错误提示,可以联系管理员检查并处理
![Customizer for merchant](/assets/order/2.png) <BigImage src="/assets/order/2.png" />
## 订单状态 ## 订单状态
...@@ -33,9 +33,9 @@ ...@@ -33,9 +33,9 @@
点击查看按钮即可展示订单详情页面, 包含物流方式,定制商品展示,总计, 以及订单流转状态区域 点击查看按钮即可展示订单详情页面, 包含物流方式,定制商品展示,总计, 以及订单流转状态区域
![Customizer for merchant](/assets/order/3.png) <BigImage src="/assets/order/3.png" />
![Customizer for merchant](/assets/order/4.png) <BigImage src="/assets/order/4.png" />
......
...@@ -4,9 +4,9 @@ ...@@ -4,9 +4,9 @@
## 编辑产品基础信息 ## 编辑产品基础信息
![Customizer for merchant](/assets/product/edit/4.png) <BigImage src="/assets/product/edit/4.png" />
![Customizer for merchant](/assets/product/edit/5.png) <BigImage src="/assets/product/edit/5.png" />
::: tip ::: tip
1. 商品标题 1. 商品标题
...@@ -26,28 +26,28 @@ ...@@ -26,28 +26,28 @@
### Shopify ### Shopify
![Customizer for merchant](/assets/product/edit/7.png) <BigImage src="/assets/product/edit/7.png" />
![Customizer for merchant](/assets/product/edit/11.png) <BigImage src="/assets/product/edit/11.png" />
### Shopline ### Shopline
![Customizer for merchant](/assets/product/edit/8.png) <BigImage src="/assets/product/edit/8.png" />
![Customizer for merchant](/assets/product/edit/9.png) <BigImage src="/assets/product/edit/9.png" />
## 编辑产品变体信息 ## 编辑产品变体信息
![Customizer for merchant](/assets/product/edit/6.png) <BigImage src="/assets/product/edit/6.png" />
### Shopify ### Shopify
![Customizer for merchant](/assets/product/edit/10.png) <BigImage src="/assets/product/edit/10.png" />
### Shopline ### Shopline
![Customizer for merchant](/assets/product/edit/12.png) <BigImage src="/assets/product/edit/12.png" />
::: tip ::: tip
列表中展示变体图片, 颜色尺码等属性,以及胚衣价格, 工艺价格,产品重量, SKU标识以及每个变体的售价. 列表中展示变体图片, 颜色尺码等属性,以及胚衣价格, 工艺价格,产品重量, SKU标识以及每个变体的售价.
......
...@@ -4,15 +4,15 @@ ...@@ -4,15 +4,15 @@
## 商品生成中 ## 商品生成中
![Customizer for merchant](/assets/product/1.png) <BigImage src="/assets/product/1.png" />
## 商品生成成功 ## 商品生成成功
![Customizer for merchant](/assets/product/2.png) <BigImage src="/assets/product/2.png" />
## 同步商品到店铺 ## 同步商品到店铺
![Customizer for merchant](/assets/product/13.png) <BigImage src="/assets/product/13.png" />
::: tip ::: tip
当您编辑完成并点击保存后,会返回商品列表界面, 此时,您可以点击同步操作按钮,该商品将会同步至您的店铺 当您编辑完成并点击保存后,会返回商品列表界面, 此时,您可以点击同步操作按钮,该商品将会同步至您的店铺
...@@ -22,15 +22,15 @@ ...@@ -22,15 +22,15 @@
### Shopify ### Shopify
![Customizer for merchant](/assets/product/14.png) <BigImage src="/assets/product/14.png" />
![Customizer for merchant](/assets/product/15.png) <BigImage src="/assets/product/15.png" />
### Shopline ### Shopline
![Customizer for merchant](/assets/product/16.png) <BigImage src="/assets/product/16.png" />
![Customizer for merchant](/assets/product/17.png) <BigImage src="/assets/product/17.png" />
_______________ _______________
...@@ -40,6 +40,6 @@ _______________ ...@@ -40,6 +40,6 @@ _______________
执行删除操作时请谨慎操作。一旦执行,该项目将被永久删除。 执行删除操作时请谨慎操作。一旦执行,该项目将被永久删除。
::: :::
![Customizer for merchant](/assets/product/3.png) <BigImage src="/assets/product/3.png" />
...@@ -4,26 +4,26 @@ ...@@ -4,26 +4,26 @@
## 尺码表列表 ## 尺码表列表
![Customizer for merchant](/assets/sizechart/1.png) <BigImage src="/assets/sizechart/1.png" />
## 新增和编辑尺码表 ## 新增和编辑尺码表
![Customizer for merchant](/assets/sizechart/3.png) <BigImage src="/assets/sizechart/3.png" />
![Customizer for merchant](/assets/sizechart/4.png) <BigImage src="/assets/sizechart/4.png" />
::: tip ::: tip
我们默认提供了8种类型商品的尺码表,您可以直接加载后修改使用 我们默认提供了8种类型商品的尺码表,您可以直接加载后修改使用
::: :::
![Customizer for merchant](/assets/sizechart/5.png) <BigImage src="/assets/sizechart/5.png" />
## 尺码表预览 ## 尺码表预览
![Customizer for merchant](/assets/sizechart/2.png) <BigImage src="/assets/sizechart/2.png" />
## 店铺展示 ## 店铺展示
![Customizer for merchant](/assets/sizechart/6.png) <BigImage src="/assets/sizechart/6.png" />
当您为这个模添加了尺码表,在您的Shopify 或Shopline店铺中将会展示尺码表弹出框链接 当您为这个模添加了尺码表,在您的Shopify 或Shopline店铺中将会展示尺码表弹出框链接
...@@ -7,22 +7,22 @@ JOCUSTOM是一款为电商创业者提供定制化产品制造、仓储及全球 ...@@ -7,22 +7,22 @@ JOCUSTOM是一款为电商创业者提供定制化产品制造、仓储及全球
>JOCUSTOM是一款兼容Shopify及Shopify平台的按需定制应用插件。它能助您快速生成商品并同步至平台,同时支持顾客对商品进行个性化定制。凭借直邮配送功能,它将助力您的平台腾飞发展。 >JOCUSTOM是一款兼容Shopify及Shopify平台的按需定制应用插件。它能助您快速生成商品并同步至平台,同时支持顾客对商品进行个性化定制。凭借直邮配送功能,它将助力您的平台腾飞发展。
## 商家定制 ## 商家定制
![Customizer for merchant](/assets/introduction/customizer%20for%20merchant.png) <BigImage src="/assets/introduction/customizer%20for%20merchant.png" />
## 客户定制 ## 客户定制
![Customizer for clients](/assets/introduction/customizer%20for%20lients.png) <BigImage src="/assets/introduction/customizer%20for%20lients.png" />
![Customizer for clients](/assets/introduction/customizer%20for%20lients2.png) <BigImage src="/assets/introduction/customizer%20for%20lients2.png" />
## 工厂生产 ## 工厂生产
![factory](/assets/introduction/factory1.png) <BigImage src="/assets/introduction/factory1.png" />
![factory](/assets/introduction/factory2.jpg) <BigImage src="/assets/introduction/factory2.png" />
![factory](/assets/introduction/factory3.jpg) <BigImage src="/assets/introduction/factory3.png" />
## 极速物流 ## 极速物流
![express](/assets/introduction/express.png) <BigImage src="/assets/introduction/express.png" />
...@@ -4,13 +4,13 @@ ...@@ -4,13 +4,13 @@
## 登录您的Shopify店铺 ## 登录您的Shopify店铺
![Customizer for merchant](/assets/shopify/installation/1.png) <BigImage src="/assets/shopify/installation/1.png" />
## 前往Shopify应用商店 ## 前往Shopify应用商店
![Customizer for merchant](/assets/shopify/installation/2.png) <BigImage src="/assets/shopify/installation/2.png" />
## 搜索关键词 (JOCSUTOM) ## 搜索关键词 (JOCSUTOM)
![Customizer for merchant](/assets/shopify/installation/3.png) <BigImage src="/assets/shopify/installation/3.png" />
## 安装 JOCUSTOM 应用 ## 安装 JOCUSTOM 应用
![Customizer for merchant](/assets/shopify/installation/4.png) <BigImage src="/assets/shopify/installation/4.png" />
...@@ -8,15 +8,15 @@ ...@@ -8,15 +8,15 @@
## 登录您的Shopify后台账号, 并打开皮肤编辑器 ## 登录您的Shopify后台账号, 并打开皮肤编辑器
![Customizer for merchant](/assets/shopify/configuration/1.png) <BigImage src="/assets/shopify/configuration/1.png" />
## 切换到产品界面 ## 切换到产品界面
![Customizer for merchant](/assets/shopify/configuration/2.png) <BigImage src="/assets/shopify/configuration/2.png" />
## 在“加入购物车”按钮上方添加我们的应用程序区块 ## 在“加入购物车”按钮上方添加我们的应用程序区块
![Customizer for merchant](/assets/shopify/configuration/3.png) <BigImage src="/assets/shopify/configuration/3.png" />
![Customizer for merchant](/assets/shopify/configuration/4.png) <BigImage src="/assets/shopify/configuration/4.png" />
::: 注意 ::: 注意
请确保移动端定制器位于PC端定制器下方。 请确保移动端定制器位于PC端定制器下方。
...@@ -26,18 +26,18 @@ ...@@ -26,18 +26,18 @@
添加我们应用程序提供的购物车模块 添加我们应用程序提供的购物车模块
![Customizer for merchant](/assets/shopify/configuration/8.png) <BigImage src="/assets/shopify/configuration/8.png" />
![Customizer for merchant](/assets/shopify/configuration/9.png) <BigImage src="/assets/shopify/configuration/9.png" />
## 切换到结算页面 ## 切换到结算页面
![Customizer for merchant](/assets/shopify/configuration/5.png) <BigImage src="/assets/shopify/configuration/5.png" />
## 添加我们提供的结算应用扩展 ## 添加我们提供的结算应用扩展
![Customizer for merchant](/assets/shopify/configuration/6.png) <BigImage src="/assets/shopify/configuration/6.png" />
![Customizer for merchant](/assets/shopify/configuration/7.png) <BigImage src="/assets/shopify/configuration/7.png" />
...@@ -4,13 +4,13 @@ ...@@ -4,13 +4,13 @@
## 登录您的Shopline店铺 ## 登录您的Shopline店铺
![Customizer for merchant](/assets/shopline/installation/1.png) <BigImage src="/assets/shopline/installation/1.png" />
## 前往Shopline应用市场 ## 前往Shopline应用市场
![Customizer for merchant](/assets/shopline/installation/2.png) <BigImage src="/assets/shopline/installation/2.png" />
## 所以关键字(JOCUSTOM) ## 所以关键字(JOCUSTOM)
![Customizer for merchant](/assets/shopline/installation/3.png) <BigImage src="/assets/shopline/installation/3.png" />
## 安装 JOCUSTOM 应用 ## 安装 JOCUSTOM 应用
![Customizer for merchant](/assets/shopline/installation/4.png) <BigImage src="/assets/shopline/installation/4.png" />
...@@ -8,17 +8,17 @@ ...@@ -8,17 +8,17 @@
## 登录您的Shopline后台账号, 并打开皮肤编辑器 ## 登录您的Shopline后台账号, 并打开皮肤编辑器
![Customizer for merchant](/assets/shopline/configuration/1.png) <BigImage src="/assets/shopline/configuration/1.png" />
## 切换到产品界面 ## 切换到产品界面
![Customizer for merchant](/assets/shopify/configuration/2.png) <BigImage src="/assets/shopline/configuration/2.png" />
## 在“加入购物车”按钮上方添加我们的应用程序区块 ## 在“加入购物车”按钮上方添加我们的应用程序区块
![Customizer for merchant](/assets/shopify/configuration/3.png) <BigImage src="/assets/shopline/configuration/3.png" />
![Customizer for merchant](/assets/shopify/configuration/4.png) <BigImage src="/assets/shopline/configuration/4.png" />
::: warning ::: warning
请确保移动端定制器位于PC端定制器下方。 请确保移动端定制器位于PC端定制器下方。
......
<script setup>
import { ref, defineProps } from 'vue';
const props = defineProps(['src']);
const popupImage = ref(null);
const open = () => {
popupImage.value.style.display = 'block';
};
const close = () => {
popupImage.value.style.display = 'none';
}
</script>
<img class="original-image" :src="props.src" @click="open()">
<div class="popup-image" ref="popupImage" @click="close">
<img :src="props.src" @click="$event.stopPropagation()" />
</div>
<style>
.original-image {
margin-bottom: 20px;
cursor: pointer;
}
.popup-image {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
top: 0;
left: 0;
z-index: 30;
display: none;
}
.popup-image img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-width: 90%;
max-height: 90%;
width: 85%;
}
@media (max-width: 640px) {
.popup-image img {
max-width: 99%;
width: 100%;
}
}
</style>
\ No newline at end of file
...@@ -7,22 +7,24 @@ JOCUSTOM is an application that provides customized product manufacturing, wareh ...@@ -7,22 +7,24 @@ JOCUSTOM is an application that provides customized product manufacturing, wareh
>JOCUSTOM is a POD app plugin compatible with Shopify and Shopify platforms. It enables you to quickly generate products and sync them to your platform, while allowing customers to customize your products. With drop shipping support, it helps your platform take off. >JOCUSTOM is a POD app plugin compatible with Shopify and Shopify platforms. It enables you to quickly generate products and sync them to your platform, while allowing customers to customize your products. With drop shipping support, it helps your platform take off.
## Customized for Merchants ## Customized for Merchants
![Customizer for merchant](/assets/introduction/customizer%20for%20merchant.png) <BigImage src="/assets/introduction/customizer%20for%20merchant.png" />
## Customer-Specific Customization ## Customer-Specific Customization
![Customizer for clients](/assets/introduction/customizer%20for%20lients.png) <BigImage src="/assets/introduction/customizer%20for%20lients.png" />
![Customizer for clients](/assets/introduction/customizer%20for%20lients2.png) <BigImage src="/assets/introduction/customizer%20for%20lients2.png" />
## Factory production ## Factory production
![factory](/assets/introduction/factory1.png) <BigImage src="/assets/introduction/factory1.png" />
![factory](/assets/introduction/factory2.jpg)
![factory](/assets/introduction/factory3.jpg) <BigImage src="/assets/introduction/factory2.jpg" />
<BigImage src="/assets/introduction/factory3.jpg" />
## Express Logistics ## Express Logistics
![express](/assets/introduction/express.png) <BigImage src="/assets/introduction/express.png" />
...@@ -4,13 +4,13 @@ This interface provides the complete process for installing the JOCUSTOM app on ...@@ -4,13 +4,13 @@ This interface provides the complete process for installing the JOCUSTOM app on
## Log in to your Shopify store ## Log in to your Shopify store
![Customizer for merchant](/assets/shopify/installation/1.png) <BigImage src="/assets/shopify/installation/1.png" />
## Go to the Shopify App Store ## Go to the Shopify App Store
![Customizer for merchant](/assets/shopify/installation/2.png) <BigImage src="/assets/shopify/installation/2.png" />
## Search by keyword (JOCSUTOM) ## Search by keyword (JOCSUTOM)
![Customizer for merchant](/assets/shopify/installation/3.png) <BigImage src="/assets/shopify/installation/3.png" />
## Install the JOCUSTOM app ## Install the JOCUSTOM app
![Customizer for merchant](/assets/shopify/installation/4.png) <BigImage src="/assets/shopify/installation/4.png" />
...@@ -8,15 +8,15 @@ Enabling the storefront design feature incurs an additional fee. If you require ...@@ -8,15 +8,15 @@ Enabling the storefront design feature incurs an additional fee. If you require
## Log in to your backend account and open the skin editor. ## Log in to your backend account and open the skin editor.
![Customizer for merchant](/assets/shopify/configuration/1.png) [![Customizer for merchant](/assets/shopify/configuration/1.png)](/assets/shopify/configuration/1.png)
## Switch to the product interface ## Switch to the product interface
![Customizer for merchant](/assets/shopify/configuration/2.png) [![Customizer for merchant](/assets/shopify/configuration/2.png)](/assets/shopify/configuration/2.png)
## Add an app block above the Add to Cart button ## Add an app block above the Add to Cart button
![Customizer for merchant](/assets/shopify/configuration/3.png) [![Customizer for merchant](/assets/shopify/configuration/3.png)](/assets/shopify/configuration/3.png)
![Customizer for merchant](/assets/shopify/configuration/4.png) [![Customizer for merchant](/assets/shopify/configuration/4.png)](/assets/shopify/configuration/4.png)
::: warning ::: warning
Please ensure the mobile customizer is positioned below the PC customizer. Please ensure the mobile customizer is positioned below the PC customizer.
...@@ -26,18 +26,18 @@ Please ensure the mobile customizer is positioned below the PC customizer. ...@@ -26,18 +26,18 @@ Please ensure the mobile customizer is positioned below the PC customizer.
Add the shopping cart block provided by our application Add the shopping cart block provided by our application
![Customizer for merchant](/assets/shopify/configuration/8.png) <BigImage src="/assets/shopify/configuration/8.png" />
![Customizer for merchant](/assets/shopify/configuration/9.png) <BigImage src="/assets/shopify/configuration/9.png" />
## Switch to checkout interface ## Switch to checkout interface
![Customizer for merchant](/assets/shopify/configuration/5.png) <BigImage src="/assets/shopify/configuration/5.png" />
## Add the Checkout app extension ## Add the Checkout app extension
![Customizer for merchant](/assets/shopify/configuration/6.png) <BigImage src="/assets/shopify/configuration/6.png" />
![Customizer for merchant](/assets/shopify/configuration/7.png) <BigImage src="/assets/shopify/configuration/7.png" />
...@@ -4,13 +4,13 @@ This interface provides the complete process for installing the JOCUSTOM app on ...@@ -4,13 +4,13 @@ This interface provides the complete process for installing the JOCUSTOM app on
## Log in to your Shopline store ## Log in to your Shopline store
![Customizer for merchant](/assets/shopline/installation/1.png) <BigImage src="/assets/shopline/installation/1.png" />
## Go to the Shopline App Store ## Go to the Shopline App Store
![Customizer for merchant](/assets/shopline/installation/2.png) <BigImage src="/assets/shopify/installation/2.png" />
## Search by keyword (JOCUSTOM) ## Search by keyword (JOCUSTOM)
![Customizer for merchant](/assets/shopline/installation/3.png) <BigImage src="/assets/shopify/installation/3.png" />
## Install the JOCUSTOM app ## Install the JOCUSTOM app
![Customizer for merchant](/assets/shopline/installation/4.png) <BigImage src="/assets/shopify/installation/4.png" />
...@@ -8,17 +8,17 @@ Enabling the storefront design feature incurs an additional fee. If you require ...@@ -8,17 +8,17 @@ Enabling the storefront design feature incurs an additional fee. If you require
## Log in to your backend account and open the skin editor. ## Log in to your backend account and open the skin editor.
![Customizer for merchant](/assets/shopline/configuration/1.png) <BigImage src="/assets/shopline/configuration/1.png" />
## Switch to the product interface ## Switch to the product interface
![Customizer for merchant](/assets/shopify/configuration/2.png) <BigImage src="/assets/shopline/configuration/2.png" />
## Add an app block above the Add to Cart button ## Add an app block above the Add to Cart button
![Customizer for merchant](/assets/shopify/configuration/3.png) <BigImage src="/assets/shopline/configuration/3.png" />
![Customizer for merchant](/assets/shopify/configuration/4.png) <BigImage src="/assets/shopline/configuration/4.png" />
::: warning ::: warning
Please ensure the mobile customizer is positioned below the PC customizer. Please ensure the mobile customizer is positioned below the PC customizer.
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment