几个月前，当我被要求为当地的高尔夫俱乐部重新设计网站时，我知道是时候更新主题了。 我想使用子主题创建新设计，而父主题的明显选择是 Canvas。 Canvas 是我们最通用的主题，非常适合快速将网站与子主题组合在一起。
我希望新设计具有更专业的风格，并且他们对主页布局有特定的需求。 我需要创建一个自定义主页模板，其中包括图像滑块、新闻区、课程信息、Golfbox 登录和赞助商。
在 Photoshop 中设计完网站后，我准备开始编码。 我将 Canvas 安装为父主题，并从包含 style.css、functions.php 和 custom.css 的子主题开始。 如果您是新手，请参阅我们的教程以获取有关子主题的更多信息。
我将浏览网站的每个自定义区域以尝试解释我所做的事情，您可以在 GitHub 上查看该项目以自己学习代码。
开始使用画布
我只想包含我需要的东西，所以首要任务是删除不需要的东西 函数.php：
- 删除反馈 javascript
- 从选项中删除站点宽度
- 从选项中删除自定义样式的输出
- 删除带有主题/框架信息的元标记
- 移动标题内的导航
我在functions.php中添加的其他内容：
- 设置链接到我的徽标图像，因为我不想使用选项面板
- 添加 Coda 和 Arvo Google 字体
一个简单的标题
对于标题，我希望有徽标和导航，以及导航上方的额外联系区域。 我添加了这个联系区域 header_address() 在 函数.php，它基本上在 woo_header_inside 钩。
定制的主页
对于主页，我创建了一个新的 主页.php 在我的孩子主题中并复制了 索引.php 来自父主题，我在其中添加了各个部分的代码。 新闻部分是排除一个类别的常规自定义查询。 课程信息部分是正常的页面查询。 对于这两个领域，我使用 更多的 页面内的标签，仅显示之前的内容 更多的 主页上的标签。
对于主图像滑块，我使用了有关如何将业务滑块添加到默认 WP 主页的教程。 我希望滑块有全宽图像，所以我需要添加相当多的自定义 CSS 来实现这一点，这可能是编码这个主题最棘手的部分。
赞助商滑块像主滑块一样使用 Flexslider，我使用 WP125 插件生成赞助商图像。
我还想在设计中使用一些漂亮的图标，我通过在我的 style.css 中添加一个名为 EightyShades 的网络字体来实现这一点。 这些图标易于使用，只需在要使用的地方添加图标类即可。 我们在 Canvas 中包含 FontAwesome，因此您可以在您的网站中执行相同的操作！
添加插件
我在网站上使用了一些插件：
结论
我在一个周末设计和建造了这个网站，总共花费了大约 10 个小时，与以前的项目相比，这对我来说相当快。 在此过程中，我使用了 Canvas 教程来帮助我。 我希望儿童主题对您有所帮助，如果您不熟悉儿童主题，我建议您从我们的教程开始。 如果您有任何问题，请在评论部分开火。
