#121 通用页面模板
我们看一下联系页面,并认为它是 CSS-Tricks 上一种非常通用的页面,根本不需要任何特殊的样式。实际上,通用页面和博客页面之间唯一的区别在于……
一个非常详细的旅程,带您了解整个网站的重新设计过程。事实上,这个网站本身。
我们看一下联系页面,并认为它是 CSS-Tricks 上一种非常通用的页面,根本不需要任何特殊的样式。实际上,通用页面和博客页面之间唯一的区别在于……
我们刚刚完成了这个重新设计的激动人心的部分,我们得以丢弃视频存档页面上的一堆乱七八糟的标记,并将其替换为新的、智能的、干净的、自动生成的标记。但是我们还有更多工作……
在这个屏幕截图中,我们将处理 CSS-Tricks 的“演示”区域。它是网站上一个相当受欢迎的区域,尽管我并没有像我应该那样花很多时间在这个区域。它的目的是……
在这个屏幕截图中,我们深入研究了另一个非常重要的页面的设计。这是我从一开始就一直很兴奋要设计的页面之一,因为它是一个在上次设计中服务不足的页面。在这个新的……
在这个屏幕截图中,我们深入研究了构成单个视频页面的 HTML、CSS 和 WordPress 模板。我们已经设计好了我们希望它在 Photoshop 文档中的样子,因此我们只需要将其带到……
在这个屏幕截图中,我们将完成对单个视频模板的代码整理。
我们首先对 CSS 进行一些整理。videos.scss 文件的一部分适用于与视频相关的页面。有些部分专门用于存档页面,以及……
在这个屏幕截图中,我们将深入研究向网站主页添加更多模块。相当重要的内容!目前,我们在那里只有一些模块。我们有一些热门链接,几个……
CSS-Tricks 上的文章存档页面相当重要。与大多数博客一样,它没有分页的博文,而是直接链接到存档。我认为这可以为用户节省点击-滚动浏览、点击-滚动浏览、点击-滚动浏览的麻烦……相反,他们直接去……
在这个屏幕截图中,我们开始构建我们计划在主页上使用的其他几个模块。
只需稍微调整一下,我们就可以显示三个热门链接,而不是两个。复制粘贴一些……
在这个屏幕截图中,我们将深入研究论坛区域的代码。
论坛的“主”文件(如果存在这样的文件)是 default.master.php。它有点像 WordPress 主题中的 index.php,只是每个视图……
在这个屏幕截图中,我们将继续深入研究 Vanilla Forums 的代码,并让我们的主题运行起来。我们立即决定采取疯狂的举动,删除 Vanilla 附带的整个 CSS 集……
我们继续深入研究网站论坛区域的主题设计。到目前为止我们做得不错,但我们越深入,事情就越困难。部分原因仅仅是因为我没有太多关于……的经验。
我们停止了尝试决定是否可以赢得静态登录表单的战斗。我们可能可以,但通过更多地玩弄论坛,我们发现默认情况下不仅仅是登录……
我们直接跳入论坛主页主要内容区域的样式设计。可以说,它是论坛最重要的部分,因为它是人们到达论坛时看到的第一件事。这给了我们一个机会……
我们经过了一段漫长的旅程,才获得了对所有需要控制的部分的控制权,在此过程中经历了一些挣扎和意外。我们终于可以根据……开始设计主页上的那些模块了。
你可能会争论说论坛主页是最重要的页面,但同样有力的论据是个人主题视图是最重要的。数据显示,与……相比,人们会访问这些“深层链接”的次数更多。
我们仍然深入研究论坛区域。在这个屏幕截图中,我们将查看注册页面。另一个相当重要的页面,因为我们希望加入论坛的体验尽可能轻松和令人愉快。
我们是一个……
在这个屏幕截图中,我们将短暂休息一下,从与 Vanilla Forums 样式的斗争中抽离出来,开始设置 Restrict Content Pro (RCP),我们的 WordPress 插件,用于管理“小屋”的订阅者,这是一个私人访问区域(你实际上就在……里面)。
在论坛的右侧,有一系列模块。“视觉上”的模块,“代码上”的模块,以及“内容上”的模块,因为它们包含的内容是相关的组,与其他模块中的内容分开/不同。
第一个……
不要生气,但我不得不稍微向前跳跃一下,因为有一些令人疲惫的、漫长的、枯燥的、覆盖不同视图的工作,方法是在 Vanilla 论坛主题中的正确位置放置正确的文件。我们已经……
我们已经为 CSS-Tricks 上的这个新的“私人访问区域”做了一些准备工作。我们已经查看了 WordPress 插件来帮助我们,我们甚至选择了一个插件并进行了设置。但现在我们需要开始实际构建……
在最后一个屏幕截图中,我们从 iStockPhoto 获取了雪山小屋和森林的照片。我们将其放置在背景中,位于 Photoshop 文档的主要内容区域和侧边栏的后面,它很好地适应了那里,在……
在上一段视频中,我们弄清楚了如何在模板中根据用户的登录和订阅状态提供不同的内容。我们在这个屏幕截图中使用这种能力来处理“销售页面”——也就是说,……
WordPress 很棒的原因之一是它带有自己的功能齐全的用户身份验证系统。如果你不打算带来大量的创新……,从头开始编写这些系统现在相当愚蠢。
在这个屏幕截图中,我们将研究如何在Amazon S3(简单存储服务)上托管文件,以便我们可以链接并使用这些资产,但不能将其完全公开。只能让它们可供访问……
我们为网站的通用侧边栏创建了一个专门用于“小屋”的模块。如果你已登录,它将欢迎你并提供有关访问内容和你的订阅的相关链接。如果……
我们在网站侧边栏中的“小屋”小部件(在大多数页面上显示,包括主页)有两种状态。一种是用户注销的状态,另一种是用户已登录的状态。注销状态……
“小屋”的注册页面非常重要,原因显而易见:这是收集资金并授予会员区域访问权限的页面。它需要看起来不错,并且运行得更好。
文本是……的一部分
当你登录时,“小屋”的主页(即 /lodge/)将类似于“门户”页面。这个系列将被称为“大型 v10 重构项目”,最终将成为此……上显示的众多项目中的一个。