# 套餐配置

**如何配置套餐格式？**

1.进入后台管理，点击左侧菜单中的订阅管理-添加订阅

<figure><img src="https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2FwzV1BbXRjWjv8YtEoOEK%2Fimage.png?alt=media&#x26;token=5fb47c5d-c057-4b12-861f-cff86d120e77" alt=""><figcaption></figcaption></figure>

2.在右侧弹出的表单中填写套餐信息，其中套餐描述有预设的html模板

<figure><img src="https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2FKWEC2arEvmGjCUA3WSBv%2Fimage.png?alt=media&#x26;token=8e537069-7e49-46c0-a43c-df7945266aed" alt=""><figcaption></figcaption></figure>

**html模板如下：**

复制

```
<div class="t0 color-3">爆款套餐</div>
<div class="t4">
  <span class="tit">
    流量明细
    <!-- tag表示小标签 -->
    <span class="tag">轻量</span>
  </span>

  <div class="desc">
    <i class="gou"></i>
    每月
    <!-- re 表示标红, bo 表示加粗字体 -->
    <b class="re bo">250GB</b>
    流量
  </div>
</div>
<div class="t4">
  <span class="tit">重置期限</span>
  <div class="desc">
    <i class="gou"></i>
    每月购买日免费重置流量手动重置流量
    <span class="re">35CNY</span>
    /次
  </div>
</div>
<div class="t4">
  <span class="tit">线路优势</span>
  <div class="desc">
    <!-- cha 表示套餐不包含的内容 -->
    <i class="cha"></i>
    多地BGP跨境专线出国
  </div>
</div>
<div class="t4">
  <span class="tit">流媒体支持</span>
  <div class="desc">
    <!-- gou 表示套餐包含的内容 -->
    <i class="gou"></i>
    Netfilx/Hulu/Hbo/Disney+/Dazn等流媒体
  </div>
</div>
<div class="t4">
  <span class="tit">套餐优势</span>
  <div class="desc">
    <i class="gou"></i>
    全球
    <span class="re">90+</span>
    国家/地区，
    <span class="re">200+</span>
    节点
  </div>
</div>
<div class="t4">
  <span class="tit">设备支持</span>
  <div class="desc">
    <i class="gou"></i>
    SS-Obfs协议，支持
    <span class="re">10</span>
    台设备同时使用
  </div>
</div>
<div class="t4">
  <span class="tit">其他说明</span>
  <div class="desc">
    <i class="gou"></i>
    <b class="re bo">无退款服务</b>
    ，介意勿买
  </div>
</div>
```

对应的视图为框中的部分：

<figure><img src="https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2F47aAkxVjQil23zZm4Bik%2Fimage.png?alt=media&#x26;token=42b7603a-bd5f-43db-80a7-4fe8b149e851" alt=""><figcaption></figcaption></figure>

**右上标签配置参考:**

```
<div class="t0 color-1">即将售罄</div>
```

颜色有6种可选，类名与颜色对应如下：

color-1 -> ![](https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2FpFd8diNGCvwh4efsdTRv%2Fimage.png?alt=media\&token=856319b9-d7d9-416a-884c-2d12b3fd5149)

color-2 -> ![](https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2FPlfkHSk3WWCokCcYbkQg%2Fimage.png?alt=media\&token=0046b593-c31a-4c70-9b7b-86002edcad59)

color-3 -> ![](https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2F7Xr9qNGYEUwBDzGOPCE9%2Fimage.png?alt=media\&token=73c97e08-3ca8-4711-b95a-b877a9f10840)

color-4 -> ![](https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2F4sehE5nhM8haiNXM5OKi%2Fimage.png?alt=media\&token=51f8c9fa-a6df-4c0d-b186-a76a637a7862)

color-5 -> ![](https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2FisncuEx1BTgnUpXhpHE6%2Fimage.png?alt=media\&token=16bc5bf1-d9c6-4647-8780-853a9e3cdb97)

color-6 -> ![](https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2FbIo2bsBilwCG36OGJTBe%2Fimage.png?alt=media\&token=2a995698-357f-44df-b9e5-746b5ca5b996)

也可以使用自定义style来设置图标样式：

复制

```
<div class="t0" style="background: #2543b3;color: #fff;">爆款套餐</div>
```

<figure><img src="https://709833281-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F85inOvDBQIxhcn2NsCQB%2Fuploads%2FXnTNRINTj6rfZ8LCuKBd%2Fimage.png?alt=media&#x26;token=805d9cfc-fecc-45e3-b6b3-d86bcd4cf790" alt=""><figcaption></figcaption></figure>

#### 兼容V2board官方APP套餐显示 <a href="#jian-rong-v2board-guan-fang-app-tao-can-xian-shi" id="jian-rong-v2board-guan-fang-app-tao-can-xian-shi"></a>

官方套餐配置

```
[{
    "feature": "每月 100G 流量",
    "support": true
}, {
    "feature": "全球10个国家接入",
    "support": true
},  {
    "feature": "99.99% SLA 保证",
    "support": false
},  {
    "feature": "1Gbps 带宽保证",
    "support": false
}]
```
