在使用 WordPress 启动 WooCommerce 商店时，Storefront 是最灵活和可扩展的主题之一。由于其干净的代码架构，它在用户中非常受欢迎，目前超过 100,000 个在线商店使用 Storefront 作为他们的 WordPress 主题。
安装 WooCommerce 店面主题
您可以通过两种方式安装 Storefront WordPress 主题，方法是从仪表板搜索主题或手动上传主题。
使用 WordPress 仪表板安装
安装 Storefront 的最快方法是通过 WordPress 仪表板。按照以下步骤通过 WordPress 仪表板安装 Storefront 。
- 转到外观> 主题> 添加新的
- 在搜索框中输入 “Storefront ”，然后按 Enter 键。
- 将鼠标悬停在 Storefront 屏幕截图上。
- 选择 “ 安装 ” 按钮。
- 单击 “ 激活”
手动安装 Storefront
- 从 wordpress.org 下载最新版本的 Storefront
- 转到外观> 主题> 添加新的
- 单击 Upload Theme 并选择以前下载的 zip 文件。
- 单击立即安装
- 单击 “ 激活”
购买中文版：
https://mall.weixiaoduo.com/item/storefront
设置主页
Storefront 有一个经过深思熟虑的内置主页模板。其干净的结构将帮助您的受众轻松找到您销售的产品。默认的 Storefront Homepage 模板中有 6 个部分。但您可以根据需要添加或删除该部分。查看此演示，以便清楚了解 Storefront 主页。
默认主页部分：
- 页面内容
- 产品类别
- 最新产品
- 特色产品
- 热门产品
- 销售产品
- 最畅销的产品
分配主页模板
要设置主页模板，请按照下列步骤操作：
- 转到仪表板 – > 页面并创建一个标题为 “ 主页 ” 或任何您喜欢的页面。
- 添加您喜欢的任何欢迎内容，这些内容将显示在产品上方。
- 在右侧，您会看到一个标题为 “ 页面属性 ” 的框
- 从 “ 模板 ” 下拉列表中选择 “ 主页 ” 。
- 单击 “ 发布”或 “ 更新”以保存更改。
显示主页模板
发布页面后，现在您必须将此主页显示为您网站的首页。因此，任何登陆您网站的人都会首先看到此页面。要进行此设置，请按以下步骤操作：
- 转到仪表板> 设置> 阅读
- 在您的主页显示下选择静态页面（在下面选择）
- 在 “ 主页”下拉列表中选择以前的主页模板分配页面。
- 单击 “ 保存更改”
重新排序店面主页部分
您可以使用挂钩或使用名为 Homepage Control 的插件更改 Storefront Homepage 部分的顺序。请按照以下步骤重新订购您的主页部分：
- 下载并安装主页控制
- 转到外观 – > 自定义 – > 主页控制
- 根据需要拖动并重新排序部分。
- 单击 “ 保存并发布”以保存更改。
配置菜单
在店面主题中，您可以在 3 个位置显示菜单。
- 主菜单 – 显示在站点徽标下方。
- 二级菜单 – 在搜索框附近的徽标旁边。
- 手持菜单 – 移动设备菜单。
设置菜单
默认情况下，如果未设置特定的主菜单，WordPress 会将您的所有页面显示为主菜单。有时它会让用户感到困惑，并且很难弄清楚这些页面是如何进入菜单的。
创建新菜单并向其添加页面
- 转到 “管理” 面板，然后选择 “外观”>“菜单”
- 在顶部，您将找到 “菜单名称” 字段。在这里写下您的菜单名称。
- 从左侧单击 Pages（假设您要将页面添加到菜单）
- 单击 “查看全部” 以获取所有已发布页面的列表。
- 勾选要在菜单上显示的页面。
- 选择页面后，单击 “添加到菜单” 按钮。
- 拖放菜单项以根据您的喜好重新排列它们。
- 单击保存菜单
分配菜单
创建菜单后，将菜单指定到要显示的位置。导航到外观> 菜单> 菜单设置，然后从显示位置复选框中选中位置。
添加类别菜单
- 转到 “管理” 面板，然后选择 “ 外观”>“菜单”
- 单击左上角的 “ 屏幕选项”，然后选中 “ 产品类别”
- 现在，在左侧窗格中将显示 “产品类别” 选项卡。
- 单击 “产品类别” 选项卡以展开，选择类别
- 选择后，单击 “ 添加到菜单”按钮。
- 拖放菜单项以根据您的喜好重新排列它们。
- 单击 “ 保存”菜单
小工具设置
店面允许您在 3 个不同区域中显示六个小工具区域。
- 侧栏 – 主站点内容的左侧或右侧，
- 标题下方 – 位于网站标题下方和内容上方。
- 页脚列 1 – 页脚区域
- 页脚列 2 – 页脚区域
- 页脚列 3 – 页脚区域
- 页脚列 4 – 页脚区域
设置 WooCommerce
安装 WooCommerce
- 转到仪表板> 插件> 添加新 > 搜索插件
- 搜索 “WooCommerce” 。
- 单击立即安装。
- 单击 “ 激活”。
配置 WooCommerce
激活 WooCommerce 后，系统会提示您使用向导安装 WooCommerce 。它将处理所有初始设置。它分为 6 个部分。
- 页面设置 – 自动配置基本页面（商店，购物车，结账，我的帐户）。
- 商店位置 – 配置商店位置，货币和销售税
- 装运 – 配置重量单位和尺寸单位
- 付款 – 设置付款网关。
- 主题 – 安装兼容 WooCommerce 的主题。
- 就绪 –（可选）允许 WooCommerce 收集使用信息。
您可以随时通过 WooCommerce 仪表板进行所有这些设置。
将产品添加到 WooCommerce
- 转到 WordPress 仪表板
- 单击 Products> Add New
- 在产品名称字段中写下您的产品名称或标题。
- 在下面的编辑器中写下您的产品描述
- 现在，您必须将产品的特色图像和其他图像上传到产品库。
- 一个右边你会找到标题为产品图像和产品库的方框
- 将特色图像上传到产品图像，将其他图像上传到产品库
- 单击 “ 发布”。
设置产品价格和属性
设置产品价格转到仪表板> 产品并选择任何产品。然后向下滚动到 “产品数据” 部分。以下是所有产品数据部分设置的简短说明：
产品类别
- 简单的产品：简单的单品。
- 分组产品：作为系列一部分的产品。
- 外部/会员产品：商店中列出的产品，但实际产品在其他地方销售。
- 可变产品：具有变化（尺寸，颜色）的产品
- 虚拟产品：不需要运输的产品。
- 可下载产品：您必须提供可下载文件的产品。
一般
- 常规价格：常规产品价格。
- 销售价格：折扣产品价格。
库存
- SKU：库存单位（SKU）跟踪产品
- 管理库存：启用库存管理
- 库存状态：产品是否有库存或缺货。
- 单独出售：可以单个订单出售。
运输
- 重量：产品重量。
- 尺寸：产品的长度，宽度和高度。
- 运输类别：与某些运输方式类似的产品类别。
关联产品
- 加售：在产品详细信息页面下方显示相关产品。
- 交叉销售：在购物车页面显示相关产品。
- 属性：选择产品全局属性。
高级
- 购买须知：完成购买后发送给客户的注意事项。
- 菜单顺序：此产品的定制订购位置。
- 启用评论：启用或停用产品评论。
自定义店面
要自定义 Storefront 主题，我们将使用 Storefront Design Customizer 。
如何添加徽标
按照以下步骤为您的网站添加和显示徽标：
1 。转到 WordPress 管理员，然后选择外观> 自定义
2. 然后转到站点标识> 徽标
3. 单击选择徽标以上载徽标图像。（推荐图像尺寸：470px X 110px）
4 。单击 “发布” 。
在哪里上传网站 favicon
按照以下步骤添加和显示网站的图标：
1 。转到 WordPress 管理员，然后选择外观> 自定义
2. 然后转到网站标识> 网站图标
3. 单击选择图像上传您的徽标图像。（建议图像大小：512px X 512px）
4 。单击 “发布” 。
如何添加顶栏
安装 Storefront Design Customizer Pro 后，您可以选择显示 Topbar 。您可以在哪里显示您的电子邮件地址，电话号码，社交帐户，菜单和提供文本。
按照以下步骤将顶部栏添加到 Storefront：
1. 转到外观> 自定义> 标题> 顶部栏
2. 填写以下字段：
电子邮件地址：
电话号码：
Topbar 文本：
社交菜单：
3. 单击 “发布”
如何更改帖子归档或博客布局
- 转到外观> 自定义> 博客自定义程序> 发布存档
- 从 Post Archive Layout 中选择布局
- 单击 “ 发布”
如何更改帖子归档或博客列
- 转到外观> 自定义> 博客自定义程序> 发布存档
- 从 Post Archive Column 中选择列号（Full Width，2 Column，3 Column＆4 Column）
- 单击 “ 发布”
如何更改单个帖子或文章布局
- 转到外观> 自定义> 博客自定义程序> 单个帖子
- 从单个帖子布局中选择布局
- 单击 “ 发布”
如何更改字体
- 转到外观> 自定义> 常规样式> 排版
- 从字体配对中选择字体
- 单击 “ 发布”
WooCommerce 定制
如何更改商店页面布局
- 转到外观> 自定义> WooCommerce> 商店页面 – 产品列表
- 从产品存档布局中选择布局
- 单击 “ 发布”
如何更改产品详细信息页面布局
- 转到外观> 自定义> WooCommerce> 商店页面 – 产品列表
- 从产品存档布局中选择布局
- 单击 “ 发布”
如何更改星级颜色
- 转到外观> 自定义> WooCommerce> 评级，销售徽章及其他
- 单击星形颜色以更改颜色。
- 单击 “ 发布”
如何更改销售徽章颜色
- 转到外观> 自定义> WooCommerce> 评级，销售徽章及其他
- 单击销售徽章颜色和销售徽章背景颜色以更改颜色。
- 单击 “ 发布”
原文链接：https://woocommerce.weixiaoduo.com/post/3830 转载请注明。
