假设您想使用WordPress的特色图片功能,但是有一个完整的文章存档需要花费太多时间来浏览。对于新文章,您可以指定并按预期使用该功能。对于旧文章,您只需使用在内容中找到的第一张图片作为缩略图,或者如果不存在则使用默认图片。
将此添加到functions.php中或创建一个功能插件
function catch_that_image() {
global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+?src=[\'"]([^\'"]+)[\'"].*?>/i', $post->post_content, $matches);
$first_img = $matches[1][0];
if(empty($first_img)) {
$first_img = "/path/to/default.png";
}
return $first_img;
}
要使用它,请在循环中使用此代码
if ( get_the_post_thumbnail($post_id) != '' ) {
echo '<a href="'; the_permalink(); echo '" class="thumbnail-wrapper">';
the_post_thumbnail();
echo '</a>';
} else {
echo '<a href="'; the_permalink(); echo '" class="thumbnail-wrapper">';
echo '<img src="';
echo catch_that_image();
echo '" alt="" />';
echo '</a>';
}
我发现has_post_thumbnail不如上面的逻辑可靠。
谢谢你的分享。一直在寻找为WP添加功能的方法。
最好的祝愿,
Reece
很棒的功能,我正在尝试向其中添加YouTube功能,但有点卡住了。
我希望它在看到图片之前,如果看到YouTube嵌入代码,则获取YouTube缩略图。有什么想法吗?
我不熟悉如何在WordPress中使事情正常工作——但是我在我最近重写的日志(手工编码——不是WordPress)中包含了类似的功能。它基于我在我的日志中使用HTML5兼容性的iFrame视频嵌入——因此不适用于object和embed代码。希望您能使用它并像上面使用第一张图片一样将其应用到您的WordPress应用程序中。
此视频检查代码是在我检查文章内容中是否存在图片(当我在循环中遍历时)之后出现的。如果它找到一个iframe,它将使用preg_match提取iframe的“src”,如果与'www.youtube.com'匹配,我可以根据从src url中提取的视频ID创建url。
这是一个包含几个带有YouTube视频的文章的页面——我在其中获取了YouTube图片并显示它们——http://robertwatcher.com/journal/index.php?crnt=9
我已经省略了检查下一个Vimeo视频url(需要更复杂的代码来提取)的额外if语句,以及如果不存在src url的默认图片。
我在一个类似小型画廊的页面中使用了这个功能,但由于以下原因而受到限制
设置 >> 阅读 >> 博客页面最多显示
有没有办法绕过此限制,无论设置中的限制是什么,都能获取所有图片?
我已经使用了一段时间functions.php版本的代码,但最近才发现这似乎对页面不起作用。有没有可能有一种方法也可以将其应用于页面?
您好,我想请问一下,如果我想获取第二张图片而不是第一张图片,应该怎么做?非常感谢您的帮助。
只需更改此行
$matches[1][0];
为
$matches[1][1];
这是一段很棒的代码,感谢分享。
不过我有一个问题——如果您是从附件页面(attachment.php)执行此操作,您将在函数中更改什么以使其正确输出?
谢谢。
保罗。
如何更改图片大小?
您应该使用一些CSS
.thumbnail-wrapper img {width:300px;}
如果您希望它随着页面大小调整,请使用类似以下的内容
.thumbnail-wrapper img {width:60%;}
有人知道如何从以下内容中获取firstbigimage_big.jpg的第一次出现吗?
Imgur
谢谢
谢谢。帮我度过了这一天。
很棒的教程。我也想知道如何利用此代码提供动态大小的图片。似乎人们正在为此使用timthumb,我很好奇是否可以使用核心WP函数来实现。
上面提到可以使用CSS,但如果您需要调整图片大小超过几个像素,这不是一个好方法。目标是以与get_the_post_thumbnail($post->ID, array(80,80));类似的方式提供新尺寸的图片。谢谢!
我也想知道如何整合内置的WP缩略图尺寸。现在上面的代码以其原始尺寸提取图片,但我想使用我在functions.php中指定的尺寸来裁剪缩略图。
有什么想法吗?
Dave,
您需要使用URL查找附件ID,然后使用它获取所需的图片尺寸
http://frankiejarrett.com/get-an-attachment-id-by-url-in-wordpress/
您是否找到了如何执行此操作的方法?我正在努力解决这个问题。
这是我用来调整第一张图片大小的代码
GitHubGist — get-first-image.php
非常感谢!我不知道为什么这么久了,在涉及WordPress时,我总是没有首先查看你的页面。
我想知道如何在子主题中使用此逻辑。到目前为止,我已经修改了子主题的content.php以在循环中启用摘要,但我真的希望摘要也能显示文章中的第一张图片。还没有开始制作插件,所以我希望可能有一种方法,要么通过修改子主题的content.php和/或其functions.php(祈祷);)
天啊,我做到了!非常感谢这段代码!!!
这段代码是金子!它可以获取图片,无论它是特色图片还是其他图片。太棒了!谢谢!!!
这是一个很棒的代码片段,感谢发布。
只是好奇是否有人成功地修改了该函数,以便在找不到图片时不返回任何IMG标签,而是返回占位符?我一直在尝试,但没有成功,我的PHP很生疏,令人悲伤。
从函数中删除这两行
if(empty($first_img)) {
$first_img = “/path/to/default.png”;
}
然后…
<?php
if ( $image = catch_that_image() )
echo '’;
?>
太好了!为了显示附加到文章的最新图片,代码应该是什么?最好的祝愿,flo
出于某种原因,这总是获取文章中的最后一张图片,而不是第一张。在一些每篇文章大约有2张图片的文章中按原样使用。
要获取第一个图像而不是最后一个图像,请将正则表达式中的 /i 替换为 /U
@Barry – 这很奇怪 - 它正在为我获取第一个图像(即,在帖子中出现的第一个图像 - 最靠近顶部的那个)。
我将代码插入子主题中一个重复的 content.php 中,紧接在
… 自己的 div 中。
似乎对我有用。
只有一个问题 - 它返回循环中列表的第一个图像,但类别列表除外
抱歉 - 我的意思是,对于类别列表中第一个图像是特色图像的情况,它不适用(我知道我可以获取第一个非特色图像,但我想知道是否可以对其进行调整以获取类别列表的第一个特色图像?)
啊 - 我解决了 - 只需添加
|| is_category()
… 到条件中。
真是笨!
有没有办法只显示第一个帖子的图片?
在启用漂亮永久链接的类别列表中查看时,默认图像路径存在问题 - 您会得到一个损坏的图像链接,因为类似“images/default.jpg”的内容会附加到永久链接的末尾(例如,“example.com/category/images/default.jpg”)。]
正在尝试考虑一种在那种情况下涵盖所有情况的路径。
在 images 之前添加一个 /。这样,您就可以从根目录执行直接路径。
我尝试了代码;它确实返回了图像……
附言 我使用 Windows Live Writer 2012 撰写我的帖子,并在 Live Writer 中嵌入 Facebook 照片链接)
但我无法获得缩略图大小的返回图像……此外,图像出现在索引和单个帖子中的帖子顶部。
这使得有两个图像(一个缩略图和一个在帖子内的重复图像)..
。我想在单个帖子中删除缩略图,而只在索引页面上显示带有左浮动的缩略图。
我该怎么做?
我正在使用我自己的 Twenty Twelve 子主题……
非常感谢……
谢谢!效果很好 :)
这就是我如何在没有正则表达式的情况下处理它的方法。我只是将其放在模板中(在档案页面的循环中),但将其提取到一个函数中然后在模板中调用它并不难。
我实际上访问了此页面,因为我正在做与您类似的事情。
我真的很喜欢那种方式,但是 get_children 仅在所述图像**仅**用于当前帖子时才有效。或者至少它是第一次使用的地方。
这是因为在当前的 WP 版本中,post_parent 必须是唯一的(附件不能有多个父级)。
但是,可以通过使用插件修改数据库中每个新帖子的附件条目来获得此问题的解决方案(请参阅此处)。
您是否使用其中任何一种解决方案?
大家好,
我正在使用 Foundation 主题,并按照上述步骤操作。它在本地主机上有效(链接到正确的本地主机路径中的图像)。问题出现在活动站点上,图像路径是来自本地主机的
https://127.0.0.1/MySite/wp-content/uploads/2013/06/corrupt.jpg
所以基本上它坏了。如何将本地主机 URL 转换为更动态的 URL?
完美工作!:) 非常感谢
我目前完全放弃了 the_post_thumbnail(); 函数,并转向使用 first_img 代替,以避免重复我的工作,制作缩略图和帖子内图像..
我使用此函数有一段时间了,现在注意到我的错误日志中出现了一个 php 通知,PHP Notice: Undefined offset: 0。对于此行:
$first_img = $matches [1] [0];
此帖子:http://stackoverflow.com/questions/9399509/getting-rid-of-php-notice-undefined-offset 告诉我需要先使用 isset() 检查是否有内容。其他人遇到过这种情况吗?我只有现在才注意到这个通知,想知道是什么可能发生了变化。我有一个问题,默认图像没有显示 & 它显示给我错误
Notice: Undefined offset: 0 in /vagrant/wp-content/themes/advocacy/functions.php on line 51 http://127.0.0.1:8080/wp-content/themes/advocacy/assert/img/ipa.no.list.img.jpg”
第 51 行:$first_img = $matches[1][0];
有人可以帮我吗?
我找到了一个对我有用的解决方案
替换
$output = preg_match_all(‘/<img.+src=\'”[\'”].*>/i’, $post->post_content, $matches);
$first_img = $matches[1][0];
与
if( $output = preg_match_all(‘/<img.+src=\'”[\'”].*>/i’, $post->post_content, $matches) )
{
$first_img = $matches[1][0];
}
我正在尝试这个.. 但没有获取图像。我只能获取链接… 有人可以帮我解决这个问题吗
此代码看起来非常类似于StackOverflow 上提供的答案。
你好,
我不是程序员,但我认为我在寻找正确的东西时偶然发现了你的帖子,并希望你能帮我将你的代码集成到我主题中的以下代码中?
提前感谢 :)
有没有办法绕过特色图像并获取内容中第一个列出的图像?我正在使用 Twentythirteen 的子主题,由于某种原因,它在将图像缩小到缩略图大小时不会裁剪图像。它只是将其挤压到 100×100。因此,我被迫为我的特色图像使用 100×100 的图像(因为我需要在我的主页上显示缩略图。我想在我的显示帖子的页面上显示全尺寸图像。
非常感谢。它有效。非常有帮助。
您好,先生,请告诉我如何使用代码的第二部分,我的意思是如何在循环中添加该代码,先生,我是一个新手,所以请帮助我,谢谢
这太棒了!没有设置缩略图时的绝佳后备方案。谢谢!
你好。
感谢您的代码。我已使用它来显示 4-5 个随机帖子及其第一个图像。
代码运行良好,但我想动态调整图像大小。使用 CSS 不是一种选择,因为我网站上的图像非常大,因此在每个帖子下方加载 4-5 个全尺寸图像会使网站变慢。
那么,有没有动态调整图像大小的方法?
提前感谢您的帮助 :)
在自定义帖子类型中不起作用。任何人都可以为此提供解决方案吗
大家好,
我想知道,要使其检索的不仅仅是第一个,还需要什么。也许是前 4 张图片……?
我认为必须修改数组,但我不太理解它……
谢谢
首先,感谢您提供此代码!其次,我遇到了与其他一些人相同的未定义偏移量问题。所以,我所做的是保留输出行,但将后续内容更改为
在函数中,然后在我的模板中我放置了这个
我需要添加一些样式,但我还在学习,所以我现在更关心功能而不是样式部分。它还解决了在没有内容显示时显示默认图像的问题,这让我很困扰。
好吧,糟糕,今天看来不适合我。我以为我粘贴了自己的代码,但显然我粘贴了原始代码。
这实际上是我在函数中所做的
if (!empty($matches[1][0]) ) {
$first_img = $matches[1][0];
} else {
$first_img = “”;
}
return $first_img;
对于任何困惑,我表示歉意。
$posts 变量和输出缓冲区的目的是什么?我尝试过不使用两者,它也能正常工作。这里它与 img 标签和 alt 属性捆绑在一起
* 返回帖子内容中第一个图像的 HTML img 标签。用于绘制
* “image” 格式帖子的内容。
*
* @return string 帖子内容中第一个图像的 HTML img 标签。
*/
function icicle_get_first_image() {
}
您好,代码运行完美,但是,我想知道如何自动生成较小的图像尺寸,因为它正在加载原始图像。
我尝试过这样做
add_image_size (‘thumb-medium’, 160, 140, true, array (‘center’, ‘top’));
但没有成功!
您好,我想显示帖子前 300 个字符的摘要,我该怎么做?
通过使用摘要函数
https://codex.wordpress.org/Function_Reference/the_excerpt
谢谢这个。对我有用。
我尝试了这个,它起作用了,但我遇到了一个问题,即有时第一个图像变成了笑脸,因为它也以标签开头。有没有办法排除笑脸被选为第一个图像?
尝试阅读有关 preg_match 和正则表达式的知识,但由于我不是程序员,因此超出了我的理解范围。
非常有用,并且运行完美
非常感谢本教程和关于 Functionality 插件的教程!我在您的教程的帮助下创建了我的第一个插件,并且非常高兴 :)
您和您的网站是最好的!
这是一个很棒的技巧。一个快速的问题,如何使用 catch_that_image() 获取非特色图像的缩略图?
你好,
如何使所有缩略图都左对齐?
谢谢
首先,感谢您提供关于该函数的提示!但是,像上面某人一样,我得到了“未定义的偏移量”。经过几个小时的反复试验,我偶然发现了这段代码
这完美地工作了!代码来自:http://www.devnetwork.net/viewtopic.php?f=1&t=136123现在,进入下一个任务。使此仅显示捕获图像的缩略图。天哪,我真的需要学习 php!;)
几乎一天后,经过多次反复试验以及许多论坛帖子的帮助,我得出了以下结论
它将找到第一个图像,然后找到相应的缩略图,并将宽度、高度、alt 和标题添加到输出中。您还可以添加标题。取消注释“//$caption_text”行并在图像字符串中添加标题。
要使用它
希望这能为其他人节省一些时间!
谢谢这个。
非常感谢,在处理已经存在且没有特色图像的内容时非常有用!
非常感谢。很棒的帖子。帮助我很多。
我遇到此代码输出帖子中的最后一个图像而不是第一个图像的问题。不确定为什么。但是用这个替换“preg_match_all”行解决了它。
if(preg_match_all('/< *img[^>]*src *= *["\']?([^"\']*)/', $post->post_content, $matches)){
不错的代码!谢谢。
还要感谢 Richard 提供了提供大小调整后的缩略图的版本。
不起作用
感谢这个函数。
如何使用它来渲染自定义图像大小?
很棒的功能插件:D
我强烈建议将
$post->post_content
包裹在do_shortcode()
中,以便您还可以从图库或将图像放入内容的其他短代码中获取图像。这样做,输出行如下所示
太棒了!谢谢
这正是我要找的,而且效果很好!谢谢!
运行完美!!!!
如果我想使用帖子缩略图,因为我的文章总是带有帖子缩略图。那么如果我想使用帖子缩略图而不是第一个图像怎么办。
has_post_thumbnail 函数没有给我想要的结果。
嘿!
has_post_thumbnail()
检查帖子缩略图,非常适合编写需要它的条件。the_post_thumbnail()
应该为您返回图像:https://developer.wordpress.org/reference/functions/the_post_thumbnail/嘿,Graham,感谢你的回复。has_post_thumbnail() 可以工作,但不会强制图像具有相同的高度和宽度,因为图像不相同,所以我使用了 catch_that_image 函数,并在我的摘录中添加了以下代码
<img src='’width=’50’height=’50’ alt=”/>
<a href="”>
它运行良好,但使用的是第一个图像而不是帖子缩略图。那么,有没有办法我可以使用此代码并向其中添加 has_post_thumbnail 函数?
我尝试过这种方式
<img src='’width=’50’height=’50’ alt=”/>
<a href="”>
但它不起作用。请提供建议。
在不知道所有上下文的情况下,
has_post_thumbnail
非常适合检查,但您可能需要使用带有调用您正在查找的确切缩略图大小的参数的the_post_thumbnail()
- 并且您可能需要在函数中创建该自定义缩略图大小。例如echo the_post_thumbnail( 'my-custom-size' )
非常感谢。终于解决了
请我真的很需要这方面的帮助。
这是我的函数代码
function catch_that_image() {
global $post, $posts;
$first_img = ”;
ob_start();
ob_end_clean();
$output = preg_match_all(‘/<img.+src=\'”[\'”].*>/i’, $post->post_content, $matches);
$first_img = $matches [1] [0];
if(empty($first_img)){
$first_img = “../img/bg.png”;
}
return $first_img;
}
这是我的循环
if (FILE == $_SERVER[‘SCRIPT_FILENAME’]) { die(); }
if (CFCT_DEBUG) { cfct_banner(FILE); }
if (have_posts()) {
echo ‘
<
ul class=”disclosure table group”>’;
while (have_posts()) {
the_post();
?>
我试图做的是获取帖子缩略图作为显示在主页上的特色图像。
has_post_thumbnail 仅从帖子中选择第一个图像,而某些帖子仅包含特色图像
请我需要这方面的帮助
我知道这很古老,但它仍然出现在 Google 中。
我们可以修复正则表达式使其不那么贪婪,否则它会获取比应有的更多内容,并可能获取错误的图像。
只需要添加几个问号
谢谢
我以为
{Pattern}+?
或{Pattern}*?
会与{Pattern}
匹配相同的内容,所以.+?
或.*?
等价于.
。这将无法匹配像这样的<img>
元素:–
<img <!-- 注意此处有 4 个空格 -->src="/image.png">
–
<img
<!-- 注意此处有一个换行符(在本例中为 <cr><lf>)和 7 个空格 -->src="/image2.png">
此外,如果没有
g
标志,正则表达式将只匹配第一个标记(在本例中为第一个图像)。正确的正则表达式(在 PHP 中)应该是
/<img[\s\S]+src=[\'"]([^\'"]+)[\'"][\s\S]*/i
g糟糕!应该是
'/<img[\s\S]+src=[\'"]([^\'"]+)[\'"][\s\S]*\/?>/i'
(缺少引号和元素末尾的\/?>
)这段代码片段在 HTML5 网站上有效吗?例如:博客网站。
感谢这段代码片段 - 我确实遇到过回退默认图像出现“未定义偏移量”错误的问题。我在 functions.php 中做出的更改
而不是
$first_img = $matches[1][0];
我使用了
$first_img = isset( $matches[1][0] ) ? $matches[1][0] : null;
这解决了问题(虽然我非常新手,这可能是不正确的)。希望这能为某些人在 Stack Overflow 上节省几个小时!