纯代码实现WordPress图片自动添加alt和title属性
我们的博客网站中的每一篇文章或多或少都会有一些图片，而对于图片的alt和title属性，我想大部分博主站长应该都不会陌生。大家都知道图片的alt和title属性非常重要，但是在添加图片的时候总是不能坚持，或偶尔漏掉alt或title，或alt和title属性都漏掉，这个对于图片的优化应该是非常不利的。所以，今天就跟大家说一说如何让WordPress站点的图片自动添加上漏掉的alt和title属性。
在这里，跟大家普及一下图片的alt和title属性：
title属性：主要针对用户，当用户的鼠标放在图片上的时候，显示的文字就是title属性。
alt属性：主要针对搜索引擎，也针对用户，在图片加载失败的时候，会显示alt属性中的内容，另外，alt属性是搜索引擎爬虫识别我们的图片的唯一方式。
一个完整的优化过的图片应该同时具有title属性和alt属性，而且alt属性中最好带有文章的关键字。
回归正题，仔细分析我们站点图片的alt和title属性，不外乎以下四种情况：
- 没有alt和title属性；
- 有title属性但没有alt属性；
- 有alt属性但没有title属性；
- 同时拥有alt和title属性。
现在我们重点是要为前面三种情况的图片补齐alt和title属性，但是如果人工补齐的话，这个可是一个浩大的工程，很多人都会放弃的，包括我在内。
幸好，WordPress是强大的，而且网络上的资源也挺多的，经过本站修改测试，发现只需要将以下代码添加到我们所使用主题的functions.php文件最后一个?>即可实现自动为WordPress站点图片添加alt和title属性。
/*自动添加图片alt和title属性
**代码修改https://pdbn.top/
*/
function image_alttitle( $imgalttitle ){
global $post;
$category = get_the_category();
$flname=$category[0]->cat_name;
$btitle = get_bloginfo();
$imgtitle = $post->post_title;
$imgUrl = "<img\s[^>]*src=(\"??)([^\" >]*?)\\1[^>]*>";
if(preg_match_all("/$imgUrl/siU",$imgalttitle,$matches,PREG_SET_ORDER)){
if( !empty($matches) ){
for ($i=0; $i < count($matches); $i++){
$tag = $url = $matches[$i][0];
$j=$i+1;
$judge = '/alt=/';
$yyyyy = '/title=/';
preg_match($judge,$tag,$matchalt,PREG_OFFSET_CAPTURE);
preg_match($yyyyy,$tag,$matchtitle,PREG_OFFSET_CAPTURE);
if( count($matchtitle) < 1&&count($matchalt) >0 ){//有alt没有title的情况，只添加title
$altURL = 'title="'.$imgtitle.' '.$flname.' 第'.$j.'张-'.$btitle.'" ';
}
if( count($matchtitle) < 1&&count($matchalt) <1 ){//alt，title都没有，都添加
$altURL = ' alt="'.$imgtitle.' '.$flname.' 第'.$j.'张" title="'.$imgtitle.' '.$flname.' 第'.$j.'张-'.$btitle.'" ';
}
if( count($matchtitle) >0&&count($matchalt) <1 ){//有title没有alt，只添加alt
$altURL = ' alt="'.$imgtitle.' '.$flname.' 第'.$j.'张" ';
}
if( count($matchtitle) >0&&count($matchalt) >0 ){//title，alt都有，都不添加
$altURL = '';
}
$url = rtrim($url,'/>');
$url .= $altURL.'/>';
$imgalttitle = str_replace($tag,$url,$imgalttitle);
}
}
}
return $imgalttitle;
}
add_filter( 'the_content','image_alttitle');
以上代码默认的alt属性为“文章标题 分类名称 第几张”，title属性为“文章标题 分类名称 第几张-站点名称”。
以上代码已经成功在本博客运行，大家可以随意打开某篇含有图片的文章测试看看。
特别说明：
1、以上代码只针对没有alt或title属性的图片，如果该图片已经有alt或title属性，那么它们的值为空也是无效的。比如某张图片的alt=””，那么对这个alt属性也是失效的。
2、以上代码会智能判断，如果都没有alt和title属性，那么就会自动给该图片添加上alt和title属性；如果都没有alt属性，那么就会自动给该图片添加上alt属性；如果都没有title属性，那么就会自动给该图片添加上title属性。大家慢慢体会吧。