以按尺码复购为购买路径的男装主题,区别于按场合发现的路径
tema-prumo — Astro 电商模板
作者 ecomplus
E-Com Plus 的男装电商主题模板,基于 Astro 与 Vue,围绕按尺码复购的购物路径,包含静态尺码表与占位式复购入口。
看看你的网站会是什么样
浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。
全部页面与视图 3
截图用于了解视觉与布局,交互效果请以实际项目为准。
值得关注的模板亮点
从已有项目资料中,快速了解它的特点。
新增男装专区 Astro 组件,通过 c: 约定注册,避免 CMS 内联工具类不生成 CSS 的问题
调整了品牌设置、配色、提示条、首页轮播与橱窗等主题层内容
仓库为薄壳结构,店面与店铺逻辑位于 @cloudcommerce/* 依赖包中
README 明确标注尺码表为静态模型、一键复购仅为文案等已知限制
模板详细介绍
Prumo 是 E-Com Plus 面向男装(正装与衬衫)的店铺主题模板,基于 Astro 与 Vue,由 ecomplus/store 起步模板主题化而来。它把购买路径设定在“复购”而非“发现”上:导航按尺码(如领围 39、袖长 62)组织,首页与内页强调重复购买同一件单品,而不是按场合重新挑选。主题在起步模板基础上调整了 settings.json(品牌名、域名、logo、绿色与黄铜色配色、Pix 折扣、分期与免运费门槛)、Tailwind 中性色与圆角、layout.json 的提示条与页脚、首页的轮播与橱窗,并新增 NichoModaMasculinaSection.astro 作为男装专区组件,通过 c: 约定注册。该专区以 .astro 组件而非 CMS 自定义 HTML 实现,因为 UnoCSS/Tailwind 只扫描 ./src/**,写在 content/pages/*.json 里的工具类不会生成 CSS。仓库是薄壳:店面、组件与店铺逻辑位于 @cloudcommerce/* 包中,升级平台版本靠更新依赖,而不是与起步模板合并。README 明确列出已知限制:尺码表是静态模型,不来自商品数据;“一键复购”只是文案,链接指向起步模板已有的 /app/account,实际流程依赖 smart shelves 产品化;logo 与图标为占位位图;/s/camisaria、/p/medidas 等路由需目录中存在对应分类后才响应。演示站为 noindex,使用共享演示目录。
适合你的项目吗?
适用场景
- 搭建以衬衫、正装等按尺码复购为主的男装店铺前端
- 作为 E-Com Plus 主题定制起点,在主题层修改内容、配色与首页结构
- 研究 Astro 与 Vue 组合下电商主题的组件注册与样式扫描方式
- 用于演示或内部评估男装复购型购物路径的界面原型
适合人群
- 需要男装按尺码复购路径的 E-Com Plus 店铺开发者
- 愿意在主题层(src、content、public)做定制的前端团队
- 接受以更新依赖方式跟进平台版本、而非合并起步模板的项目
上手与定制指南
结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。
- 1
运行 npm i 与 npm run dev,本地地址为 http://localhost:3000
- 2
目录为远程数据源,需通过 npm run setup 配置 E-Com Plus 店铺,否则商品橱窗为空,但轮播、横幅与男装专区仍会渲染
- 3
上线前替换占位内容:settings.json 的品牌名、域名、logo、配色与联系方式,public/img/uploads 的图片,extra-pages 的页面文案,robots.txt 的屏蔽规则,以及 functions/*/config.json 的 storeId 与 Firebase 项目
- 4
README 提到 Firebase 集成,启用相关动态功能前需自行配置并核对 Firebase 的额度与收费
- 5
演示图片来自 Unsplash,字体、图标等第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断
授权与来源资料
使用条件与限制
免费使用 · 保留许可声明本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。
使用时需要遵守
- 允许免费使用、修改、商用和分发该版本代码。
- 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
- 代码按现状提供;担保与责任限制以原许可证及适用法律为准。
额外费用与待核对事项
- README 提及 Firebase 集成;启用相关动态功能前需自行配置,并核对 Firebase 的额度与收费。
- 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
- 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
- 商品目录为远程数据源,必须配置 E-Com Plus 店铺(npm run setup),否则商品橱窗为空。
- 尺码表为静态模型,不来自商品数据,无法随商品信息自动更新。
- “一键复购”仅为文案而非实际功能,链接指向 /app/account,真正的一键流程依赖 smart shelves 产品化。
- Logo 与图标为占位位图,正式使用前需替换并矢量化。
- 部分路由需目录中存在对应分类后才可访问。
- robots.txt 当前屏蔽全部抓取,因演示站为 noindex,上线前需修改。
- 需配置 storeId 与 Firebase 项目,启用动态功能前需自行核对 Firebase 额度与收费。
- 横幅图片来自 Unsplash,需按各自许可核对第三方素材授权。
查看原文依据
Permission is hereby granted, free of charge
许可证原文
O catálogo é remoto: sem uma loja E-Com Plus configurada (`npm run setup`), as vitrines de produto vêm vazias
README 原文
- **A régua de medidas é maquete estática.** Não vem do cadastro de produto.
README 原文
- **O "repetir pedido" é copy, não recurso.** O link vai para `/app/account`, que existe no starter, mas o fluxo de um clique descrito na seção depende do smart shelves ser produtizado.
README 原文
- Logo e ícone são wordmarks placeholder rasterizados. Ao fechar a identidade, vetorizar o texto.
README 原文
- As rotas (`/s/camisaria`, `/p/medidas`…) só respondem depois que o catálogo tiver as categorias correspondentes.
README 原文
- `functions/ssr/public/robots.txt` — hoje bloqueia tudo, porque a demo é `noindex`
README 原文
- `functions/*/config.json` — `storeId` e projeto Firebase (`npm run setup`)
README 原文
https://github.com/ecomplus/tema-prumo/blob/main/LICENSEhttps://github.com/ecomplus/tema-prumo/blob/main/README.mdBanners do Unsplash; imagens do starter removidas. Créditos em `CREDITOS.md`
README 原文
DeepSeek 根据仓库许可证和 README 整理 ·2026-10-13。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。
项目核对记录与介绍依据
模板资料
- 来源平台
- GitHub
- 资料与维护参考分
- 资料较完整 · 85 / 100
- 技术栈
- Astro · Vue
- 网站类型
- 电商
这个分数如何计算
本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。
这个项目需要核对什么
- 记录的仓库更新时间
- 2026-08-03
- 截图检查日期
- 2026-10-13
已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。
目录记录的主要技术栈是 Astro。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。
查看具体选型方法 →介绍的制作与核对状态
介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。
审核声明: [email protected] · 2026-10-13
查看当时使用的来源资料
SHA-256: a87360400878e7067e14d190a5c5ec0932a5ac9ad0e1daf622a7a2716d78c15e
2026-10-13T01:31:01.704Z
来源文件 / 仓库# Prumo — loja demo do nicho de moda masculina Cópia do starter [`ecomplus/store`](https://github.com/ecomplus/store) tematizada para **moda masculina** (alfaiataria e camisaria). É a segunda metade do par de moda, junto com [store-alinhavo](../store-alinhavo/). > **Este nicho ainda não existe no site institucional.** Não há marca em > `src/config/brands.ts` nem página em `/segmentos/`. O posicionamento foi > **proposto**, não portado. Nome, logo e domínio são placeholders. ## Por que duas lojas de moda, e não uma A diferença entre as duas não é a foto: é o **eixo de compra**, e é isso que justifica ter as duas como demos separadas. | | Alinhavo (feminina) | Prumo (masculina) | |---|---|---| | Eixo | **Descoberta** | **Repetição** | | Navegação | Por ocasião (trabalho, festa, praia) | Por medida (colarinho 39, manga 62) | | Problema central | Achar a peça certa e acertar a grade | Repor o mesmo item sem refazer a pesquisa | | Bloco de fecho | Primeira troca de tamanho grátis | Repetir o último pedido em um clique | | Ciclo | Muda a cada estação | Camisa branca não muda de estação | O bloco de recompra do Prumo é aplicação direta do **"repetir último pedido"** que a [auditoria de recursos](../planning/produto/planejamento/auditoria-recursos-storefront.md) lista como parte do smart shelves da Atlas Parafusos — hoje construído sob medida em uma loja só, marcado como PARCIAL, ainda fora do template padrão. ## O que foi customizado em relação ao starter | Arquivo | O que mudou | |---|---| | `functions/ssr/content/settings.json` | Nome, descrição, domínio, logo/ícone, `primaryColor` verde-loden + `secondaryColor` latão, 5% no Pix, 6x sem juros, frete grátis a partir de R$ 349 | | `functions/ssr/tailwind.config.js` | Escala neutra levemente esverdeada, canto quase reto | | `functions/ssr/content/layout.json` | Pitch bar (medida, frete, Pix), listas do rodapé, `ogImage` | | `functions/ssr/content/pages/home.json` | Hero de 2 slides, 3 vitrines, grade de 3 banners e a seção de nicho | | `functions/ssr/src/sections/NichoModaMasculinaSection.astro` | **Novo.** Régua de medidas em cm, três caimentos declarados e chamada de recompra | | `functions/ssr/src/sections/_Sections.astro` | Registro da seção `c:nicho-moda-masculina` | | `functions/ssr/content/extra-pages/` | Contato, trocas e termos em PT-BR | | `functions/ssr/public/img/uploads/` | Banners do Unsplash; imagens do starter removidas. Créditos em `CREDITOS.md` | ## Por que loden e não azul-marinho Azul-marinho é o lugar-comum da categoria, e o azul-aço já está ocupado pela variante de clubes de tiro. O verde-loden com latão vem do vestuário masculino de herança (militar/utilitário), que é o campo de referência do nicho — e é o que a foto de banner (arara de peças em terrosos e mostarda) já entrega. ## Por que a seção de nicho é um componente, e não HTML no CMS O UnoCSS/Tailwind desta stack varre apenas `./src/**` — classe utilitária escrita dentro de `content/pages/*.json` (seção `custom-html`) não gera CSS. Por isso a vitrine do nicho é um `.astro` em `src/sections/`, registrado pela convenção `c:` que o `_Sections.astro` já previa. ## Rodando ```bash npm i npm run dev # http://localhost:3000 npm run build ``` O catálogo é remoto: sem uma loja E-Com Plus configurada (`npm run setup`), as vitrines de produto vêm vazias — o hero, os banners e a seção de nicho renderizam normalmente. ## Pendências conhecidas - **A régua de medidas é maquete estática.** Não vem do cadastro de produto. - **O "repetir pedido" é copy, não recurso.** O link vai para `/app/account`, que existe no starter, mas o fluxo de um clique descrito na seção depende do smart shelves ser produtizado. Está marcado no componente. - Logo e ícone são wordmarks placeholder rasterizados. Ao fechar a identidade, vetorizar o texto. - As rotas (`/s/camisaria`, `/p/medidas`…) só respondem depois que o catálogo tiver as categorias correspondentes. - Se a hipótese avançar, vale criar a marca em `brands.ts` e a rota `/demo/prumo` no site, como já existe para as três primeiras variantes. ## Como atualizar a base da plataforma Este repositório é uma **casca fina**. O storefront, os componentes e a lógica de loja moram nos pacotes `@cloudcommerce/*`, não aqui. Atualizar o tema para uma versão nova da plataforma **não** é fazer merge com o starter [`ecomplus/store`](https://github.com/ecomplus/store) — é subir a versão das dependências, exatamente como as lojas em produção fazem: a [tiasonia](https://www.tiasonia.com.br) tem mais de 260 commits `Update to v` no próprio repositório e nenhum merge com o starter. Todos os pacotes `@cloudcommerce/*` andam na mesma versão, na raiz e em cada grupo de functions (`ssr`, `many`, `with-apps`): ```bash # 1. ver a versão mais recente e o changelog npm view @cloudcommerce/cli version # https://github.com/ecomplus/cloud-commerce/releases V=2.61.4 # troque pela versão alvo # 2. raiz npm i -D @cloudcommerce/cli@$V @cloudcommerce/eslint@$V # 3. cada grupo de functions (cd functions/ssr && npm i \ @cloudcommerce/api@$V @cloudcommerce/firebase@$V @cloudcommerce/ssr@$V \ @cloudcommerce/i18n@$V @cloudcommerce/storefront@$V @cloudcommerce/types@$V) (cd functions/many && npm i \ @cloudcommerce/feeds@$V @cloudcommerce/firebase@$V @cloudcommerce/passport@$V) (cd functions/with-apps && npm i \ @cloudcommerce/events@$V @cloudcommerce/firebase@$V @cloudcommerce/modules@$V) # 4. validar antes de commitar npm run build # 5. commitar no padrão das lojas em produção git commit -am "Update to v$V" ``` Se o build quebrar depois de atualizar, a correção pertence ao [`cloud-commerce`](https://github.com/ecomplus/cloud-commerce), não a este repositório. Aqui só entra o que é **do tema**: `functions/ssr/src/`, `functions/ssr/content/` e `functions/ssr/public/`. ## Este repositório é um template Use **"Use this template"** no GitHub para começar uma loja a partir deste tema. O repositório gerado é independente: não existe upstream para puxar, e a manutenção segue o fluxo de versão acima. Antes de ir ao ar, troque o que é placeholder: - `functions/ssr/content/settings.json` — nome, domínio, logo, cores, contato - `functions/ssr/public/img/uploads/` — logo, ícone e banners (as fotos atuais vêm do Unsplash; créditos em `CREDITOS.md`) - `functions/ssr/content/extra-pages/` — contato, trocas e termos - `functions/ssr/public/robots.txt` — hoje bloqueia tudo, porque a demo é `noindex` - `functions/*/config.json` — `storeId` e projeto Firebase (`npm run setup`) > **Demo publicada:** [tema-prumo.web.app](https://tema-prumo.web.app) — `noindex`, com > catálogo compartilhado de demonstração. --- Documentação do starter: [SETUP.pt-BR.md](./SETUP.pt-BR.md) · [Cloud Commerce](https://github.com/ecomplus/cloud-commerce)
看看同类模板
对比同技术栈与用途的模板,找到更适合的视觉与内容结构。

astro-shopify
astro-shopify 是一个面向开发者的轻量级电商启动模板,用于构建基于 Shopify 的无头店面。
Astro · 电商

astro-ecommerce
Astro Ecommerce - Ready to use components
Astro · 电商

astro-medusa-starter
Astro + Medusa starter for e-commerce. Optimized to the core.
Astro · 电商

sanity-astro-club
sanity-astro-club 开源网站模板。
Astro · 电商

atelier-ko
Atelier Kō 是一个为小型家具工坊或类似手工艺目录设计的 Astro 电商主题,它的核心假设是:作品不多,摄影足够有力,因此界面刻意保持冷静和建筑感。
Astro · 电商

starter-astro
A small, production-minded storefront starter for Astro.
Astro · 电商
