26讲项目实战：分页插件+图集插件+文章详细页调用

#26讲项目实战：分页插件+图集插件+文章详细页调用

 一、分页插件功 WP-PageNavi
 1、安装插件  WP-PageNavi
 2、列表页调用分页插件 <?php wp_pagenavi(); ?>

 
二、控制每页显示文章的数量
 1、在主题模板文件下的 functions.php文件中加入如下代码
<?php  
function custom_posts_per_page($query){
    if(is_home()){
    $query->set('posts_per_page',8);//首页每页显示8篇文章
    }
    if(is_search()){
        $query->set('posts_per_page',-1);//搜索页显示所有匹配的文章，不分页
    }
    if(is_archive()){
        $query->set('posts_per_page',1);//archive每页显示25篇文章
}//endif
}//function
add_action('pre_get_posts','custom_posts_per_page');
?> 

 
 分页效果如下
三、自定义css样式来修饰分页样式
 查看编译后的分页代码，然后自已写css样式

四、添加文章详细页模板

 1、在主题模板文件下添加  single.php 文章详细页模板
 2、把图片地址和css样式样地址更换
 3、把头部和底部替换成标签调用

五、文章详细调用标签
 
 <?php the_title(); ?>   标题标签
 <?php the_field('xcts'); ?>  自字义字段标签

找到编译后的代码进行自定义CSS样式 美化分页代码
 调试好分页样式代码后 放入到index.css文件中
 文章 详细模板

single.php

图集插件Easy Image Gallery

 四、图集插件的安装 Easy Image Gallery
 
 1、安装插件  Easy Image Gallery 图集插件
 2、在文章添加页最下面出现添加图集模块(上传图片)
 3、在文章详细页模板调用标签，显示添加的图集图片
 
 代码:

 <?php 
  if( function_exists( 'easy_image_gallery' ) ) {  
   echo easy_image_gallery(); } 
 ?>

五、如何设置图集调用后编译的代码

1、进入安装好的插件页面，找到对应的插件(点击编辑)
 
2、找到页面模板template-functions.php 改代码 
 去掉代码:                                                                                    </ul>      
 替换代码:把红色部分，分别换成下面的代码
 $html = sprintf( '<img src=%s />', $image_link);

 

 
$html = sprintf( '<img src=%s alt=%s/>', $image_link,$image_caption) 
六、改变CSS样式来控制图片大小