关于如何创建 WordPress 主题的 17 个教程 2022
已发表: 2022-05-06我们 Colorlib 对创建独特且成功的 WordPress 主题了解一两件事,我们自己的定制主题库已经包含 8 个主题,我们正在夜以继日地工作以增加这一数量,同时兼顾客户支持和反馈管理等事情在这一切的中间。 WordPress 多次强调 Colorlib 主题,Adobe 等世界领先品牌正在使用 Colorlib 主题来设计他们的博客。
我们对这些成就感到非常自豪。 然而,由于我们的工作量很大,而不是编写自己的关于如何创建 WordPress 主题的教程,我们想分享一些我们从一系列 WordPress 开发人员那里得到启发的教程,其中一些你肯定会拥有以前听说过。 但是,我们确实提供了有关如何创建自己的 WordPress 网站的详尽教程。
WordPress
就开发人员而言,WordPress 主题环境在过去几年中发生了巨大变化。 尽管 WordPress 样式本身是一个 PHP 平台,但它涉及大量使用现代网页设计中的 HTML5 和 CSS3 元素,除了 WordPress 样式需要具体了解 WordPress 如何解释样式之外,您会发现更多关于此的信息,其中WordPress Codex 的主题开发页面上的其他重要元素。

它不再只是容器,而是容器可以支持的功能类型:响应式设计、社交媒体小部件、内容优化等。 从头开始创建一个 WordPress 主题是可行的,对于那些对网页设计有简明理解的人来说,最好的结果是可能的——不管怎样,创建自己的 WP 主题会有很多乐趣,享受这个过程,你可能会为自己发展一项技能,这可能会成为你一直在寻找的第二份工作。
作为 WordPress 开发人员和用户,我们知道本质上称为 WordPress Skeleton 和 WordPress Boilerplate 主题的内容。 这些是模板的预构建原始版本,您可以使用自己的代码进一步设置样式。 完成教程后,我们还将列出其中的一些。 如果您自己是开发人员,我们很乐意提供您自己的任何与制作 WordPress 主题相关的教程,您可以发表评论或使用电子邮件联系。
您可以直接访问这篇文章的所有三个部分:
WP主题教程
WordPress 样板主题
视频教程:创建 WP 主题
WordPress 视觉页面构建器的增长

Visual Composer 是 WordPress 使用最广泛的页面构建器,以至于它已经有 135,000 个销量,天知道还有多少自定义主题正在将 Visual Composer 集成到他们的代码库中。 在过去十年中,创建自己的网页设计的格局确实发生了变化,更多的初学者可以使用页面构建器来创建自己独特的网站设计。
但是,页面构建器能否超越使用编程语言从头开始创建自定义 WordPress 主题的艺术? 如果你想使用 Visual Composer,你仍然需要有一个可以使用的主题; 尽管它确实支持所有 WordPress 主题。 查看使用 Visual Composer 的网站,很明显,可以提供自定义工作的开发人员之间的竞争非常激烈,并且只是为 WP 用户提供了一个简单的替代方案,让他们可以随心所欲地创建。
创建自己的 WordPress 主题的好处不难发现。 您可以在用于为网站提供动力的平台中体验真实的编程环境,而且无论如何学习 WordPress 语法并不是那么糟糕。 从头开始的主题意味着您可以从网格布局开始就考虑到性能和可用性来构建它。 对定制 WP 主题的需求不会很快消失,所以适合自己,如果编程是你喜欢做或想要练习的事情,没有比直接陷入泥潭更好的选择,并开始玩以下教程。
如何从头开始制作 WordPress 主题?

快速教程有助于理解你正在构建的结构,这也让你了解你正在使用的当前主题。 花在学习基础知识上的时间越多,就越容易注意到主题的特定功能是如何工作的。 您将在本教程中学习如何创建一个基本的 WordPress 主题结构,该结构由页眉、页脚、内容区域和侧边栏组成。 按照作者的建议,最好在本地启用的服务器上练习。 最终结果是一个基本的 WordPress 主题大纲,您可以通过沉浸在我们的列表或网络中的其他教程中开始构建它。
从头开始创建一个简单的 WordPress 主题

