WordPress开发手册 – 小凡部落

Evernote Export

移动.css样式文件到主题文件夹内，并重命名为style.css

/*
Theme Name: 橡胶定制主题  
Theme URI: http://www.yanxisheji.com
Description:艳夕设计定制主题
Author: 艳夕设计
Author URI: http://www.yanxisheji.com
Version: 1.0
Tags: 艳夕设计,企业,工业,蓝色
*/

将首页静态页面重命名为index.php

2.1 style.css引入路径直接为

<?php bloginfo( 'stylesheet_url' ); ?>

2.2 主题路径是

<?php bloginfo('template_directory'); ?>

制作主题缩略图命名 screenshot.jpg 或者screenshot.png等，尺寸347*260

4.修改所有相对路径为WP绝对路径

<?php bloginfo('template_directory'); ?>    //主题绝对路径
<?php bloginfo('name'); ?>    //获取博客名字
<?php echo get_option('home'); ?>    //获取主页路径
<?php single_cat_title(); ?>    //获取当前分类名称
<?php the_category(); ?>    //获取当前分类名称和链接

制作头部模板 header.php

调用头部模板标签

<?php get_header();?>

<head>标签信息

//编码格式
<meta http-equiv="Content-Type" content="text/html; charset=<?php bloginfo( 'charset' ); ?>" />
//SEO标签
<?php include( TEMPLATEPATH . '/seo.php' ); ?>    //同时将组件中的seo.php文件拷贝到主题目录
<?php wp_head(); ?>    //Hook标签

去除顶部空白问题：

新建functions.php函数文件并添加下面代码。

<?php add_filter( 'show_admin_bar', '__return_false' );?>

制作导航

3-1、新建 functions.php 函数文件并添加以下代码：

<?php
//自定义菜单
   register_nav_menus(
      array(
         'header-menu' => __( '导航自定义菜单' ),
      )
   );?>

3-2、导航位置添加菜单调用代码：

//菜单调用
<?php wp_nav_menu( array( 'container' => '','menu_class' => 'navigation','menu_id' => 'nav_sgBhgn') ); ?>
//bootstrap框架的菜单，同时需要修改css里面的显示当前菜单的样式
<?php wp_nav_menu( array( 'container' => '','menu_class' => 'nav navbar-nav') ) ?>
'theme_location' => 'footer-menu'    //这个参数可以用来设置自定义某个菜单

3-3、设置菜单。

扩展知识菜单的参数：http://codex.wordpress.org/Function_Reference/wp_nav_menu

//最外层容器的标签名，默认div  
'container' => 'div',  
//最外层容器的class名  
'container_class' => 'mainNavBlock',  
//最外层容器的id名  
'container_id' => 'menu',  
//导航菜单ul标签的class名  
'menu_class' => 'mainNav',  
//导航菜单ul标签的id名  
'menu_id' => "nav",  
//是否打印，默认是true，如果想将导航的代码作为赋值使用，可设置为false  
'echo' => true,  
//备用的导航菜单函数，用于没有在后台设置导航时调用  
'fallback_cb' => 'the_main_nav',  
//显示在导航a标签之前  
'before' => '<p>',  
//显示在导航a标签之后  
'after' => '</p>',  
//显示在导航链接名之前  
'link_before' => '<em>',  
//显示在导航链接名之后  
'link_after' => '</em>',  
//显示的菜单层数，默认0，0是显示所有层  
'depth' => 0,  
//调用一个对象定义显示导航菜单  
'walker' => new Walker_Nav_Menu(),  
//指定显示的导航名，如果没有设置，则显示第一个  
'theme_location' => 'primary',

制作首页模板index.php

幻灯片，这里使用flexslider幻灯片插件

//引入资源
<link rel="stylesheet" type="text/css" href="flexslider.css" />
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.flexslider-min.js"></script>
//body标签插入html
<div class="flexslider">
      <ul class="slides">
        <li><img src="images/s1.jpg" /></li>
        <li><img src="images/s2.jpg" /></li>
        <li><img src="images/s3.jpg" /></li>
        <li><img src="images/s4.jpg" /></li>
      </ul>
</div>
//js调用
<script type=”text/javascript”>
$(function() {
    $(".flexslider").flexslider();
});
</script>

还有一些属性，可以参考教程https://www.helloweba.com/view-blog-265.html

循环标签

循环某个分类的文章，以下实现分类id是3的6篇最新文章

<?php if (have_posts()) : ?>
<?php query_posts('cat=3' . $mcatID. '&caller_get_posts=1&showposts=6'); ?>
<?php while (have_posts()) : the_post(); ?>
<!--需要循环的模块-->
<?php endwhile; ?>
<?php endif; wp_reset_query(); ?>

备注：如果想去除某个分类的首篇文章或者前几篇文章设置方法offset

//如果想调用全站最新文章，可以循环中的query_posts函数语句
<?php query_posts('cat=3' . $mcatID. '&caller_get_posts=1&showposts=6&offset=1'); ?>

