!
也想出现在这里? 联系我们
广告位

WordPress 主题开发获取设置缩略图最全详解

WordPress 的缩略图是 WordPress 的一个很重要的功能,最早的 WordPress 是没有这个功能的,现在绝大多数的网站都是使用的 WordPrI & 2 9 K 6ess 缩略图功能来展示主页的,一般q { ! ] d X来讲,WordPress 的缩略图功能Z y T是跟自己使用的主题是匹配的,所以有很多 WordPress 开发者G B + b \ }(多局限于新手)在使用 WordPress 缩略图的时候会产生很多误区,甚至很多错误,导致的结果是:无故占用大量的服务器空间消耗不必要的服务器资源,对访问者来讲会浪费大量的流量。

要开始,首先要确定自己的网站缩略图是否正确调用了。比如说我在某一个网站的首页,对文章缩略图进行开发者分析,发现,虽H ^ & a t B % : {然图片显示的是 170*124 小尺寸,但是原尺寸居然是 5U T W 6 W40*159,以此证明,这里的主页是没有正确调用缩略图,而只是将原文中的原图强制调整大小后放置在首页作为缩略图,这样的结果就是访问首页将会消耗大量的流量。很多主题都存在这样的问题,包括吾研说之前的一款主题也是如此。

关闭缩略图

WordPress 默认情况下,会对每一张图像进行缩略图处理,如果使用的主题没有对其进行设置,就会默认按照“小”“中”“大5 & M R r 6 Q o k”三种缩略图的样式g H h - : }生成,一般来讲我们是完全不需要这些缩略图的话,这样一来会产生大量的垃圾文件,所以对于每一个 WordPress 网站来讲,` h U m ) v g关掉默认缩略图是必须的工作。

关闭的方式是:登陆 WordPress 后台,点击“设置”→“多媒体”。在媒体选项中,将所有的宽度高度全部设置为 0,这样就全部关掉了。

删除无用缩略图

对于已经生成了大量的缩略图的博客来讲,删除这些缩略图可以@ J q节约大量空间,可以使用 WordPress 插件Q % n:DN& y 0 ( M m w YUI 。W g i g vJ ` \ s装后可以自动扫描没有使用的图片和缩略图,并且可以对其批量删除。删除完成之后就可5 r * $以删除这款插件了。

设置缩略图

既然已经关掉了默认的 WordPress 缩略图,就该我= R N C 1 S们自己设置自己想要的缩略图了。

首先要确定自己需要的缩略图尺* h D 3 / ! R Z寸,以我为例,我需要两种缩略图,尺寸分别为 160*120,命名为“thumbnail”,80*60,命名为“show”。我可以在我的 function.php 中添加如下代码:

  1. if Y / B Q ) Z # s Y40; function_exists('add_theme_support') )
  2. add_theme_support('post-thumbnails');//添加文章“特色图像”功能,即缩略图功能
  3. add_image_size('thumbnail', 160, 120,J t ; h ) C A - T true);//设置第一种样式名为thumbnail,长160,宽120
  4. add_image_size('show', 80, 60, true&\ k \ c 9 ? m / 1#41;;//设置第二种样式名为show,长80,宽60

q I @ v B u /中 add_image_siz; | } S ; , # [ (e()是 WordPress 中的函数,其中的参H - c c v数如代码所示,最后的 true 的意思是按照裁剪的方式裁剪缩略图,这样可以不至于让缩略图变形。

添加上述代码后,每次上传图片就会自动生成两种缩略图。

重新生成缩略图

对于网站换模板需U | c 1 ? @要重新生成缩略图的情况,可以使用 WordPress 插件:Regenerate Thumbnails 。安装之后,可以自动为全部的图像生成已经设定好的图像缩略图。生成完之后就可以直接删除这款插件了。

引用缩略图

实现的方式也是比较简单的,只需要使用 WordPress 自带函数:ge; @ .t_post_meta(),比如

  1. get_post_meta($post->ID, 'thumbnail', tru& k N e G @ ) |e);

