专栏首页一丘一壑Genesis框架从入门到精通(14): 布局函数

Genesis框架从入门到精通(14): 布局函数

正如我之前在Genesis Explained系列文章中所承诺的那样,今天将要填 genesis/lib/functions/layout.php 这个文件的坑。这种顺序是我特意安排的,因为提前熟悉侧边栏的概念和Genesis所使用的函数对理解布局是有帮助的。该文件中的函数涉及布局选项的创建,删除和检查,其中一个是钩子函数。在使用Genesis时这是非常有帮助的,因为你可以为每个各个单独的文章、页面和其他分类选择不同的布局。这意味着你独立于模板创建全新的布局。

首先,我们来看看布局函数(注:对原文内容有增加)

其中许多函数都是后端操作,但也有一些非常酷的前端功能。在开始之前,我想快速介绍一下默认布局。

function genesis_create_initial_layouts()

这里会调用一系列genesis_register_layout函数用于创建初始布局 。阅读这部份的代码有助于弄明白genesis_register_layout函数,我们将在稍后介绍。同时,在取消注册布局或者要基于当前布局设置一些按条件触发的动作时需要用到的ID,也可以知道要用到哪些ID。列表如下(前面是名称,后面是ID,不一一翻了,content就是内容区,sidebar就是侧边栏)。

  • Content/Sidebar: content-sidebar
  • Sidebar/Content: sidebar-content
  • Content/Sidebar/Sidebar: content-sidebar-sidebar
  • Sidebar/Sidebar/Content: sidebar-sidebar-content
  • Sidebar/Content/Sidebar: sidebar-content-sidebar
  • Full Width Content: full-width-content

有几点关于命名方式的约定。描述标签可以是任何东西,不必准确描述布局。只要你能在两头都获得正确的信息,在PHP中怎么写都无所谓。但是对于开发人员和用户体验来说是重要的。标签需要简洁并具有描述性,以便用户可以更直观地了解每个选项的作用。应使用符合Web标准的ID来指明对应的标签(小写,没有空格,不以数字开头)。你当然使用是“one,two,three……”,但这是自找麻烦。遵循 “Sidebar/Content” 和 “sidebar-content” 这种类似的命名约定,会更加直观,从而使代码更清晰,减少调试的成本。

function genesis_register_layout( $id = ”, $args = array() )

这是一个看似简单的函数。第一个参数是设置ID。请记住,要遵循Web标准并能描述你的布局。第二个是可选的,但你应该使用它。 $args会传入一个数组,理想情况下应填入’label’和’img’的值。如果没有提供这两个值,你的布局将使用“No Label Selected”标签和空白图像。img可以是任何图片,但我喜欢使用混合选项的概念以获得更好的用户体验,因此我建议像其他布局那样,利用现有的全宽度内容并将它分解为几个部分,以便准确反映该布局。下面是一个示例代码:

genesis_register_layout

如果你想,你还可以在数组中添加其他字符串。这些字符串将被回已被不时之需。理论上可以做到这一点,但一般我不这样做。

function genesis_set_default_layout( $id = ” )

这个函数会做两件很重要的事情。设置默认布局,取消设置现有默认布局。默认布局只会在首次激活主题或在设置中按下“重置”按钮时被应用。

那么我们如何使用它呢?很简单

genesis_set_default_layout( 'top-sidebar-content-sidebar' );

这会将我们之前创建的布局设置为默认布局。就这样。现在,除非点击了重置按钮,此设置会一直有效。

function genesis_unregister_layout( $id = ” )

记得上一篇文章里讲的关于删除侧边栏的操作吗?如果侧边栏已经删除了但是关于这个侧边栏的选项没有删除掉,那会有多么令人困惑?这个函数的存在就是为了删除不需要的布局。

genesis_unregister_layout( 'sidebar-sidebar-content' );

这样就会删除 Sidebar/Sidebar/Content这个布局,主题中不需要不想要的的其他布局都可以删除。

function genesis_get_layouts( $type = ‘site’ )

这个函数可以给你返回一个包含所有布局和相关信息的对象(数组),比如ID,标签和图像。大多数情况下,这是一个辅助函数,用于在wp-admin的后台中让用户选择布局。

function genesis_get_layout( $id, $type = ‘site’ )

这将返回特定的布局。你也可以使用genesis_get_layouts()然后从返回结果中获得你需要的特定布局,但用这个函数可以不需要额外的步骤。返回的信息也是一个对象(数组)。

function genesis_get_default_layout( $type = ‘site’ )

返回默认布局。同样,这主要是Genesis 管理后台中使用的辅助函数。理论上,你可以使用它来创建许多其他函数,包括检查当前布局是否已更改。

function genesis_site_layout( $use_cache = true )

这是一个非常有用的函数,它返回当前选定的布局。如果存档页面或文章页面的布局没有自定义设定,这将返回Genesis Theme Settings中的设定值。如果要添加新布局,则需要将其与钩子一起使用。例如:

function genesis_structural_wrap( $context = ”, $output = ‘open’, $deprecated = null )

它有助于在元素中或元素周围创建一个外层嵌套(wrap)。比如在顶部的侧边栏可以这样用。第一步是在主题中开启这个支持项。

add_theme_support( 'genesis-structural-wraps', array( 'top-sidebar' ) );

上面的代码可以修改为

genesis-structural-wrap

这将使用.wrap将其嵌套在一个简单的div中。你可以更改“open”和“close”之间的内容,用以创建唯一的 div,ID,css样式等

Genesis Explained系列中的函数子系列到此结束。接下来,我们将深入到admin文件夹,并学习如何在主题设置meta信息以及文章,页面和分类项。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Genesis框架从入门到精通(12): 配置项函数

    Genesis Explained Option Functions

    丘壑
  • Genesis框架从入门到精通(1):什么是框架?

    WordPress主题框架Genesis的工作原理可能会让很多人感到困惑不解,这导致开发者在开始用Genesis框架时可能会一脸蒙逼,无所适从。

    丘壑
  • Genesis框架从入门到精通(7): 框架的过滤器

    Genesis Explained Framework Filters

    丘壑
  • 第84天:jQuery动态创建表格

    半指温柔乐
  • 前端新人在开发的时候,怎么做需求分析?

    昨天的文章《【逻辑】什么是前端开发中的业务逻辑?》,简单的聊了一下什么是业务逻辑,并且说明了业务逻辑是来自于客户的需求。那么今天就再说一下,怎么做需求分析?

    web前端教室
  • vue中组件的data为什么是一个函数

    组件是可复用的vue实例,一个组件被创建好之后,就可能被用在各个地方,而组件不管被复用了多少次,组件中的data数据都应该是相互隔离,互不影响的,基于这一理念,...

    小蔚
  • ZLT-MP v3.1.0 发布

    https://gitee.com/zlt2000/microservices-platform

    陶陶技术笔记
  • 千万级规模高性能、高并发的网络架构经验分享

    主 题 :INTO100沙龙 时间 :2015年11月21日下午 地点 :梦想加联合办公空间 分享人:卫向军(毕业于北京邮电大学,现任微博平台架构师,先后在微软...

    张善友
  • 千万级规模高性能、高并发的网络架构经验分享

    在开始谈我对架构本质的理解之前,先谈谈对今天技术沙龙主题的个人见解,千万级规模的网站感觉数量级是非常大的,对这个数量级我们战略上 要重 视 它 , 战术上又 要...

    Java知音
  • 【PAT乙级】朋友数

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。 ...

    喜欢ctrl的cxk

扫码关注云+社区

领取腾讯云代金券