在使用的过程中,我们经常需要显示文章的缩略图。WordPress 缩略图的实现主要靠两种方式,第一种是来作为缩略图的图源,第二种是读取文章特色图标来作为缩略图的图源。今天我们将这两种方式结合起来实现 wordpress 缩略图。
实现原理如下:
一、判断文章是否已经设置特色图片,如果设置了,则获取特色图片来作为文章缩略图的图源。
二、判断文章中是否存在图片(正则表达式),如果存在图片,则获取文章中第一张图片来来作为文章缩略图的图源。
三、如果文章中既没有设置特色图片,也不存在图片,则显示一张默认的图片。
实现方法如下:
1. 切换到主题目录,打开functions.PHP文件,加入以下代码:
Crayon-5c891d2adc09e867661676" class="Crayon-Syntax Crayon-theme-classic Crayon-font-monaco Crayon-os-pc print-yes notranslate" data-settings=" minimize scroll-mouSEOver" style=" margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
Crayon-toolbar" data-settings=" mouSEOver overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">Crayon-title">
Crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">Crayon-mixed-highlight" title="Contains Mixed Languages">
Crayon-button Crayon-nums-button" title="Toggle Line Numbers">
Crayon-button-icon">
Crayon-button Crayon-plain-button" title="Toggle Plain Code">
Crayon-button-icon">
Crayon-button Crayon-wrap-button" title="Toggle Line Wrap">
Crayon-button-icon">
Crayon-button Crayon-expand-button" title="Expand Code">
Crayon-button-icon">
Crayon-button Crayon-copy-button" title="Copy">
Crayon-button-icon">
Crayon-button Crayon-popup-button" title="Open Code In New Window">
Crayon-language">PHPCrayon-button-icon">
Crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;">
Crayon-plain-wrap">
Crayon-main" style="">Crayon-table">
Crayon-nums " data-settings="show"> Crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;"> Crayon-num" data-line="Crayon-5c891d2adc09e867661676-1">1 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-3">3 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-5">5 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-7">7 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-9">9 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-11">11 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-13">13 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-15">15 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-17">17 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-19">19 Crayon-num" data-line="Crayon-5c891d2adc09e867661676-21">21 | Crayon-code">
Crayon-nums " data-settings="show"> Crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;"> Crayon-num" data-line="Crayon-5c891d2adc0a9150737020-1">1 | Crayon-code">