您将在本教程集合的最后部分找到更多来自 YouTube 的视频教程,不过现在,我们想提一下 SitePoint 的 5 分钟快速教程,介绍如何为 WordPress 主题创建自己的基础。 你最终会得到一个非常简单的主题骨架,并且更好地理解如何开始使用 CSS 设置单个元素的样式。
初学者指南:如何创建 WordPress 主题

Shahid Siddique 在创作主题方面拥有丰富的经验。 尽管他的教程将侧重于基础知识,但您也将对该过程进行更深入的研究。 他分享的代码片段更高级,允许他创建一个更面向网格的主题基础,更容易构建。 所有 WordPress 主题都包含相同的文件,但如果您正在构建需要集成到单个文件中的其他插件和小部件则除外。
如何从头开始创建 WordPress 主题 — 权威指南

任何涉及创建自己的东西的项目总是令人振奋。 您正在踏上了解 WordPress 和更多编程的旅程,最终您将能够完全维护自己的主题。 这是页面构建器无法提供给您的东西。
Soumil Roy 正在编写一份权威指南,以了解 WordPress 主题以及如何从头开始构建它们。 到目前为止,他已经发布了两个教程,并且在我们说话的时候他正在做更多的工作。 两个因素已经很突出:主题将使用 Bootstrap 框架构建,本教程将包括有关如何在本地设置自己的 Web 服务器的指导。 如果您查看将要构建的最终版本,这很可能最终成为您需要的唯一教程系列。 急切地等待下一部分。
一步一步用 Bootstrap 和下划线创建 WordPress 主题

下划线来自 WordPress Core 平台本身的实际开发人员,因此您绝对掌握得很好。 这个骨架主题已经在数千个独特的 WordPress 设计中找到了用途,如果您想加入这个帮派,请跟进 Sigit Prasetya Nugroho 的教程,他的代码示例和见解可以让您更广泛地了解下划线以及它是如何实现的用于制作几乎任何 WP 主题体验。 他的评论框中也提供了有用的建议,看看吧。
从头开始创建自定义 WordPress 主题

到目前为止我们已经学到的大部分内容的简明回顾教程。 展示了如何为一个主题构建一个基本的 WP 基础,该主题将完全准备好进行样式设置和自定义。
在 WordPress 中制作原创企业主题

企业主题是 WordPress 生态圈中下载/购买最多的一些主题。 为什么你可能会问? 嗯,似乎企业在使用 WordPress 作为其前端和后端平台来发布他们的商业网站以及通过社区和内容管理它们方面取得了巨大的成功。 这里的教程系列来自 Baris Unver,他专注于教新的 WP 开发人员如何为企业目的创建一个灵活但令人惊叹的 WordPress 主题。 第一个教程侧重于主页和关于页面,而他的第二个教程深入介绍了页面类型。 我们期待该系列中的更多内容,因此请密切关注它们。
主题框架如何实际工作

WordPress 主题框架实际上就是能够从单个位置创建自定义 WordPress 主题。 该框架提供了所有功能,并且可以使用子主题来充分利用该功能。 您之前很可能听说过 Genesis、Canvas 和 WordSmith 等框架。 这些都是数十万用户在使用的非常有名的 WP 框架,但是 WP 框架到底是如何工作的呢? 这就是来自 Tutsplus+ 的 Rachel McCollin 正在努力实现的使命。 您将从一个深入的系列(已经有 11 篇文章)中学习,向您展示如何为主题创建自己的 WordPress 框架,以及您需要涵盖哪些方面来创建一个能够直接构建其他主题的独特框架从管理仪表板。
DRY WordPress 主题开发

代码重复不会对您正在构建的性能产生任何好的结果,不用说,当所有代码不断重复自己时,开发人员打开您的主题并尝试理解它可能会让人不知所措。 Rachel McCollin 是一位 WordPress 开发专家,她正在分享她关于 DRY(不要重复自己)方法的知识,以及如何掌握这种方法来创建通用的代码。 使用这种方法,编辑代码和添加新功能只需要完成一次,它将允许其他开发人员在您已经构建的基础上进行构建,而不会产生不必要的挫败感。 很棒的文章,充满了“啊哈”的时刻。
从头开始开发 WordPress 主题