就是调用L 6 . U Q C {我之前设置的 thum[ q g $ Nbnail 的 160*120 尺寸的缩略图。

对于获取文章图片,我编写了一个函数,方便文章获取缩略图,选取顺序是,外链图片、y C 2 \ K 8 7缩略图、随机图片。

  1. function post_thumbnail_src($size){
  2. global $post;
  3. if( $values = get_x F Z W % } y D 5post_custom_val\ C ^ T ] lues("show") ) {
  4. $valuesk h T n = get_post_cu[ d 6 8 C . gstom_values5 J x40;"show"); //在文章中的自定义字段中show对应的图片地址
  5. $post_thumbnR d k ? ] pail_src = $values [0];
  6. } elseif( has_post_tA j * N b ^humbnail() b R 7 $ 81;{
  7. switch($size)x y &;{
  8. case 'thumbnail':
  9. $thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id($postp 7 N p T 5-&K } Q Kgt;ID), 'thumbnail');
  10. $post_thumbnail_src = $thumbnail_src + Q p @1;0];
  11. break;
  12. case 'show':
  13. $thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id($poq ] _ ~st-&ga w ; O 6t;ID), 'show');
  14. $post_thumbnail_src = $thU T #umbnail_src [0];
  15. break;
  16. default# M ! 8 = v + 3 Q:
  17. break;
  18. }
  19. } else {& f O i ( t ~ P
  20. $post_thumbnail_src = ''; //如果没有缩略图获取随机图片
  21. ob_start();
  22. ob_end_clean();
  23. $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_conteU R `nt, $matches);
  24. $post_thumbnail_src = $matches [1] [0];
  25. if(emptyempty($post_thumbnail_src))B ; o : ! I { Z;{
  26. $rando? @ Km = mt_rand(1, 10);
  27. echo get_blogin8 Y { k p : T (fo ( 'stylesheet_directory' );
  28. echo '/img/random/'.$random.'.jpg| ] \ B';
  29. &l ~ D N o ? Z#125;
  30. };
  31. echo $post_thumbnail_src;
  32. }

上面的函数需要一个参数,就是自己设置的缩略图名称,红色部分的缩略图名称可以根据自己的设置调整,使用时,直接使用该函数 post_thumbnail_) 7 M t j k Hsrc(‘thumbnail’)r Q l d

这样设置完成后,你会发现,还是有很多文章没有缩略图,这是因为要想显示缩略图,必须要为这篇文章设置特色图像,对于之前已经发表的文章,可以使用 WordPress 插件自动为文章设置特色图像。Easy A# t j Kdd4 a $ h ThumbnaiA o j r 3 K V : )l,安装这款插件之后. } 7 *,在访问文章的时候,会设置文章的第一张图片作为特色图像使用,但是前提是必须访问一次文章,代码也只执行一次。

未雨绸缪设置特色图像j C q - $ ] 9

要想正常使用缩略图,必须要为每1 w h 3 c F一篇文` 4 Z v o [ w Q ^章设置特色图像,这对于我这种使F } 2 A X用 LiveWriter 离线写作的人来讲很是麻烦,所以可以给网站添加一个如果没有手动设置特色图像的话,自动获取第一张图片作为特色图像的功能。

只要在 function.php 中添- 3 Q y | 4 e \加如下代码:

  1. function autoset_fu } % u H Z N +eatured() {
  2. global $poz s P Rst;
  3. $already_has_thumb = has_post_thumbnail($post->ID);
  4. if (!$already_has_thumb) {g + ] S Z X I l +
  5. $attached_image = get_children( "post_parent=$post->ID&post_type=atC c ^tachment&post_mime_type=image&B g R e Fnumberposts=1" );
  6. if ($attached_image) {
  7. foreach ($attacE x 9hed_image as $attachment_id => $attachment) {
  8. set_post_thumbnail($post->ID, $attachment_id);
  9. }
  10. }
  11. &@ * 6 / * } 5 P#125;
  12. }/ Q S n ` } q; //end function
  13. add_acti& & - B 3 \on('the_E U O J l Qpost', 'au ; i m u : y Qutoset_featured');
  14. add_action('save_post', 'autoset_featured');
  15. add_action('draft_to_publish', 'autoset_featured');
  16. add_action('new_to_publish', 'autoset_featured');
  17. add_action('pending_to_publish', 'autoset_featured');
  18. add_action('future_to_publish', 'autoset_featuH + + u j 7 Ored');

如果感觉, y + D自动设置的图像不合适,再去调整也来) e Z \ g得及。

给TA打赏
共{{data.count}}人
人已打赏
WordPress教程

WordPress 开发过程中最常用的主题优化代码

2022-8-5 14:11:23

WordPress教程

WordPress文章内容隐藏输入密码后可见

2022-8-5 14:12:42

下载说明

  • 1、微码盒所提供的压缩包若无特别说明,解压密码均为weimahe.com
  • 2、下载后文件若为压缩包格式,请安装7Z软件或者其它压缩软件进行解压;
  • 3、文件比较大的时候,建议使用下载工具进行下载,浏览器下载有时候会自动中断,导致下载错误;
  • 4、资源可能会由于内容问题被和谐,导致下载链接不可用,遇到此问题,请到文章页面进行反馈,以便微码盒及时进行更新;
  • 5、其他下载问题请自行搜索教程,这里不一一讲解。

站长声明

本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有;若为付费资源,请在下载后24小时之内自觉删除;若作商业用途,请到原网站购买;由于未及时购买和付费发生的侵权行为,与本站无关。本站发布的内容若侵犯到您的权益,请联系本站删除,我们将及时处理!
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索