盛夏的果实 发表于 2021-8-1 19:23:21

基于wordpress主题制作的具体实现步骤

复制代码 代码如下:



<?php

/*

在根目录 -> wp-content -> themes 下创建mytheme文件夹用来存放创建新主题模板



在mytheme目录下创建 index.php ,style.css 两个文件,在wp后台 外观->主题 中就可以看到刚创建的主题

打开style.css文件输入

*/

?>

/*

Theme Name: 这里填主题名称

Theme URI: 这里填主题介绍的网址,没有就填你的博客网址吧

Description:这里填主题的简短介绍

Author: 作者名

Author URI: 作者的网址

Version: 版本号

Tags: 标签,多个用半角逗号隔开

*/

<?php

/*

在后台主题管理中即可看到主题相关信息,css中主题信息内容必须用注释符号括起来

找一个300*225的png图片,命名为 screenshot.png 放在主题目录下(mytheme文件夹中),在主题管理页中即可看到新建主题的预览图片

//==================================================header================================================================

可以把网站相同头内容放在一个头文件中,在主题目录下新建 header.php 文件向其中输入输入 统一的头部内容

在 index.php 或想调用该header.php页面的页面中 输入

*/

get_header(); //get_header()就相当于将header.php中的代码拷贝到当前的php文件

/*

在主题管理页面,该主题实时预览中,默认打开的 index.php 页面中即可引入 header.php 页面的内容

header.php 将会被所有的模板页面(主页、分类页、页面、标签页等)所包含,所以 header.php 中代码应该是动态的。

不同页面的title都是不一样,而且title的设置还会直接影响到SEO的效果,所以这里应该谨慎设置。下面提供一种SEO优化的title写法,

在header.php页面添加

*/

?>

<title>

<?php

if (is_home ()) { // is_home() 当前页面为主页时返回true

    bloginfo ( 'name' ); // 返回站点标题

    echo " - ";

    bloginfo ( 'description' ); // 返回站点副标题,站点描述

} elseif (is_category ()) { // is_category() 当前页面为分类页时返回true

    single_cat_title ();

    echo " - ";

    bloginfo ( 'name' );

} elseif (is_single () || is_page ()) { // is_single() 当前页面为单文章页时返回true 。 is_page() 当前页面为单页面时返回true

    single_post_title ();

} elseif (is_search ()) { // is_search() 当前页面为搜索页时返回true

    echo "搜索结果";

    echo " - ";

    bloginfo ( 'name' );

} elseif (is_404 ()) { // is_404() 当前页面为404页时返回true

    echo '页面未找到!';

} else {

    wp_title ( '', true );

}

?>

</title>

<?php

/*

以上添加的php代码运用了条件判断,针对不同的页面采用不同title

在 header.php 页面中添加默认 style.css 文件

*/

?>

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />

<?php

/*

bloginfo('stylesheet_url');返回的是主题默认style.css文件绝对网址路径,如

http://localhost/wordpress/wp-content/themes/myTheme/style.css

bloginfo('template_url');返回的是主题目录的绝对网址路径,可以用来模板中连接样式图片,如

http://localhost/wordpress/wp-content/themes/mytheme

添加 pingback 通告功能,在header.php页面 <head> 标签中里面添加代码:

*/

?>

<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />

<?php

/*

添加订阅feed链接,在header.php页面 <head> 标签中添加:

*/

?>

<link rel="alternate" type="application/rss+xml" title="RSS 2.0 - 所有文章" href="<?php echo get_bloginfo('rss2_url'); ?>" />

<link rel="alternate" type="application/rss+xml" title="RSS 2.0 - 所有评论" href="<?php bloginfo('comments_rss2_url'); ?>" />

<?php

/*

添加wp_head,有些插件需要在网页头部添加一些js或css,要让这些插件能够正常的工作,也让主题有更好的兼容性,应该添加wp_head()函数

header.php 页面 <head> 标签中添加

*/

?>

<?php wp_head(); //用于包含WordPress程序输出头部信息 ?>

<?php

/*

显示菜单栏,这里只在菜单栏中列出分类页和page页面,可以根据喜好来列出想要的。header.php中

*/

?>

<ul id="navigation" class="grid_8">

    <?php wp_list_categories(); //用于列出博客分类页 ?>

    <?php wp_list_pages('depth=1&title_li=0&sort_column=menu_order'); //用于列出博客页面,可不填参数 ?>

</ul>

<?php

//==================================================footer================================================================

/*

footer.php与header.php差不多,写这个文件的目的也是为了精简代码,提高代码的重用性。

在主题目录中创建 footer.php ,在 index.php 或想调用该footer.php页面的页面中使用

*/

get_footer();//功能和get_header()类似

/*

在footer.php页面添加 wp_footer提高兼容性

*/

wp_footer();

/*

wp_footer()和wp_head()差不多,都是用于提高主题兼容性,毕竟有很多插件要在页脚输出一些东西才能正常工作。

*/

//==================================================sidebar================================================================

/*

在主题目录下新建 sidebar.php 页面,在 index.php 或想调用该sidebar.php页面的页面中添加

*/

get_sidebar();

/*

调用 sidebar.php 页面内容

为使WordPress后台 -> 外观 -> 小工具,可以正常地拖动小工具到侧边栏

在 sidebar.php 页面的列表格式应按如下举例格式

*/

?>