循环中调用文章标题

<a href="<?php the_permalink() ?>"> <?php echo mb_strimwidth(get_the_title(), 0, 16,''); ?></a>

调取时间

<?php the_date_xml()?>    //全部时间
<?php the_date(‘Y-m-d H:i l’); ?>    //Date写法
<?php the_time(‘Y年n月j日’); ?>    //Time写法

摘要调取方法

<?php echo mb_strimwidth(strip_tags(apply_filters('the_content', $post->post_content)), 0, 200,"……");  ?>

缩略图调用

functions.php文件中添加以下内容

//开启特色图片
add_theme_support( 'post-thumbnails' );
//调取文章的特色图片
function TeseImage($size="medium"){
if( has_post_thumbnail()){
                 $img_id = get_post_thumbnail_id();
                 $img_url = wp_get_attachment_image_src($img_id,$size);
                 $img_url = $img_url[0];
                 echo $img_url;           
        }else{
                         $rand = rand(1,5);
                         $random_img = get_bloginfo ( 'stylesheet_directory' );
                         echo $random_img."/img/random/".$rand.".jpg";
                 }
}

在主题目录中，/img/random/中放5张图片，作为文章无图是随机调取
调用缩略图

<?php TeseImage(); ?>

获取某个分类下的所有子分类

<?php wp_list_categories("child_of=3&depth=0&hide_empty=0&title_li="); ?>

得到的结果是li标签列表<li><a href=”#”>子分类</a></li>，不含<ul>

相关参数参考教程 https://www.wpdaxue.com/wp_list_categories.html

首页获取公司简介

<?php query_posts('page_id=2');//修改页面ID ?>
<?php while (have_posts()) : the_post(); ?>
<?php echo mb_strimwidth(strip_tags(apply_filters('the_content', $post->post_content)), 0, 300,"……"); //修改显示字数 ?>
<?php endwhile;wp_reset_query();?>

制作底部模板footer.php

分离标签

<?php get_footer();?>

版权信息

Copyright © 2014-2018 <a href=”<?php echo get_option('home'); ?>”> <?php bloginfo(‘name’); ?></a> All rights reserved. 版权所有

备注：备案号调用方法，需要在网站后台填写备案号

<a href="http://www.miitbeian.gov.cn/" rel="external nofollow" target="_blank">ICP备案号：<?php echo get_option( 'zh_cn_l10n_icp_num' );?></a>

添加Hook标签

<?php wp_footer();?>

制作列表页 archive.php

修改静态页面的路径

<?php bloginfo('template_directory'); ?>

2、调用header、sidebar、footer文件

<?php get_header();?>    //头部
<?php get_footer();?>    //底部
<?php get_sidebar();?>    //侧边栏

<?php echo get_option('home'); ?>    //获取主页路径
<?php single_cat_title(); ?>    //获取当前分类名称
<?php the_category(); ?>    //获取当前分类名称和链接

3、文章列表调用：

3-1、循环调用文章

<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<!--需要循环的模块-->
<?php endwhile; ?>
<?php endif; wp_reset_query(); ?>

3-2、标题调用：

<a href="<?php the_permalink() ?>"> <?php echo mb_strimwidth(get_the_title(), 0, 16,''); ?></a>

<?php the_date_xml()?>    //日期调用
<?php wp_title('');?>    //标题调用
<?php the_category(', ') ?>    //调用分类

网站后台安装分页插件wp-pagenavi

<?php wp_pagenavi(); ?>    //调用分页

制作侧边栏 sidebar.php

调用侧边栏

<?php get_sidebar();?>

调取当前分类的根分类，同时获取根分类的二级分类

2-1、在functions.php中添加以下代码

//获取当前分类的根分类ID
function get_category_root_id($cat)
{
$this_category = get_category($cat); // 取得当前分类
while($this_category->category_parent) // 若当前分类有上级分类时，循环
{
$this_category = get_category($this_category->category_parent); // 将当前分类设为上级分类（往上爬）
}
return $this_category->term_id; // 返回根分类的id号
}

2-2、在页面中调用，输出的是<li>标签

<?php
if(is_single()||is_category())
{
if(get_category_children(get_category_root_id(the_category_ID(false)))!= "" )
{
echo wp_list_categories("child_of=".get_category_root_id(the_category_ID(false)). "&depth=0&hide_empty=0&title_li=&orderby=id&order=ASC");
}
}
?>

制作产品列表页 category-分类别名.php / category-分类id.php

1、修改静态页面的路径

<?php bloginfo('template_directory'); ?>

2、调用header、sidebar、footer文件

<?php get_header();?>    //头部
<?php get_footer();?>    //底部
<?php get_sidebar();?>    //侧边栏

3、文章列表调用：

3-1、循环调用文章

<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<!--需要循环的模块-->
<?php endwhile; ?>
<?php endif; wp_reset_query(); ?>

3-2、标题调用：

