使用 Astra Pro 样式化 WooCommerce 单一产品页面

WooCommerce 是一个强大的电商平台,结合 Astra Pro 插件,商家可以对单一产品页面进行个性化定制,增强网站功能和视觉吸引力。本文将介绍如何使用 Astra Pro 对 WooCommerce 单一产品页面进行设计优化。

20250414144459308-image

安装与激活 Astra Pro 插件

首先,确认已安装并激活以下插件:

  • Astra 主题
  • Astra Pro 插件
  • WooCommerce 插件

启用 WooCommerce 模块后,进入 仪表盘 > 外观 > Astra 选项,然后在 外观 > 自定义 > WooCommerce > 单一产品 中开始进行页面自定义。

产品标题区域设置

Astra Pro 提供丰富的选项来定制产品页面的标题区域。在 外观 > 自定义 > WooCommerce > 单一产品 中,调整以下内容:

20250414150507543-image
  • 标题显示:选择是否显示产品标题。
  • 横幅布局:自定义产品横幅的样式。
  • 面包屑导航:启用面包屑导航帮助用户轻松浏览页面。
  • 摘要:展示简短的产品描述。
  • 元数据:展示产品的类别或标签等信息。
20250414150514576-image

容器布局选择

Astra Pro 提供三种容器布局方式,帮助调整产品页面的布局:

  • 默认布局
  • 正常布局
  • 全宽布局
20250414150523634-image

根据需求选择合适的布局,确保页面视觉效果的整洁与美观。

侧边栏布局

Astra Pro 插件为产品页面提供了多个侧边栏布局选项:

  • 默认布局
  • 无侧边栏
  • 左侧边栏
  • 右侧边栏
20250414150530304-image

选择适合的侧边栏布局,或者在不需要侧边栏时选择 无侧边栏

画廊展示与图片缩放效果

在产品图像展示方面,Astra Pro 提供几种画廊布局:

  • 垂直布局
  • 水平布局
  • 首图大图
  • 垂直滑块
  • 水平滑块
20250414150539376-image

此外,还可以启用 图片缩放效果,让用户在鼠标悬停时放大产品图像,查看更多细节。

20250414151117716-image

固定产品图像与摘要

Astra Pro 允许启用以下功能,提升页面的可视性:

  • 固定产品图像:滚动页面时,产品图像会固定在页面顶部,始终保持可见。
  • 固定产品摘要:滚动页面时,产品摘要会始终保持在页面顶部,方便查看。
20250414151042450-image

产品导航与变体展示

Astra Pro 为产品页面提供了以下功能:

  • 产品导航:用户可以轻松在不同产品间切换,提升页面的互动性。
20250414151152450-image
  • 产品变体展示:对于拥有多个变体的产品,可以选择将变体展示为并排或堆叠布局。
20250414151203904-image

产品描述与相关产品展示

通过 Astra Pro,商家可以灵活定制产品描述和相关产品展示:

  • 产品描述标签:选择标签展示方式,包括垂直、水平或手风琴式布局。
20250414151232723-image
  • 相关产品展示:在产品页面底部展示相关产品或追加销售产品,提升用户购物兴趣。
20250414151311870-image

固定添加到购物车按钮

启用 固定添加到购物车按钮 后,用户在浏览页面时,无论滚动到哪,添加到购物车按钮始终保持可见,方便随时添加商品到购物车。

20250414151320249-image

总结

Astra Pro 插件为 WooCommerce 单一产品页面提供了强大的定制功能。从标题区域、容器布局、侧边栏设置,到画廊展示、固定图像和摘要功能,每个选项都帮助商家打造更具吸引力和功能性的产品页面。这些自定义功能能够提升产品展示效果,增加页面互动性,帮助商家吸引更多客户,推动更多转化。

相关文章



了解 宝藏号 的更多信息

订阅后即可通过电子邮件收到最新文章。

© 版权声明

相关文章

暂无评论

none
暂无评论...

了解 宝藏号 的更多信息

立即订阅以继续阅读并访问完整档案。

继续阅读