就是教不落 – 給你最豐富的 3C 資訊、教學網站

《WP筆記》如何在首頁顯示文章第一張圖片縮圖

繼前陣子瘋狂的學習CSS之後,最近換PHP,也是日夜不停的學習,剛好前2天梅干桑在和我討論到首頁自動抓取文章第一張圖片顯示,他不知道為什麼有些圖片就是死不顯示,剛好這2天看完PHP矩陣的部份就研究了一下,花了一點時間自己寫了一段抓取文章第一張圖片的語法,並且加了一些判斷式,我想這應該也有其它人會想用,丫湯就順便也分享一下,需要的人也可以參考看看。

如同上圖那樣,在首頁的摘要中自動插入文章的第一張圖片縮圖,其實很多外掛都可以達成,不過有些需要另外產生縮圖,有些要自定義圖片,而能夠自動截取第一張圖片的又無法自定義,因為有時候第一張圖片難免不合口味。

所以如果平常預設為截取第一張圖片,但如果不喜歡的想自定義的話,可以參考丫湯的做法,但功力不夠高,寫的程式就請各位前輩們見笑了。

做法:

在首頁要顯示第一張圖片的地方插入以下語法

<?php include("firstimg.php") ;?>

然後下載這個檔案解壓上傳到你的佈景資料夾裡

檔案下載:請點我

這個程式寫的其實沒有很完美,客倌們加減用,預設的自動寬度比例是200px,高度會隨寬度縮圖,但有些圖片一定會過長,因此設成超過115px自動截斷而不是縮成115px,圖片就不會變形,另外首頁的縮圖加入了Title和Alt都是文章標題,如果你想修改寬度和高度請打開firstimg.php找到以下語法修改:

第30行(最大高度)

max-height:115px;

第39、48行(圖片寬度)
echo "\"><img src=\"".$thumb."\" width=\"200\" ";
echo "\"><img src=\"".$thePics[0][0]."\" width=\"200\" ";

使用解說:

平常不做任何設定的話,會自動抓取第一張圖片,當然如果你覺得第一張圖片不是你想要顯示的縮圖的話,那麼就可以手動自定義該篇文章的首頁縮圖,只要在編輯文章的下方加入自定義名稱『firstimg』,然後欄位內容輸入你想顯示的圖片就可以了,如此一來該篇文章在首頁顯示的圖片就會依你自定義顯示。

這樣的縮圖顯示方式就彈性許多,不用侷限一定要用第一張圖片,有興趣的就試試吧。

Exit mobile version