<div>

    <?php

    if (! function_exists ( 'dynamic_sidebar' ) || ! dynamic_sidebar ( 'First_sidebar' )) ://First_sidebar为widget名称,要和functions.php中对应的widget name相同

    ?>

    <h4>分类目录</h4>

    <ul>

    <?php wp_list_categories('depth=1&title_li=&orderby=id&show_count=0&hide_empty=1&child_of=0'); ?>

    </ul>

    <?php endif; ?>



    <?php

    if (! function_exists ( 'dynamic_sidebar' ) || ! dynamic_sidebar ( 'Second_sidebar' )) :

    ?>

    <h4>最新文章</h4>

    <ul>

    <?php

    $posts = get_posts ( 'numberposts=6&orderby=post_date' );

    foreach ( $posts as $post ) {

      setup_postdata ( $post );

      echo '<li><a href="' . get_permalink () . '">' . get_the_title () . '</a></li>';

    }

    $post = $posts ;

    ?>

    </ul>

    <?php endif; ?>



    <?php

    if (! function_exists ( 'dynamic_sidebar' ) || ! dynamic_sidebar ( 'Third_sidebar' )) :

    ?>

    <h4>标签云</h4>

    <p><?php wp_tag_cloud('smallest=8&largest=22'); ?></p>

    <?php endif; ?>



    <?php

    if (! function_exists ( 'dynamic_sidebar' ) || ! dynamic_sidebar ( 'Fourth_sidebar' )) :

    ?>

    <h4>文章存档</h4>

    <ul>

    <?php wp_get_archives('limit=10'); ?>

    </ul>

    <?php endif; ?>

</div>

<?php

/*

同时在主题目录下创建 functions.php 文件内容为

*/

/** widgets */

if( function_exists('register_sidebar') ) {

    register_sidebar(array(

      'name' => 'First_sidebar', //name就是给widget指定各自的名称,以便在sidebar.php中分别调用.所以只需要给这两个widget取两个名字就好了。

      'before_widget' => '', //定义Widget内容的前后标识符的语句

      'after_widget' => '',

      'before_title' => '<h4>', //定义Widget标题的前后标识符的语句

      'after_title' => '</h4>'

    ));

    register_sidebar(array(

      'name' => 'Second_sidebar',

      'before_widget' => '',

      'after_widget' => '',

      'before_title' => '<h4>',

      'after_title' => '</h4>'

    ));

    register_sidebar(array(

      'name' => 'Third_sidebar',

      'before_widget' => '',

      'after_widget' => '',

      'before_title' => '<h4>',

      'after_title' => '</h4>'

    ));

    register_sidebar(array(

      'name' => 'Fourth_sidebar',

      'before_widget' => '',

      'after_widget' => '',

      'before_title' => '<h4>',

      'after_title' => '</h4>'

    ));

}

/*

这样WordPress后台 -> 外观 -> 小工具,就可以正常地拖动小工具到侧边栏了

制作index.php 文章列表

例子

*/

?>

<div class="grid_8">

    <!-- Blog Post -->

    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

    <div class="post">

      <!-- Post Title -->

      <h3 class="title"><a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a></h3>

      <!-- Post Data -->

      <p class="sub"><?php the_tags('标签:', ', ', ''); ?> · <?php the_time('Y年n月j日') ?> · <?php comments_popup_link('0 条评论', '1 条评论', '% 条评论', '', '评论已关闭'); ?><?php edit_post_link('编辑', ' · ', ''); ?></p>

      <div class="hr dotted clearfix"> </div>

      <!-- Post Image -->

      <img class="thumb" target='_blank'>头像,尺寸为48 * 48

comment_reply_link()               回复留言的链接

get_comment_time('Y-m-d H:i');       获取评论发布时间

edit_comment_link('修改');         管理员修改评论的链接

comment_text()                     输出评论内容

is_user_logged_in()                  判断用户是否登录

wp_login_url( get_permalink() );   博客登录地址

get_comment_author_link()            用于获取评论者博客地址

$comment_author                      读取cookie,如果该用户之前已经发表过评论则自动帮助用户填写用户名

$comment_author_email                读取cookie,如果该用户之前已经发表过评论则自动帮助用户填写Email

$comment_author_url                  读取cookie,如果该用户之前已经发表过评论则自动帮助用户填写博客地址

do_action(‘comment_form', $post->ID) 该函数为某些插件预留

wp_logout_url(get_permalink())       退出登录的链接

*/

/*

创建模板文件

*/



/*

Template Name: 自建模板

*/

/*

模板文件中添加如上注释代码,模板文件名任意,在新建页面时模板选择即可显示 自建模板 来使用此模板

可添加想要的模板样式及页面内容,新建页面时只填标题不写内容,相当创建一个页面链接地址,新建页面存在 数据前缀_posts 表中

获取到页面地址后,在写地址时可在后添加参数,则转到该页时可通过$_GET,$_POST接收

可以单独建一个表存储地址,及所属页面类型,及各页面子父级关系,在插件中进行控制



wordpress固定链接

如果修改wordpress固定链接不好用,在apache配置文件 httpd.conf 中打开选项

#LoadModule rewrite_module modules/mod_rewrite.so

把前面 # 去掉,并把所有 AllowOverride None 改成 AllowOverride all

如果不是Apache服务器,而是用的IIS调试的话,那就得去安装一个“ISAPI_Rewrite3_0069_Lite.msi”筛选器,然后在站点设置里面将PHP置为优先级。

创建小工具

在主题目录下新建自定义文件 mytool.php 文件名任意,内容任意

然后在 functions.php 中添加如下代码

*/

register_sidebar_widget ( "我的小工具", "mytool_fun" ); // "我的小工具"为后台显示小工具名称,mytool_fun为引入自建小工具页面内容的方法名

function mytool_fun() {

    include (TEMPLATEPATH . "/mytool.php");

}

/*

在后台小工具中即可看到自定义的小工具,添加后,前台页面即可看到自建小工具页面的内容

*/

?>

文档来源:服务器之家http://www.zzvips.com/article/53530.html
页: [1]
查看完整版本: 基于wordpress主题制作的具体实现步骤