kyugao/sewjoy-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
kyugao
2026-06-22 00:43:05 +08:00
parent d074a80cac
commit acae35700e
15 changed files with 31931 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
page-templates/page-builder.php
+70
View File
@@ -0,0 +1,70 @@
<?php
/**
* Template Name: 产品定制器
*
* A custom page template that renders the product customizer UI.
*
* @package SewJoy_Theme
*/
get_header();
?>
<main id="main" class="site-main site-main--builder">
<section class="builder">
<header class="builder__header">
<h1 class="builder__title">定制你的产品</h1>
<p class="builder__subtitle">从以下组件中选择你的偏好，打造独一无二的商品。</p>
</header>
<div class="builder__components">
<!-- Component A -->
<fieldset class="builder-component" data-component="A">
<legend class="builder-component__title">组件A</legend>
<div class="builder-component__options">
<button type="button" class="builder-option" data-component="A" data-option="A1">选项1</button>
<button type="button" class="builder-option" data-component="A" data-option="A2">选项2</button>
<button type="button" class="builder-option" data-component="A" data-option="A3">选项3</button>
</div>
</fieldset>
<!-- Component B -->
<fieldset class="builder-component" data-component="B">
<legend class="builder-component__title">组件B</legend>
<div class="builder-component__options">
<button type="button" class="builder-option" data-component="B" data-option="B1">选项1</button>
<button type="button" class="builder-option" data-component="B" data-option="B2">选项2</button>
<button type="button" class="builder-option" data-component="B" data-option="B3">选项3</button>
</div>
</fieldset>
<!-- Component C -->
<fieldset class="builder-component" data-component="C">
<legend class="builder-component__title">组件C</legend>
<div class="builder-component__options">
<button type="button" class="builder-option" data-component="C" data-option="C1">选项1</button>
<button type="button" class="builder-option" data-component="C" data-option="C2">选项2</button>
<button type="button" class="builder-option" data-component="C" data-option="C3">选项3</button>
</div>
</fieldset>
</div>
<section class="builder__summary" aria-live="polite">
<h2 class="builder__summary-title">当前选中的组件组合</h2>
<ul class="builder__summary-list">
<li id="summary-A" data-summary="A">组件A：<span class="builder__summary-value">未选择</span></li>
<li id="summary-B" data-summary="B">组件B：<span class="builder__summary-value">未选择</span></li>
<li id="summary-C" data-summary="C">组件C：<span class="builder__summary-value">未选择</span></li>
</ul>
</section>
<div class="builder__actions">
<button type="button" class="builder__add-to-cart">加入购物车</button>
</div>
</section>
</main>
<!-- page-builder.php 已加载 -->
<?php
get_footer();