今天筆者說的這個縮圖功能,其實網上已經傳爛了,不知道大家有沒有看過。今兒拿出來原因是,感覺網上說的不是很具體,一些設定沒有提到,所以先給大家提前說一下。
首頁你要看下你所用的主題有沒有開啟文章縮圖功能,如果看起的話,會在 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(); ?> //放在主迴圈中
以上便是今天主要講的內容,大家如果以後有需要的可以來看看。