建站教程

建站教程

Products

当前位置:首页 > 建站教程 >

WP主题开发05:编写wordpress主题的静态模板的(WordPress主题开发时需要基本模板及常用函数知识)

GG网络技术分享 2025-03-18 16:13 0


WP主题开发05:编写wordpress主题的静态模板的

想让我们的客户在千里之外初步看到wordpress主题的大致效果,效果图虽然比较漂亮,但是,更加直观而灵动的,是让客户在浏览器中看到wordpress主题的大致效果,毕竟,客户最终的需求是在网站上展示wordpress主题模板的效果的。而开发一个wordpress主题模板,并不是一个可以快速完成的工作,尤其是那些功能强大的wordpress主题模板,它会涉及到很多方面的东西,所以,在开发初期,我们不可能做到,让客户看到动态网页的效果。

所以,在初期,我们只能叫前端工程师把切图通过HTML和CSS代码来组合,编写成一个wordpress的静态代码模板,这样的好处有2点:

1、可以让客户更加直观地看到wordpress主题放到网站上的效果;

2、可以减去wordpress主题的后端工程师编写HTML静态代码的工作,可以全身心地放在PHP动态代码的编写上。

那么,前端工程师应该怎样编写wordpress主题的静态代码模板呢?

一:按照wordpress主题的一些常规规范来编写。

我就曾经碰到这样的一个情况,前端工程师把wordpress静态代码模板给我后,我就碰到几处地方,用wordpress的函数不太好弄出相同的效果。比如:顶部导航菜单。wordpress提供的wp_nav_menu()这个创建菜单的函数,它创建出来的菜单列表代码如下:

<li id="menu-item-7164" class="menu-item "><a target="_blank" href="/">首页</a></li>

<li id="menu-item-7152" class="menu-item "><a target="_blank" href="/">wordpress企业模板</a></li>

<li id="menu-item-7153" class="menu-item "><a target="_blank" href="/">wordpress CMS主题</a></li>

或者是直接用a 标签:

<a target="_blank" href="/">首页</a>

<a target="_blank" href="/">wordpress企业模板</a>

<a target="_blank" href="/">wordpress CMS主题</a>

可是,前端工程师给我的静态模板的代码却是用div来做菜单列表的标签,如下:

<div class="menu-item "><a target="_blank" href="/">首页</a></div>

<div class="menu-item "><a target="_blank" href="/">wordpress主题模板</a></div>

<div class="menu-item "><a target="_blank" href="/">wordpress门户主题</a></div>

虽然,我们通过一些相关的代码处理,也能用上,但是,这要花费我们的开发时间。我们用wordpress程序做网站的目的不就是冲着它开发方便而且快速吗?如果每一次后端工程师都要处理这此事情,就会影响整个开发进度。所以, 前端工程师在开发wordpress静态模板时,一定要按wordpress的相关规范来开发。

二:根据效果图有针对性地开发几个前端静态模板。

前端开发人员,一般情况下只需要根据美工提供的效果图来进行开发静态模板。而美工设计效果图时,也是根据网站的一般需求而来。一个网站,正常情况下,主要包括:网站首页、网站分类目录页面、网站文章详情页面、一些独立页面(如:关于我们)、网站的搜索页面。当然,有些网站还有其它的一些页面。但,主要的页面就这几种吧。所以,前端工程师要编写如下几个静态模板:

1、网站首页的静态代码模板;

2、文章列表页的静态模板;

3、文章详情页的静态模板;

4、单页面的静态模板;

5、搜索页面的静态模板;

6、tag标签页的静态模板;

​当然,以上是常规的页面静态模板。不同的客户有不同的需求。比如:企业网站,他们的网站可能需要产品展示列表页、产品销售页面、公司的促销活动单页面等等,这些页面,可能又是另外的一种页面布局。所以,也要为它们编写好相应的静态模板。

总之,wordpress主题的静态代码模板编写,只需要注意以上2大点就可以。毕竟,wordpress主题开发的重点是在动态代码的编写上,客户的需求,大多都会在wordpress主题的动态代码模板中体现出来。所以,我们会花更多的时间在wordpress主题动态模板上。

WordPress主题开发时需要基本模板及常用函数知识