了解 HTML5、CSS3 和 JavaScript 等编程语言对启动 WP 主题项目非常有帮助; 但是,如果您还没有这些技能,请不要担心,因为只要有足够的练习和决心,成功就在眼前。 作者在这里所做的,她采用了现有的 Bootstrap 博客模板,并帮助您将该模板转换为可以复制该设计的功能性 WordPress 主题。 这是一种更高级的方法,但对初学者仍然友好。 您将使用一系列文章(目前有 2 个可用),这些文章是关于 WP 基础架构如何工作以及如何学习成为 WP 主题忍者的深入教程。 所有代码也可供下载。
如何创建和自定义 WordPress 子主题

只需一点点编程语言,您就可以对现有模板进行如此多的更改。 您还可以随时开始构建自己的模板。 子主题是您原始主题的备份。 您可以对子主题进行任何数量的更改,而不必担心在实时生产 WordPress 安装上推出损坏的更改。 子主题虽然不一定比自定义硬主题更容易使用,但确实在构建 WP 主题的方式上提供了一些独特的转折,以更好地支持您对完美设计的想法。 涵盖所有 WordPress 子主题的高级教程。

最佳实践:为什么以及如何在 WordPress 中创建子主题

子主题是继承和覆盖其父样式和模板的主题。 就像生活一样,没有父母,就没有孩子。 在 WordPress 中,没有父主题就不能存在子主题。 父主题是作为独立主题创建的任何主题。 WordPress 附带的每个默认主题(二十五、二十四等)都是父主题。 它们不依赖任何其他主题来工作和发挥作用。 因此,如果您正在寻找更窄的儿童主题方法,请查看 Matt Cromwell 的 WP 儿童主题介绍指南。
如何在 Bootstrap 上构建 WordPress 响应式主题

即使您不打算构建任何 WordPress 主题,了解 Bootstrap 框架也会有所帮助。 Bootstrap 可提供流畅的前端开发体验,并让您全面了解设计在浏览器内部和 Web 上的工作原理。 值得一提的是,使用 Bootstrap 意味着您可以在设计中使用任何 Bootstrap 组件,从本质上将开发时间减少到几个小时,而不是几天。 如果您喜欢 Bootstrap 并且长期以来一直在考虑制作主题,那么您将很高兴阅读本教程,该教程展示了如何创建 Bootstrap 支持的新 WP 主题。
使用 REST API 和 Vue.js 创建 WordPress 主题

REST API 和 Vue.js; 听起来很复杂! 它可能适用于那些以前没有开发经验的人。 所以,我们把最复杂的教程留在了最后,这对于之前已经构建过主题并且需要一种新的方式来挑战自己的 WP 开发人员来说会派上用场。 我们相信,学习如何仅使用 REST 和 Vue 来制作主题将具有足够的挑战性。
用于创建自定义样式的 WordPress 主题样板
在许多不同的上下文中,对样板的理解不同,尤其是在 Web 开发和业务中。 就 WordPress 主题而言,样板是一个预先构建的 WordPress 主题基础,您可以在此基础上继续使用您正在使用的样板的预定义功能。 这通常被称为快速发展。 快速获得漂亮的结果将需要更少的努力。 我们知道以下几个 WordPress 样板。 但是,我们鼓励您与我们分享在我们的研究过程中可能遗漏的任何其他内容。 谢谢!
仅供参考:您可以从所有这些教程中应用您新学到的技能。 在使用以下样板模板时使用它们。 这是锻炼所学知识的好方法。 将它与遵循某些开发风格规则的代码库结合起来。
WordPress 样板

WordPress 通常会被视为一个简单的博客平台。 这是一个面向初学者的内容平台。 然而,有多少人真正谈论在添加新主题、插件、小部件的过程中发生的所有混淆,以及必须维护新的 WP 更新。 此外,它使所有这些功能彼此分离,让您专注于真正重要的事情。
WordPress 的 HTML5 样板

