Pages
Set your mini program's Theme Colors (主题配色), Tab Bar (底部导航栏) and agreement content, and manage Custom Pages (自定义页面).
Game home pages are not designed here. Instead, click Configure Home Page (配置首页) in Games (游戏管理). Game home pages and custom pages use the same visual page builder, Page Config (页面配置); see the last section of this page.
Theme colors
Theme colors apply to icons, buttons, card backgrounds and more on built-in pages; widgets on custom pages each have their own color settings.
| Color | Used for |
|---|---|
| Primary Color (主色系) | Icons, links and the selected state of tags |
| Primary Background, Dark (主色背景（深）) | Dark card backgrounds |
| Primary Background, Light (主色背景（浅）) | Secondary backgrounds and the end color of gradients |
| Button Background Color (按钮背景色) | Primary action buttons (confirm, submit, etc.) |
The last three can use gradients. After making changes, click Save Colors (保存配色) to apply them.
Tab bar
- At the top is a phone-style preview. Drag tabs to reorder them, then click Save Order (保存排序).
- Home (首页) is a fixed tab and cannot be deleted or moved. Each game has its own home page configuration; to design it, click Configure Home Page in Games.
- Hover over any other tab to Edit (编辑) or Remove (移除) it. Removing a custom page's tab does not delete the page itself, and you can set the page as a tab again later.
When editing a tab, you can set:
- Tab Basics (Tab 基础): a Menu Name (菜单名称) of up to 6 characters, a Default Icon (默认图标), a Selected Icon (选中图标) and a Selected Color (选中颜色).
- Navigation Bar Settings (导航栏设置): Background Color (背景色), Title Text (标题文字), Text/Icon Color (文字/图标颜色), Left Icon (左侧图标) and Left Link (左侧链接).
Custom pages
The top of the list always shows 5 built-in pages: Gaming Companions (陪玩), Moments (动态), Privacy Policy (隐私政策), User Agreement (用户协议) and Onboarding Agreement (入驻协议).
- For built-in pages, you can click Set as Tab (设为Tab) or Unset Tab (取消Tab).
- For Privacy Policy, User Agreement and Onboarding Agreement, click Settings (设置) to edit the content (plain text).
Actions for custom pages:
- New Page (新建页面): click New Page and enter a page title (for example, Event Zone or Beginner's Guide). Once the page is created, the page builder opens directly.
- Design (装修): opens the page builder so you can edit the page content.
- Rename (重命名), Set as Tab / Unset Tab.
- Delete (删除): a deleted page cannot be restored. If the page is set as a tab, that tab is also removed from the tab bar.
A new page has the status Draft (草稿) and changes to Published (已发布) after you save it in the page builder. The mini program can open only published pages.
Tip
We recommend saving the page once in the page builder (so that it becomes Published) before you set it as a tab.
Page Config (visual page builder)
How to open it
- In Games, click Configure Home Page for a game to design that game's home page. The top of the builder shows Home Page Design (首页装修).
- In Pages, click Design for a custom page, or create a new page to open the builder automatically. The top of the builder shows Custom Page.
Layout and basic operations
The page builder opens in full screen and has three columns: the widget library on the left (you can search for widgets), the phone preview canvas in the middle and Properties (属性配置) on the right.
- Drag widgets from the left onto the canvas, and drag them within the canvas to reorder them.
- Select a widget to edit its properties on the right. Most widgets also let you set container styles: Margin (外边距), Padding (内边距), Corner Radius (圆角) and Background Color, with sizes in rpx.
- With a widget selected, you can also move it up or down, copy it or delete it. Keyboard shortcuts are supported: Ctrl+Z to undo, Ctrl+Y to redo and Delete to delete.
- Click the navigation area at the top of the phone to set the Page Background (页面背景).
- Click Save (保存) at the top and your changes take effect immediately; there is no separate publishing step. If you click Back (返回) while there are unsaved changes, you are asked to confirm.
Templates
- Save as Template (另存为模板): saves the widgets on the current canvas as a template (the page background is not included).
- Import Template (导入模板): replaces the current canvas content with a saved template. Templates are shared across the whole club and can be imported into both game home pages and custom pages.
- Clear (清除): removes all widgets from the canvas; this takes effect only after you save.
Game category bar
When you are designing a game home page and at least 2 games are enabled, a game category bar appears at the top of the canvas. Click it to set whether to Show Game Categories (显示游戏分类), as well as the Background Color, Padding and Selected/Unselected Styles (选中/未选中样式). This setting is shared by all game home pages and must be saved separately by clicking Save Game Category Style (保存游戏分类样式) in the panel.
Available widgets
| Group | Widget | Description |
|---|---|---|
| Basic Widgets (基础组件) | Banner Carousel (轮播图) | Rotates multiple images; you can set autoplay, the interval and the height, and give each image a link |
| Basic Widgets (基础组件) | Notice Bar (公告栏) | An icon plus one line of announcement text; can have a link |
| Basic Widgets (基础组件) | Quick Links (快捷入口) | A grid of icon links, 3, 4 or 5 per row |
| Basic Widgets (基础组件) | Player Showcase (打手展示) | Automatically shows active players, in a grid or list layout |
| Basic Widgets (基础组件) | Product Showcase (商品展示) | Automatically shows products that are listed for sale; can be filtered by game type, product type and product category |
| Business Widgets (业务组件) | User Info (用户信息) | Avatar, nickname, ID and a stats bar, each of which can be turned on or off separately |
| Business Widgets (业务组件) | Grid Menu (格子菜单) | A menu of circular icons |
| Business Widgets (业务组件) | List Menu (列表菜单) | A vertical menu with description text |
| Business Widgets (业务组件) | Order Shortcuts (订单入口) | Always shows shortcuts to order statuses, with data pulled in real time from the user's orders; no configuration needed |
| Marketing Widgets (营销组件) | Image Ad (图片广告) | A single image with a link |
| Marketing Widgets (营销组件) | Event Banner (活动横幅) | A tag, title, description and button text, plus a link |
| Utilities (辅助工具) | Spacer (辅助空白) | A blank area with a configurable height and background color |
| Utilities (辅助工具) | Text (文本) | Plain text with a configurable font size, alignment and color |
Available links
When a widget needs a link, you can choose from:
- Custom Pages: custom pages you have created.
- Core Pages (核心页面): Home, Companion List (陪玩列表), Moments and Product List (商品列表).
- Business Pages (业务页面): Player Details (打手详情) and Product Details (商品详情); you need to enter the player ID or product ID.
- User Pages (用户页面): for example, Profile (个人主页), My Orders (我的订单), Personal Settings (个人设置), Privacy Policy, User Agreement and Onboarding Agreement.
- Player Center (打手中心): for example, Apply for Skill (申请技能), My Skills (我的技能), My Accepted Orders (我的接单), Order-Taking Hall (接单大厅), My Wallet (我的钱包) and Deposit Management (押金管理).
- External Links (外部链接): Web Link (网页链接), which requires a business domain to be configured.
- Customer Service (客服): Online Customer Service (在线客服) and WeCom Customer Service (企业微信客服).
- Popup (弹窗): shows a popup with images and text when tapped.