`
zhou3xin
  • 浏览: 5039 次
  • 性别: Icon_minigender_1
  • 来自: 广州
最近访客 更多访客>>
社区版块
存档分类
最新评论

Wordpress里面的Set Featured Image

阅读更多
如何在WordPress里使用Featured Image功能
2011-04-01 — Unmi

我想大部分人都很清楚WordPress 2.9版本开始,就增加了Featured Image这个功能。而且这样的功能多用于杂志式的主题,从里一个角度来说,用缩略图的形式比摘要输出形式更能体现网站的可读性!这里就介绍下如何为你的 WordPress主题添加Featured Image功能。

首先,看一看你的主题包,在functions.php文件里必须有下面的语句才能开启单篇日志以及页面里的Featured Image功能。

add_theme_support( 'post-thumbnails' );

当然,如果你只希望在单篇日志里开启这样的功能,只要加入

add_theme_support( 'post-thumbnails', array( 'post' ) );

页面功能同理:

add_theme_support( 'post-thumbnails', array( 'page' ) );

之后,你就需要设定你的缩略图大小,在保证图像不扭曲的情况下,图片的宽度或者高度会被自动按比例调整到最合适的大小,比如100×50像素的图 像,在一个固定为50×50像素大小的显示框下,会调整到50×25像素大小。这样的好处是能显示全部的图像。不过你可以发现,很多时候,缩略图的大小未 必能完全合适整个显示框的大小。比如刚刚的例子,至少还有一半的空间是空余的。因此,你可以自由设定显示框里缩略图的大小,比如单独限定高度或者宽度大 小。不过,这样设置,缩略图可能会扭曲或者只显示一部分。

一下这个定义语句表示现实框的大小为50X50像素,缩略图按比例自动调整。

set_post_thumbnail_size( 50, 50 );

再来看看下面这个定义语句。它表示缩略图会被自动截图成为大小为50X50像素。但是缺点很明显,它只是从坐标0,0开始截图,对于大图来说,它只是显示图片的冰山一角。

set_post_thumbnail_size( 50, 50, true );

现在,你可以开始讲这些定义语句添加在你的主题里,通常都被用在循环(the loop)定义里。

has_post_thumbnail() 将定义是否在当前日志里显示被手动添加的日志缩略图(in the loop)。

<?php
if ( has_post_thumbnail() ) {
// the current post has a thumbnail
} else {
// the current post lacks a thumbnail
}
?>

如果缩略图存在,下面这句定义将显示缩略图

<?php the_post_thumbnail(); ?>

以上这些都是最基本的定义。当然还有更深入的用法。

假设,如果你要在首页显示比较小的缩略图(比如50×50像素),但是在单独日志页面显示比较大的缩略图(比如宽度限定在400像素),你可以完全自定义。

在functions.php里:

add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 50, 50, true ); // 非单独页面的显示设置
add_image_size( 'single-post-thumbnail', 400, 9999 ); // 单独日志页面显示设置,9999像素为的是给缩略图另一边大小以最大的空间

在home.php / index.php (取决于你的主题设计)(in the loop) :

<?php the_post_thumbnail(); ?>

在single.php (in the loop) :

<?php the_post_thumbnail('single-post-thumbnail'); ?>

希望你能看得明白以上的设置。

原理是,set_post_thumbnail_size () 对应 add_image_size ('post-thumbnail') 一起工作。同时,当你添加更多的设定到里面,比如add_image_size( $handle, $width, $height, {$hard_crop_switch} ); 然后the_post_thumbnail( $handle );就会开始工作,处理并按照你定义的缩略图样式。

当然,如果你要你的主题支持更早的WordPress版本,你必须得用function_exisit ()(以上的例子里并没有使用function_exisit (),为的是尽量让定义简单易用。):

if ( function_exists( 'add_theme_support' ) ) { // Added in 2.9
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 50, 50, true ); // Normal post thumbnails
add_image_size( 'single-post-thumbnail', 400, 9999 ); // Permalink thumbnail size
}

不过需要明白的是,这个功能只针对新上传的图片。假如你之前使用过带有缩略图显示功能的主题,并且新的主题对缩略图的大小设定有别于之前的主题,那么以前上传过的缩略图大小还是保持原来的大小,而新的缩略图将定义于新的设定。

不过这里推荐一个插件Regenerate Thumbnails,将帮助你调整缩略图大小。

转自:http://docolours.com/wordpress/howto-output-featured-image-function-theme.html

本文链接 http://unmi.cc/wordpress-enable-featured-image, 来自 隔叶黄莺 Unmi Blog
分享到:
评论

相关推荐

    WordPress外链图片插件Featured Image from URL

    Featured Image from URL Premium(FIFU)是一个WordPress图像插件,在后台发布帖子时,如果内容中有图片地址,可以将文章中第一第图像链接作为文章或页面的特色图像/缩略图,不用手动设置特色图像...

    WordPress特色图片插件–Featured Image from URL Premium v6.2.2

    Featured Image from URL Premium是WordPress上的一款特色图片插件,使用它你可以将外部URL地址的图片使用到WordPress特色图片当中。使用它你可以引用外部图片、视频、音频和滑块等资源。

    【WordPress插件】2022年最新版完整功能demo+插件v5.4.3 Untouched.zip

    Featured Image from URL Premium - WordPress Plugin 来自URL Premium - WordPress插件的特色图片" ---------- 泰森云每天更新发布最新WordPress主题、HTML主题、WordPress插件、shopify主题、opencart主题、PHP...

    WordPress 添加Meta Box的方法

    相信很多站长都知道并且已经在使用WordPress自定义字段,很多插件也使用了这一功能。 自定义字段是一个非常不错的功能,它能够让我们为文章添加各种自定义的属性,高度灵活,操作简单。比如可以为文件添加一个SEO ...

    rest-api-featured-image:将特色图片src url字段添加到WordPress Rest API

    注意:这是开发版本,包含的功能可能处于开发的各个阶段。 如果要在实时网站上使用它,请在此处下载: 。 REST API特色图片 该插件将添加带有特色图片src URL的顶级... REST API特色图片字段: featured_media_src_url

    wordpress团购淘客主题 v3.9

    易秀购主题网推荐的wordpress主题中这样...cats.php文件中第一行代码array(1,9)里的数字,多个分类用英文逗号分隔产品缩略图调用WordPress的特色图像(Featured Image),演示站点和演示图片有些差异,但是大同小异。

    wordpress插件-content-gallery

    wordpress幻灯片插件content-galler 1.Content Gallery插件安装。首页幻灯显示图文的插件content-gallery使用方法,直接复制插件目录content-gallery到WP插件目录里面。然后到WP后台插件里面启用Featured Content ...

    wordpress 汉化幻灯插件 rar

    标题中的“wordpress汉化幻灯插件rar”指的是一个针对WordPress平台的中文本地化插件,主要用于创建和展示幻灯片。WordPress是一个流行的开源内容管理系统(CMS),它允许用户轻松地构建和管理网站。汉化意味着这个...

    wordpress 图片缩略图插件

    WordPress默认提供了基本的缩略图功能,即“特色图像”(Featured Image),但这个功能相对简单,可能无法满足所有网站的需求。而专门的图片缩略图插件则提供了更高级和定制化的选项。例如,`wp-thumbnails`这个插件...

    wordpress plugs categories-images

    Tags: Category Image, Category Images, Categories Images, taxonomy image, taxonomy images, ... categories images plugin, category featured image, categories featured images, feature image for category

    【WordPress插件】2022年最新版完整功能demo+插件v9.3.0.zip

    Quick Featured Images Pro - WordPress Plugin 快速特色图片Pro - WordPress插件" ---------- 泰森云每天更新发布最新WordPress主题、HTML主题、WordPress插件、shopify主题、opencart主题、PHP项目源码、安卓项目...

    inherit-featured-image:JSM的继承父精选图像(WordPress插件)

    JSM的继承父精选图像插件名称JSM的继承父精选图像概括从...绩效编码该插件使用WordPress的wp_cache_get()和update_meta_cache()函数来实现最佳性能,并与WordPress核心功能完全集成。需要提升您的社交和搜索排名?

    WordPress Coupon Theme clipper.v1.2.4

    Clipper theme is a new premium wordpress coupon theme from Appthemes. Coupon collecting and using is becoming big business. With new sites like Groupon and the launch of a new television series ...

    【WordPress插件】2022年最新版完整功能demo+插件2.20.zip

    "【WordPress插件】2022年最新版完整功能demo+插件2.20 WooCommerce Multilevel Referral Affiliate Plugin Woocommerce Multilevel推荐联盟插件" ---------- 泰森云每天更新发布最新WordPress主题、HTML主题、...

    Sitepoint.The.WordPress.Anthology

    - **第8章:Image Galleries and Featured Images** - **知识点简介**:探讨图像画廊与特色图片的实现方法。 - **核心内容**: - 图像处理技术介绍; - 构建自定义图像画廊的方法; - 特色图片的应用场景与最佳...

    【WordPress插件】2022年最新版完整功能demo+插件v1.3.12.zip

    YITH WooCommerce Featured Audio & Video Content Yith Woommermermermermermememe ermerme统出音频和视频内容" ---------- 泰森云每天更新发布最新WordPress主题、HTML主题、WordPress插件、shopify主题、...

    Wordpress 自动旋转的幻灯片(图片轮播)插件.rar

    Wordpress 自动旋转的幻灯片插件——featured-content-gallery,就像腾讯网的插件一样,在含有较多图片的时候,会自动抽取出图片,并生成幻灯片,支持快进和后退,支持缩略图显示,本款插件来自Wordpress官方,英文...

    set-thumbnail-automatically-s:Systemo 为 WordPress 自动设置帖子缩略图

    在WordPress中,文章的缩略图,也称为特色图片(Featured Image),是网站内容的一种重要视觉元素,它通常用于在首页、归档页面或者社交媒体分享时预览文章内容。"set-thumbnail-automatically-s" 是一个针对...

    featured-content-slider.zip_jquery featured

    【标题】"featured-content-slider.zip_jquery featured" 涉及到的是一个使用jQuery和jQuery UI库构建的特色内容滑动展示组件。这个组件通常用于网站的首页或重要区域,以吸引用户注意力并动态地展示多块内容,如...

Global site tag (gtag.js) - Google Analytics