WordPress获取所有特色图像

日期: 标签:WordPress教程
如需帮忙改代码,或者WordPress二次开发、PHP网站建设等需求,可联系我购买付费服务:  点此联系我

当我们要在WordPress中做一个类似下图的这种的幻灯片展示功能的时候,首先得获取到最近的几张特色图像(也可以称为缩略图)和它所在的文章标题。本文将教你如何从WordPress的数据库中读取到你想要的数据。

幻灯片

WordPress的特色图像数据主要保存在自定义栏目 _thumbnail_id 中,这个_thumbnail_id与一篇文章的id对应,构成一个映射关系,通过这个映射可以获取到这个特色图像的地址和文章标题等信息。下面的php代码用于输出最近5篇特色图像的HTML代码,通过这些HTML,你可以在此基础上添加JS、CSS代码以达到幻灯片的效果。

以下代码可能并不能适用于你的项目,但是可以作为参考,通过一些修改,就可以达到你的目的啦。

<ul>
<?php
	$arr = array('meta_key' => '_thumbnail_id',
                'showposts' => 5,        // 显示5个特色图像
                'posts_per_page' => 5,   // 显示5个特色图像
                'orderby' => 'date',     // 按发布时间先后顺序获取特色图像,可选:'title'、'rand'、'comment_count'等
                'ignore_sticky_posts' => 1,
                'order' => 'DESC');

	$slideshow = new WP_Query($arr);
	if ($slideshow->have_posts()) {
		$postCount = 0;
		while ($slideshow->have_posts()) {
			$slideshow->the_post();
?>
	<li>
		<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
		<?php
			// 获取特色图像的地址
			$timthumb_src = wp_get_attachment_image_src( get_post_thumbnail_id(get_the_ID()) );
			echo '<img border="0" alt="' . get_the_title() . '" src="' . $timthumb_src[0] . '" /> ';
		?>
		</a>
	</li>
<?php
		} // endwhile
		wp_reset_postdata();
	} // endif
?>
</ul>

以上php代码输出的html代码类似:

<ul>
  <li>
    <a href="http://example.com/a" title="aaa">
      <img border="0" alt="aaa" src="http://example.com/mala.jpg" /> ';
    </a>
  </li>
  <li>
    <a href="http://example.com/c" title="ccc">
      <img border="0" alt="ccc" src="http://example.com/ditie.jpg" /> ';
    </a>
  </li>
...
</ul>

-- 完 --

本文采用 「CC BY-NC-SA 4.0」创作共享协议,转载请标注以下信息:
原文出处:露兜即刻 https://www.ludou.org/wordpress-get-all-posts-thumbnail.html
露兜
kaapass@outlook.com  QQ 825533758

业余编程爱好者。

49 条留言

点此留言
1 2 497
  1. Aaron Aaron

    恩,已经成功解决了设置特色图片,首页图片轮番播放的问题。

    但是,经测试不支持page页面特色图片的调用!

  2. 露兜

    @Aaron 看你是否开启了页面的特色图像功能,如果已经开启,可以将
    'ignore_sticky_posts' => 1,
    改成
    'ignore_sticky_posts' => 1,'post_type' => array( 'post', 'page' ),

  3. Aaron Aaron

    @露兜 感谢露兜大大的代码, 我这边已经搞定了 page页面特色图片的显示!

  4. 露兜

    @Aaron 印象中,貌似页面没有缩略图功能

  5. Aaron Aaron

    有的,露兜大大的印象不太准确。

1 2

发表留言