WordPress主题开发时需要基本模板及常用函数知识 (https://www.wpmee.com/) WordPress开发教程 第1张

WordPress有很多自带的函数和标签,在WordPress建站的过程中,经常会忘记,抽空整理了一些常用的模板和函数汇总,简单,快速,复制/粘贴,这个页面列出用于创建,更新和维护。接下来小编为大家总结一下WordPress主题开发时需要基本模板及常用函数知识。

基本模板文件

文件名描述

style.css主题样式文件

index.php首页模板文件

header.php头部模板文件

single.php单篇文章模板文件

archive.php存档/分类模板文件

searchform.php搜索表单模板文件

search.php搜索模板文件

404.php404模板文件

comments.php留言模板文件

footer.php底部模板文件

sidebar.php侧边栏模板文件

page.php静态页面模板文件

front-page.php静态首页模板文件

tag.php标签存档模板文件

category.php分类存档模板文件

头部函数

函数名描述

<?phpsite_url();?>站点根链接

<?phpwp_title();?>文章或者静态页面标题

<?phpbloginfo(‘name’);?>站点名称

<?phpbloginfo(‘description’);?>站点描述

<?phpget_stylesheet_directory();?>样式文件所在目录

<?phpbloginfo(‘stylesheet_url’);?>样式文件链接

<?phpbloginfo(‘pingback_url’);?>pingback链接

<?phpbloginfo(‘template_url’);?>模板文件所在目录链接

<?phpbloginfo(‘version’);?>WordPress版本

<?phpbloginfo(‘atom_url’);?>atom链接

<?phpbloginfo(‘rss2_url’);?>rss2链接

<?phpbloginfo(‘url’);?>网站根链接

<?phpbloginfo(‘html_type’);?>html版本

<?phpbloginfo(‘charset’);?>字符集

导航菜单

默认导航菜单

<?phpwp_nav_menu();?>

指定的导航菜单

<?phpwp_nav_menu(array(‘menu’=>‘ProjectNav’));?>

基于分类的导航

<ulid=”menu”>

<li<?phpif(is_home()){?>class=”current-cat”<?php}?>>

<ahref=”<?phpbloginfo(‘home’);?>”>Home</a></li>

<?phpwp_list_categories(‘title_li=&orderby=id’);?>

</ul>

基于页面的导航

<ulid=”menu”>

<li<?phpif(is_home()){?>class=”current-page-item”<?php}?>>

<ahref=”<?phpbloginfo(‘home’);?>”>Home</a></li>

<?phpwp_list_pages(‘sort_column=menu_order&depth=1&title_li=’);?>

</ul>

模板函数

函数名描述

<?phpthe_content();?>文章内容

<?phpif(have_posts()):?>检查是否有文章

<?phpwhile(have_posts()):the_post();?>显示文章

<?phpendwhile;?>结束循环

<?phpendif;?>结束判断

<?phpget_header();?>头部模板内容

<?phpget_sidebar();?>侧边栏模板内容

<?phpget_footer();?>底部模板内容

<?phpthe_time(‘m-d-y’);?>显示时间,格式为:’08-18-07′

<?phpcomments_popup_link();?>显示到文章留言的链接

<?phpthe_title();?>文章标题

<?phpthe_permalink();?>文章链接

<?phpthe_category();?>文章分类

<?phpthe_author();?>文章作者

<?phpthe_ID();?>文章ID

<?phpedit_post_link();?>文章编辑链接

<?phpwp_list_bookmarks();?>友情链接列表

<?phpcomments_template();?>留言模板内容

<?phpwp_list_pages();?>所有页面列表

<?phpwp_list_categories();?>所有分类列表

<?phpnext_post_link(‘%link’);?>下一篇文章链接

<?phpprevious_post_list(‘%link’);?>上一篇文章链接

<?phpget_calendar();?>显示文章日历

<?phpwp_get_archives();?>存档链接列表

<?phpposts_nav_link();?>上一篇和下一篇文章链接

<?phprewind_posts();?>重回开头开始第二个循环

主循环

基本循环

<?phpif(have_posts()){?>

<?phpwhile(have_posts()){?>

<?phpthe_post();?>

<?php//custompostcontentcodefortitle,excerptandfeaturedimage?>

<?php}//endwhile?>

<?php}//endif?>

其他函数

函数名描述

/%postname%/自定义固定链接

<?phpinclude(TEMPLATEPATH.‘/x’);?>从模板文件夹加载文件

<?phpthe_search_query();?>搜索表单返回的值

<?php_e(‘Message’);?>返回翻译之后的文本

<?phpwp_register();?>注册链接

<?phpwp_loginout();?>登录/登出链接

<!–nextpage–>将文章那个内容分页

<!–more–>截断文章内容,并创建到全文的链接

<?phpwp_meta();?>管理元链接

<?phptimer_start();?>开始计时(header.php)

<?phptimer_stop(1);?>停止计时(footer.php)

<?phpechoget_num_queries();?>显示生成当前页面所需的查询数

页面判断函数

函数名称用法说明

is_home()<?phpif(is_home())?>true为首页,false为第二页判断是否为第一页

is_paged()<?phpif(is_paged())?>当页面为第二页时,?paged=2

is_single()<?phpif(is_single())?><?phpif(is_single(2))?>文章id<?phpif(is_single(‘标题’))?>文章标题是否为文章单一页面,如要针对特定文章时,可在()中加入文章的ID参数,或标题文字

is_page()<?phpif(is_page())?><?phpif(is_page(2))?>分页id<?phpif(is_page(‘标题’))?>分页标题是否为分页,与单一页面用法相同,在()中可再针对个別的分页ID与标题作判断

is_category()<?phpif(is_category())?><?phpif(is_category(2))?>分类id<?phpif(is_category(‘标题’))?>分类标题<?phpif(is_category(array(6,7)))?>分类id为6、7<?phpif(is_category(array(6,7,’minwt’)))?>分类id为6、7或minwt是否为分类,()中可输入分类ID与名称,再个別作判断

is_archive()<?phpif(is_archive())?>是否为存档页面

is_search()<?phpif(is_search())?>是否为搜索面

is_404<?phpif(is_404())?>是否为找不到画面404

is_tag()<?phpif(is_tag())?>是否为标签页面

is_date()<?phpif(is_date())?>是否为日期存档页面

is_year()<?phpif(is_year())?>是否为年份存档页面

is_month()<?phpif(is_month())?>是否为月份存档页面

is_day()<?phpif(is_day())?>是否为天存档页面

标签:

提交需求或反馈

Demand feedback