建站教程

建站教程

Products

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

WPJAM Basic 详细介绍:一键设置和应用 WordPress 缩略图(WordPress内容页上下篇显示缩略图)

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


WPJAM Basic 详细介绍:一键设置和应用 WordPress 缩略图

WordPress 默认的缩略图设置是比较复杂的,如果需要某种特定尺寸的缩略图,是需要事先通过 set_post_thumbnail_size 函数进行预先定义,WordPress 才会在图片上传的时候,裁剪或缩放出对应的尺寸的图片。

从前面 WPJAM Basic 的 CDN 加速 的功能介绍可知:云存储都有动态缩放和裁剪功能,所以如果 WordPress 开启「CDN 加速」加速,就可以利用云存储的图片裁剪功能实时图片处理,而不需要预先定义缩略图的大小了。

缩略图设置

这个就是 WPJAM Basic 插件「缩略图设置」功能的由来,所以一般来说 WPJAM Basic 的缩略图功能需要结合「CDN加速」功能一起使用。

首先是选择怎么应用 WPJAM Basic 的缩略图设置到 WordPress 站点中,这里提供了两个选项:

第一个是需要手工修改主题代码,使用WPJAM Basic 提供的缩略图函数来修改主题使用的默认的 WordPress 函数。

另外一个会自自动应用,但是前提是主题要写得比较标准,比如 WordPress 官方出的主题,那么可以选择该选项,什么都不用动,程序会自动使用下面的设置的缩略图选项。

默认缩略图

默认文章缩略图是指在各种情况都找不到缩略图之后,默认使用的缩略图,这里设置之后,就能保证文章缩略图不会为空,现在可以设置多张默认缩略图,然后系统会默认选取一张。

分类缩略图

接着我们可以决定是否开启分类缩略图,并且指定开启分类缩略图的模式:本土媒体模式还是输入图片链接模式,以及哪些分类模式支持缩略图和缩略图的尺寸。

设置之后,在分类列表页,就会出现缩略图:

点击分类名称前的缩略图或者「暂无图片」的提示,就可以设置或者更换分类缩略图:

文章缩略图

最后就是设置获取文章缩略图的顺序,首先使用文章特色图片,如果没有设置文章特色图片,可以定义获取文章缩略图的顺序,如文章中第一张图所示,我首先定义从标签的缩略图中获取,如果没有,再从第一张图片,最后从分类缩略图中获取,最后的最后,你猜到了就是默认缩略图。

再次重复一下,这里的文章缩略图的设置要应用到主题中,就涉及到前面第一个选项的设置了,可以选择手动去修改主题,也可以选择自动应用,自动应用的前提就看你的主题是否写的标准。

WordPress内容页上下篇显示缩略图

通常WordPress内容页的上一篇和下一篇都是标题加链接的形式,如果想换一个样式,比如显示缩略图,该怎么实现呢?网上整理了一下,分享给大家。

WordPress内容页上下篇显示缩略图

WordPress内容页上下篇显示缩略图:

1、将以下代码复制到functions.php中

//WordPress文章上一篇下一篇显示缩略图

function wptoo_pageturn_thumb($id){

if (has_post_thumbnail($id)) {

echo get_the_post_thumbnail( $id, \\\'\\\', \\\'\\\' );

} else {

$first_img = \\\'\\\';

ob_start();

ob_end_clean();

$output = preg_match_all(\\\'/<img.+src=[\\\\\\\'\\\"]([^\\\\\\\'\\\"]+)[\\\\\\\'\\\"].*>/i\\\', get_post( $id )->post_content, $matches);

$first_img = $matches [1] [0];

if(empty($first_img)){ //Defines a default image

$random = mt_rand(1, 10);

$first_img= get_bloginfo ( \\\'stylesheet_directory\\\' ).\\\'/images/random/\\\'.$random.\\\'.jpg\\\';

}

echo \\\'<img class=\\\"uk-overlay-scale\\\" src=\\\"\\\'.$first_img.\\\'\\\" alt=\\\"\\\'.get_post( $post_id )->post_title.\\\'\\\" />\\\';

}

}

2、复制以下代码到single.php文件中

<?php

$current_category = get_the_category();//获取当前文章所属分类ID

$prev_post = get_previous_post($current_category,\\\'\\\');//与当前文章同分类的上一篇文章

$next_post = get_next_post($current_category,\\\'\\\');//与当前文章同分类的下一篇文章

?>

<div>

<?php if (!empty( $prev_post )): ?>

<?php wptoo_pageturn_thumb($prev_post->ID);?>

<a href=\\\"<?php echo get_permalink( $prev_post->ID ); ?>\\\" rel=\\\"external nofollow\\\" >

<span>上一篇:<?php echo $prev_post->post_title; ?><span>

</a>

<?php endif; ?>

</div>

<div>

<?php if (!empty( $next_post )): ?>

<?php wptoo_pageturn_thumb($next_post->ID);?>

<a href=\\\"<?php echo get_permalink( $next_post->ID ); ?>\\\" rel=\\\"external nofollow\\\" >

<span>下一篇:<?php echo $next_post->post_title; ?></span>

</a>

<?php endif; ?>

</div>

3、具体大小样式,可以自己修改。

标签:

提交需求或反馈

Demand feedback