今天筆者説的這個縮略圖功能,其實網上已經傳爛了,不知道大家有沒有看過。今兒拿出來原因是,感覺網上説的不是很具體,一些設置沒有提到,所以先給大家提前説一下。

首頁你要看下你所用的主題有沒有開啓文章縮略圖功能,如果看起的話,會在 WordPress 後台編輯頁面或者文章時在右下角的地方看到一個特色圖像的設置,如下圖:

如果沒有説明你還沒有激活這功能。我們需要在你主題 functions.php 裏面加一段代碼。

<?php

add_theme_support( 'post-thumbnails' ); //激活文章和頁面的縮略圖功能。

//如果你想分別激活它們,可以使用下面的代碼:

add_theme_support( 'post-thumbnails', array( 'post' ) ); // 激活文章縮略圖功能

add_theme_support( 'post-thumbnails', array( 'page' ) ); // 激活頁面縮略圖功能

?>

這樣你的縮略圖功能就激活了,然後我們添加圖片或者直接點擊設置特色圖片的時候,你會發現多了一個設置。

我們單擊作為特色圖像,這樣你就可以將這個圖片作為特色圖片顯示了。

做好之後我們就要對它進行調用然後在前台顯示出來,代碼是:

<?php

the_post_thumbnail();

//需要將這段代碼放在你的主循環中比如:

<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>

<?php the_post_thumbnail(); ?>

<?php endwhile; ?>

?>

這樣縮略圖就可以顯示了。這個基本的方法掌握好之後,下面是一些它的其他使用方法。

1. 自定義縮略圖的大小(放在主題 functions.php 裏面 add_theme_support() 的下面)

<?php set_post_thumbnail_size( $width, $height, $crop ); ?>

//$width 是圖片的寬度,可以直接填數字

//$height 是圖片的高度, 也可以直接填數字

//$crop 是否進行裁剪,默認是 false 不裁剪,如果填寫 true 你的圖片將會裁剪成你設置的大小。

不過 set_post_thumbnail_size() 筆者在用的時候不起作用,不知道大家有沒有試過。試過後如果可以使用的記得和筆者説下哈。

我這邊使用的是直接規定縮略圖大小 (直接在主循環裏面輸出)

<?php

the_post_thumbnail('thumbnail');       // 縮略圖 (最大默認 寬 150px 高 150px)

the_post_thumbnail('medium');          // 中等大小 (最大默認 寬 300px 高 300px)

the_post_thumbnail('large');           // 大圖 (最後默認寬 1024px 高 1024px)

the_post_thumbnail('full');            // 原圖

the_post_thumbnail( array(100,100) );  // 自己定義寬高

?>

這裏需要多講一下,設置默認縮略圖大小是在 WordPress 後台 設置-> 媒體 裏面。

2. 判斷文章是否含有縮略圖

<?php

has_post_thumbnail();

//用法是,通過 if 如果進行判斷

if ( has_post_thumbnail() )

{
//顯示縮略圖
}
else
{
//沒有縮略圖 ( 這裏可以放一張默認的圖片 )
}

?>

3. 創建新的縮略圖大小(放在主題 functions.php 文件 add_theme_support() 下面)

我們看到上面設置的圖片大小都是等比例縮小的。不管你怎麼設置它都是按比列來進行縮小的。如果想設置寬高不等的。便可以使用下面這個函數。

<?php

add_image_size( $name, $width, $height, $crop );

//這裏的第一個參數 $name 是新創建縮略圖的名稱,其他的參數和上面説的是一樣的

//使用方法

add_image_size('home-thumb','200','120');

?>

然後我們在顯示的時候只需要在填上新的縮略圖名稱如:the_post_thumbnail('home-thumb'); 這樣就可以顯示了。

4. 獲取縮略圖 ID 號

<?php  get_post_thumbnail_id();  ?>  //放在主循環中

以上便是今天主要講的內容,大家如果以後有需要的可以來看看。