WordPress實(shí)現(xiàn)首頁(yè)文章顯示縮略圖的方法
2020-03-27 來(lái)源：愛(ài)站科技
喜歡修改Wordpress主題的朋友肯定都會(huì)想在首頁(yè)文章中顯示縮略圖，但是卻不知道要怎樣才能實(shí)現(xiàn)首頁(yè)文章顯示縮略圖，那么今天就讓西部數(shù)碼小編帶大家去看看WordPress實(shí)現(xiàn)首頁(yè)文章顯示縮略圖的方法。
想在首頁(yè)文章中顯示縮略圖，有插件可以實(shí)現(xiàn)，不過(guò)不方便操作和控制，畢竟代碼是人家寫(xiě)的，今天與大家分享一下，無(wú)插件，純代碼是怎么實(shí)現(xiàn)首頁(yè)文章縮略圖的，方法非常簡(jiǎn)單，就算你不懂代碼，按步驟操作也是可以的。當(dāng)然縮略圖選擇的是文章中的第一張圖片，如果文章不包含圖片，顯示默認(rèn)圖片，所以你要置頂一個(gè)默認(rèn)的圖片位置。
步入正題，開(kāi)始添加首頁(yè)縮略圖，分簡(jiǎn)單3步即可實(shí)現(xiàn)：
第一步：找到使用的主題模板的functions.php文件在<?php和?>之間添加如下代碼
?
function thumb_img($soContent){
$soImages = '~<img [^\>]*\ />~';
preg_match_all( $soImages, $soContent, $thePics );
$allPics = count($thePics[0]);
if( $allPics > 0 ){
echo "<span id='thumb'>";
echo $thePics[0][0];
echo '</span>';
}
else {
echo "<span id='thumb'>";
echo "<img src='";
echo bloginfo('template_url');
echo "/images/thumb.gif'></span>";
}
}
這是一個(gè)顯示縮略圖的方法，自動(dòng)檢索文章的第一張圖片，如果沒(méi)有顯示當(dāng)前主題/images/thumb.gif 所以你要把這個(gè)thumb.gif圖片準(zhǔn)備好~
第二步：找到index.php文件即首頁(yè)文件，找到the_content();或相似的代碼在它之前添加如下代碼：
?
?
?
?
thumb_img($post->post_content);
這樣就調(diào)用了剛才的方法，實(shí)際上縮略圖已經(jīng)完成了！但是你看到的效果一定很意外，應(yīng)為圖片的大小沒(méi)有控制，會(huì)很難看…好了，第三步
第三步：添加縮略圖樣式CSS代碼：
這是浮云站使用的的縮略圖樣式，你可以先湊合著用，再另行修改
?
?
?
?
#thumb{margin:5px 15px 5px 5px;width:145px;height:120px;border:3px solid #eee;float:left;overflow:hidden;}
#thumb img{max-height:186px;max-width:186px}
上文中詳細(xì)介紹了WordPress實(shí)現(xiàn)首頁(yè)文章顯示縮略圖的方法，看完后是不是覺(jué)得很簡(jiǎn)單呢？三步就可以讓縮略圖就有模有樣的顯示出來(lái)啦！
版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請(qǐng)聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請(qǐng)與原作者聯(lián)系。
