wordpress主题制作菜鸟教程之函数篇

五一跑出去疯了三天,现在继续分享这个尚未完成的wordpress主题制作菜鸟教程。今天我们来看一下wordpress主题中的函数文件是如何制作的,函数文件是wordpress一个很特色的功能,我们常常说wordpress功能强大,有一部分原因就是因为函数文件的存在。

不说废话,打开你的starter theme文件夹(如果你是一步步跟着我做的,应该知道我说的是什么),新建一个functions.php文件,编码方式选择不带bom的utf-8,这个在前面咱也说过了。在functions.php文件中先插入一个空白的标准php语句,如果你不知道什么是空白标准php语句,那也没关系,看下面的就是了。

<?php      ?>

算了,我还是简单唠叨几句functions.php文件的功能,一句话,帮助wordpress实现更多的功能,尤其是依靠wordpress源程序本身实现不了的功能;如果你常常玩游戏,那么外挂的概念应该比较好理解,对了,functions.php就好像是wordpress的外挂一样,可以实现各种你想要的功能,只要你把相应的代码扔到上面那个空白的标准语句里面就ok了。

因为咱们在这里要做的是一个最最基本的主题,所以我不打算添加太多的代码到funtions.php里面,就放两段代码吧,一段实现主题菜单功能,就是可以让你灵活的在wordpress后台通过拖拽的方式设置自己喜欢的导航菜单;另一端代码实现侧边栏小工具功能,我计划添加三个侧边栏小工具区域,当然你可以根据需要添加更多。

铛,铛,铛,代码来了,列位看官瞧仔细了。首先实现菜单功能,代码如下

<?php
/* 使主题支持菜单功能 */
register_nav_menu( 'nav-menu', 'Menu');
?>

很简单是不是?还没反应过来是不是?没办法,就是如此简单,现在我们的主题真正已经具备了菜单功能,你可以直接在后台设置希望显示的选项啦,尽情享受这种快乐吧。有一点要注意哈,就是代码必须放在空白的标准php语句中间!

接着看实现侧边栏小工具区域的代码吧,稍微有一点点复杂,但是没关系,我会详细解释的。

<?php
/* 使主题支持菜单功能 */
register_nav_menu( 'nav-menu', 'Menu');

function new_widgets_init() {

// 第一个侧边栏
register_sidebar( array(
'name' => '第一侧边栏',
'id' => 'widget-area-one',
'before_widget' => '<li id="%1$s" class="widget-container %2$s">',
'after_widget' => "</li>",
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );

// 第二个侧边栏
register_sidebar( array(
'name' => '第二侧边栏',
'id' => 'widget-area-two',
'before_widget' => '<li id="%1$s" class="widget-container %2$s">',
'after_widget' => "</li>",
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );

// 第三个侧边栏
register_sidebar( array(
'name' => '底部工具栏',
'id' => 'widget-area-three',
'before_widget' => '<li id="%1$s" class="widget-container %2$s">',
'after_widget' => "</li>",
'before_title' => '<h3 class="widget-title">',
'after_title' => '</h3>',
) );
}
// 激活侧边栏的一句函数
add_action( 'init', 'new_widgets_init' );
?>

代码稍微复杂了一点点,通过代码可以很清晰的看到,我们为主题添加了三个工具栏区域,我打算把第一个和第二个放在网页的右侧,第三个放在网页的底部。你可能要问了,它怎么会那么听话,让在右侧就在右侧,让在底部就在底部,很简单,css会让它乖乖的去该去的地方的。

添加侧边栏的代码虽然复杂,但说实话,你完全没必要看懂它,当然如果能看懂也很赞。看不懂并不代表不能使用,请牢记这一点;如我所说,上面添加了三个侧边栏,如果你想要添加更多,直接对应的进行复制,然后顺次进行粘贴就ok,当然请修改一下你新添加的侧边栏的name和id,命名规则请随意,只要不和上面的重复就行;如果你只想要一个侧边栏,那么尽可删除掉后面俩,都没有任何问题。

发现我真的是很难能唠叨,还得说一遍,functions.php中添加的功能代码必须放在空白的标准php语句里面。

ok,如果你是从我这个教程的第一篇开始看的,那么恭喜你,截至这篇文章,我们已经完成了一个最最基本的wordpress主题。如果没有任何操作上的失误,现在这个主题已经可以使用了。你可以把starter theme这个文件夹复制到你的wp-content中的themes文件夹里面,然后去wordpress后台启用它了。当然,在这之前,你至少得在数据库中有那么七八篇文章,才能看到主题显示的效果。

去试试吧,然后可以给我留言,告诉我你碰到了什么问题,我们一起来解决。当然,有一点你不说我也知道,你可能在浏览器中看到的是密密麻麻的文字,排版混乱,就是一行一行的文字摞起来的,没有任何逻辑与美感。原因很简单,因为我们没有进行任何css设置,所以你看到的只是最最原生态的文字。关于css布局设置,是一个众口难调的玩意儿,不同的人喜欢不同的风格,我就不再统一讲了,当然,如果你喜欢我的唠叨风格,后续我会分享一点点简单的css心得和你探讨。

over。

回复

  1. suN 的头像

    围观围观围观!!!

    1. 啄木游弋 的头像
      啄木游弋

      欢迎强势围观,哈哈

  2. 凤翼天堂 的头像

    我都是直接折腾的- -对教程这种东西有些感冒

    1. 啄木游弋 的头像
      啄木游弋

      我觉得,你是想表达对教程这玩意儿不感兴趣对不?嘿嘿,那应该叫不感冒吧。对了,你这个小头像很可爱,哈哈。

  3. 饭团同学x 的头像

    我对css完全不会= =
    所以在我按照我爱水煮鱼(是这位来着?)的教程做了一遍之后,发现……这他喵的是啥啊

    1. 啄木游弋 的头像
      啄木游弋

      对的,水煮鱼。css很有趣的,不过,饭团你能不能不要这么口耐?笑shi我了

      1. 饭团同学x 的头像

        因为我觉得不换成“喵”字的话有些失礼w

        1. 啄木游弋 的头像
          啄木游弋

          恩,知书达理的好孩纸。北京好热了,该开空调啦。

  4. 等待思索 的头像

    先学会修改别人的模版,然后慢慢的就会做了!

    1. 啄木游弋 的头像
      啄木游弋

      恩恩,其实差不多,我是先学会自己做简单的,然后学会修改别人模版的。

  5. 外汇交易 的头像

    通过卢松松博客过来看看

    1. 啄木游弋 的头像
      啄木游弋

      哦,欢迎欢迎哈,小站简陋,希望你能喜欢。

  6. 刘印博客 的头像

    传说中的沙发?
    多发点菜鸟教程帮助新人很不错~

    1. 啄木游弋 的头像
      啄木游弋

      杠杠的,沙发就是您的啦。嗯,一个菜鸟写出来的菜鸟教程,可以想象有多么基础了,我估计真正的高手看到了是会笑掉大牙的。

      1. 刘印博客 的头像

        不会的,笑的都是半懂不懂的人,你写的这些东西不懂的人才能看懂,加油吧~

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

You may also enjoy…