WordPress 的 HTML5 样板基于实际的 HTML5 样板模板。 该模板采用现代 HTML5 语法,允许从一开始就制作移动响应和通用浏览器优化的网站。 布局有很大的改进空间,但就样板而言,这是需要更多探索的东西。
智者

Sage 样板建立在一些非常现代的技术之上:
- HTML5
- 引导程序
- SASS
- 与 Gulp 和 Bower 包管理器协同工作
这种安装最适合那些认真对待 WordPress 平台并希望通过使用包管理器来优雅地扩展它的初创公司或企业。
基岩

Bedrock 是来自 Roots 开发者的又一个很棒的样板。 它使用 Composer 来管理依赖项。 Bedrock 具有易于修改的配置文件、WordPress 多站点支持以及一些独特的安全功能,可让您的博客远离黑客之手。
WP React 样板

使用 Gregory Cornelius 的这个 WP React Boilerplate 了解 React for WordPress 的潜力。
骨架 WordPress 主题

Skeleton 是一个完全响应的 WordPress 主题。 它的构建目的是允许开发人员和设计人员在现有内核之上构建新功能。
视频教程:创建 WordPress 主题
从教科书(包括博客文章和文章)中学习编程可能会让人不知所措。 您几乎每分钟都“被迫”查看教程详细信息。 这就是为什么视频教程也有巨大市场的原因。 我们发现有相当多的视频教程与从头开始创建 WordPress 主题相关。 因此,我们将尝试提及我们认为最独特或通常认为最好的那些。 我们很乐意在这个特定的部分扩展更多的视频教程,如果你有一些隐藏在你的袖子里的东西,请发送给我们。
请单击视频图像以在新窗口中打开视频。
WordPress 101:从头开始创建主题

第一个视频教程来自 Alessandro Castellani。 他正在制作有用的“WordPress 入门”视频。 它可以帮助 WordPress 的新手更加灵活地使用他们使用的内容管理系统。 第一个视频教程大约 20 分钟长。 它解释了 WordPress 主题的许多方面。 并向您介绍工具和必要的文件系统,您必须了解这些工具和必要的文件系统才能开始创建自己的 WordPress 主题。 该视频已经留下了数百条评论,这表明这是一个可靠的教程,首先。
从头开始创建 WordPress 主题

第二个视频来自 JREAM,这是一个与数字管理相关的课程资源。 本教程稍长。 总共 30 分钟,并解释了如何实现一个最小的 WordPress 主题的结果,一旦你创建了它就可以进行内容发布。 再一次,一个易于关注的视频,您可以随时暂停或跳过。 查看评论以获取更多参考资料或其他学习材料。
如何在 4 分钟内创建 WordPress 子主题

Kattrinah 有许多与网站管理员相关的视频教程。 她是一个可爱的灵魂,她付出了很多努力来制作没有经验的用户能够理解的视频。 这只是她关于 WordPress 和 WordPress 主题的众多视频之一。 特别是,在这一期中,她专注于 WordPress 子主题、如何创建它们以及帮助您了解它们的工作原理。 针对有意识的瑜伽社区,因为并非所有瑜伽士都有资金开始投资他们自己的自定义 WordPress 样式,所以为什么不自己构建一个。
如何创建高级 WordPress 主题

这是 Alessandro Castellani 的另一个教程。 这是有关创建您自己的 WordPress 高级主题的丰富教程的完整播放列表。 您可能会将这些主题出售给某人。 在撰写本文时,播放列表中有 39 个教程。 这将是一个非常专注的项目,您需要耐心和坚定地尊重它。 很少看到有人做如此广泛的教程。 利用这一点,因为它是免费的,因为你可以。
从头开始创建自己的 WordPress 主题
我们希望我们能够全力以赴。 此外,为您提供与创建 WordPress 主题相关的任何内容的一站式资源。 此外,您需要开始使用的那种工具。 从博客教程到样板文件,再到累积内容超过 15 小时的视频教程。 您将不再需要参考其他资源来构建您的第一个 WordPress 主题。 欢迎提出额外内容添加到这篇文章的建议。