<a href="<?php the_permalink() ?>"> <?php echo mb_strimwidth(get_the_title(), 0, 16,''); ?></a>

<?php the_date_xml()?>    //日期调用
<?php wp_title('');?>    //标题调用
<?php the_category(', ') ?>    //调用分类
<?php the_ID(); ?>    //文章ID

3-3、缩略图调用

<?php TeseImage(); ?>

制作文章页面 single.php

1.调用header、sidebar、footer文件

<?php get_header();?>    //头部
<?php get_footer();?>    //底部
<?php get_sidebar();?>    //侧边栏

2、文章内容调用：

2-1、循环标签

<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<!--需要循环的模块-->
<?php endwhile; ?>
<?php endif; wp_reset_query(); ?>

2-2、元信息调用

<?php the_date_xml()?>    //日期调用
<?php wp_title('');?>    //页面标题
<?php the_content(""); ?>    //文章内容
<?php the_category(', ') ?>    //所属分类
<?php the_tags('标签： ', ', ', ''); ?>    //文章标签
<?php the_author(); ?>    //文章作者

<?php previous_post_link('上一篇： %link'); ?>
<?php next_post_link('下一篇： %link'); ?>

制作单页面 page.php

调取第二个菜单

<?php wp_nav_menu( array( 'container' => '','menu_class' => 'navigation','menu_id' => 'nav_sgBhgn', 'theme_location' => '关于我们') ); ?>

2.定义一个自定义page模板

<?php
/*
Template Name: 联系我们
*/
?>

主题切换插件

Any Mobile Theme Switcher

其他重点内容

代码里放简码

<?php echo do_shortcode( '[contact-form-7 id="64" title="联系表单 1"]' ); ?>

根据分类ID获取分类名称和链接

<?php echo get_cat_name( 1 );  ?>
<?php echo get_category_link( 1 ); ?>

获取分类

<?php
$args=array(
'orderby' => 'name',
'order' => 'ASC',
'hide_empty' => false,
'child_of' => get_option('zfan_archive_case_top')
);
$categories=get_categories($args);         
?>
<h3 style="cursor: pointer;" onclick="location.href='<?php echo get_category_link(get_option('zfan_archive_case_top')); ?>'">全部作品</h3>
<?php foreach($categories as $cat): ?>
    <a href="<?php echo get_category_link($cat->term_id); ?>"><?php echo $cat->name ?></a>
<?php endforeach; ?>

获取文章自定义字段

<?php echo get_post_meta($post->ID,'video',true); ?>

archive分配多个archive模板

<?php
function getcatson($id)
{
    $categorys = get_categories("echo=0&child_of=".$id."&title_li=&depth=0&hide_empty=0");
    $cats = array();
    foreach($categorys as $category){
        $cats[] = $category->term_id;
    }
    $cats[] = $id;
    return $cats;
}
$zfan_news = getcatson(get_option('zfan_archive_news'));
$zfan_case = getcatson(get_option('zfan_archive_case'));
$zfan_tidbits = getcatson(get_option('zfan_archive_tidbits'));
if(!is_array($zfan_news) && !is_array($zfan_case) && !is_array($zfan_tidbits)){
    include(TEMPLATEPATH . '/archive_news.php');
}else{
    if(is_category($zfan_case)){
        include(TEMPLATEPATH . '/archive_case.php');
    }elseif(is_category($zfan_tidbits)){
        include(TEMPLATEPATH . '/archive_tidbits.php');
    }else{
        include(TEMPLATEPATH . '/archive_news.php');
    }
}
?>

获取文章摘要

<?php if(has_excerpt()) the_excerpt();else echo mb_strimwidth(strip_tags($post->post_content),0,400,'<a target="_blank" href="'.get_permalink().'">......[阅读全文]</a>');?>

8、关闭后台主题、插件更新提醒

remove_action('load-update-core.php', 'wp_update_themes');
add_filter('pre_site_transient_update_themes', create_function('$a', "return null;"));
remove_action('load-update-core.php', 'wp_update_plugins');
add_filter('pre_site_transient_update_plugins', create_function('$a', "return null;"));
remove_action ('load-update-core.php', 'wp_update_themes');
add_filter('pre_site_transient_update_core', create_function('$a', "return null;"));

9、functions.php文件里引入其他php文件

require get_template_directory() .'/include/custom_post_type.php';

10、编辑器改为老版

if ( version_compare( get_bloginfo('version'), '5.0', '>=' ) ) {
    add_filter('use_block_editor_for_post', '__return_false'); // 切换回之前的编辑器
    remove_action( 'wp_enqueue_scripts', 'wp_common_block_scripts_and_styles' ); // 禁止前端加载样式文件
}else{
    // 4.9.8 < WP < 5.0 插件形式集成Gutenberg古腾堡编辑器
    add_filter('gutenberg_can_edit_post_type', '__return_false');
}

发送评论 编辑评论

发送评论编辑评论