wordpress功能集成(十三):添加特色图像支持

wordpress从2.9版本开始支持文章特色图片,让自己的主题支持特色图片很简单,在主题的functions.php文件中添加以下代码:

  1. add_theme_support( 'post-thumbnails' );  

add_theme_support函数可以很方便给主题添加一些功能支持:函数解释如下

  1. <?php   
  2. add_theme_support( $feature );   
  3. //参数feature可以使下列内容   
  4. //'post-formats'-添加文章形式支持,比如相册、图像、视频   
  5. //'post-thumbnails'-特色图像   
  6. //'custom-background'-自定义背景   
  7. //'custom-header'-自定义头部   
  8. //'automatic-feed-links'-文章和评论RSS feed链接   
  9. ?>  

添加缩略图支持还可以这样:

  1. <?php   
  2. add_theme_support( 'post-thumbnails' ); //所有   
  3. add_theme_support( 'post-thumbnails', array( 'post' ) );          // 只文章   
  4. add_theme_support( 'post-thumbnails', array( 'page' ) );          // 只页面   
  5. add_theme_support( 'post-thumbnails', array( 'post', 'movie' ) ); // post和Movies(自定义文章类型)   
  6. ?>  

插入代码之后进入后台就可以在后台编辑文章页面看到特色图像支持,如图:

wordpress后台特色图像支持

至于怎么添加的话,我认为应该大概可能都会。

设置缩略图大小

  1. <?php   
  2. set_post_thumbnail_size( 120, 120, true );   
  3. //前面两个参数分别为-宽、高   
  4. //后面参数为是否裁剪图片到这么大 true为裁剪   
  5. ?>  

注意,设置了缩略图大小之后,并不是说你输出特色图像的时候就直接输出这个大小,这个代码的功能只是在你设置缩略图的时候将那个图片生成了一个你设定大小的图片。输出特色图像的时候还是要加上大小,不然就会输出原图。

调用缩略图

调用缩略图我觉得不能简单的使用一个输出缩略图的函数,应该加上一些判断,用户有设置特色图像的时候就输出特色图像,没有设置的时候就调用文章内容中的图像,如果还没有的话,就调用一个默认图片。

  1. <?php   
  2. $thumb_img = has_post_thumbnail() ? get_the_post_thumbnail( $post->ID, array(360, 200), array('alt'=>$post->post_title) ) : get_post_img( 360, 200 );   
  3. //has_post_thumbnail判断是否有特色图像,arry(360,200)为特色图像大小   
  4. //get_the_post_thumbnail调用图像   
  5. //get_post_img是自定义的调用文章内容中图片函数   
  6. echo $thumb_img;   
  7. ?>  

关于从文章内容中获取图片的函数get_post_img,可参考上一篇文章。
这里的代码如下:

  1. //获取缩略图   
  2. function get_post_img($width="100",$height="100") {   
  3.     global $post$posts;   
  4.     $first_img = '';   
  5.        
  6.     $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
  7.       
  8.     $first_img = '<img src="'. $matches[1][0] .'" width="'.$width.'" height="'.$height.'" alt="'.$post->post_title .'"/>';  
  9.       
  10.     if(empty($matches[1][0])){  
  11.         $first_img = '<img src="'. get_bloginfo('template_url') .'/images/defalt.png" alt="'.$post->post_title .'" width="'.$width.'" height="'.$height.'"/>';   
  12.     }   
  13.        
  14.     return $first_img;   
  15. }  

这样就非常和谐了。如果加个后台设置,让用户自己设置没有图片时显示的默认图片,就更好了

已有11条评论

  1. 天猫旗舰店
    天猫旗舰店 : 回复

    还是先学习下css以及html吧!

  2. ideawar
    ideawar : 回复

    树哥 我想请问一下,用3.7版的,调用外链图片作为特色图像应该怎样做?感谢!

  3. 脑残协会
    脑残协会 : 回复

    试一试去,不试一试怎么会知道呢  嘿嘿 感谢楼主分享

  4. wesley
    wesley : 回复

    特色图像已经添加成功,但是样式是文章的前方一个图片,怎么样才能在文章右侧环绕加进去这个特色图像呢?

    • 阿树工作室
      阿树工作室 回复wesley: 回复

      这个就是css的事了,如果要文字环绕图片,一般给图片加float属性。

  5. wesley
    wesley : 回复

    调用缩略图 需要加到哪里?loop?

    • 阿树工作室
      阿树工作室 回复wesley: 回复

      调用缩略图需要用到文章ID,在loop内部的话就会默认当前文章,如果用在别的地方,需要传入ID参数

      • wesley
        wesley 回复阿树工作室: 回复

        那我想问下,我已经加入特色图片,但是不能右侧显示,只是在文章前方显示,怎么才能右侧?

        • 阿树工作室
          阿树工作室 回复wesley: 回复

          很抱歉,这应该是css的问题,我不能回答你,css要和html配合的。。

  6. 免费天堂
    免费天堂 : 回复

    这个看起来,还要有点技术的,,都看不明白….

    • 阿树工作室
      阿树工作室 回复免费天堂: 回复

      对于不懂技术确实难,看着代码可能犯晕,不过这个确实简单,也许我写的不好。。

发表评论