php发展

首页 » 常识 » 问答 » header模板
TUhjnbcbe - 2022/12/9 21:35:00
福建白癜风医院 http://baidianfeng.39.net/a_yqyy/160109/4756241.html

简介

本篇文章介绍如何制作header模板,一个网站的开头部分。下图红色部分就是头部部分。难点是搜索框和菜单栏。

图1

header制作

一个网页最常见的结构是:

html

head/head

body/body

/html

我们从head部分开始制作起。

1搜索框

我们用下述代码就可以展现搜索框。get_search_form()函数wordpress做了什么动作呢。

divclass=top

?PHPget_search_form();?

/div

首先,wordpress搜索框会去找searchform.php脚本内容。下图是我的searchform.php脚本内容,大家可以自己手敲,这样印象比较深刻。

图2

上述内容页面上就展现出了搜索框,用于填写关键词。还有搜索按钮。点击搜索后,会展现搜索内容,搜索内容是如何展现的,wordpress调用的是search.php模板,这个search.php模板后续再介绍。

菜单栏

菜单栏在wordpress后台可以先制作好。我从最简单的说起,只制作一个菜单栏,比较复杂的可用制作多个菜单栏,各个页面调用的菜单栏可能不一样,就如同菜鸟教程,我们之前的截图里就可用看到,首页的菜单栏和具体页面的菜单栏是不一样的。

我们点击后台外观页签下的菜单按钮,制作菜单。我是将3个大类别作为菜单选项,你们可用根据自己的需求制作,比如再加上菜单项(关于我们)。

图3

后台菜单栏制作好了,主题如何调用呢。

首先,在functions.php模板文件里增加菜单注册功能。代码如下;

/**

*建立菜单*/

functionBing_register_nav_menus(){

register_nav_menus(array(

header_menu=__(顶部菜单,Bing),

footer_menu=__(页脚菜单,Bing)

));

}

这样我们就注册好了菜单功能,也就是我们可以在模板文件里调用菜单栏了。wordpress调用菜单栏最简单的函数是wp_nav_menu();我们没有加任何参数,则它都有自己默认的参数,大家可用自行网上查看,如果有特殊需求,你们可用加上对应的参数。

nav

?phpwp_nav_menu();?

/nav

加上上述代码后,页面就会展示出我们刚才后台制作的菜单栏了。

3其他头部信息

head里通常还会有其他信息,比如网站title,其他link信息等。大家将下述代码复制到自己的header.php即可。

图4

代码里主要有两个wordpress专有的函数。

bloginfo(‘name’):调用网站标题,如果将name替换成url,则调用网站地址url

wp_title():能在不同的页面自动生成不同的标题(比如首页就是网站标题、文章页就是文章标题)

四总结

本篇我们完成了header.php的编写,包括常规的header信息,还有菜单栏,搜索栏的制作等,我们下节课再见

1
查看完整版本: header模板