您现在的位置是:首页 > cms教程 > WordPress教程WordPress教程
Wordpress调用文章第一张图片的实现方法
含蕾2025-03-26WordPress教程已有人查阅
导读之前设计WordPress主题的时候调用图片一般都是用文章内附件图片,但是有些博主为了节约博客主机空间,大部分采用外联图片,这样就无法同过这种方式调用了,所以只能用下面的这种方
之前设计WordPress主题的时候调用图片一般都是用文章内附件图片,但是有些博主为了节约博客主机空间,大部分采用外联图片,这样就无法同过这种方式调用了,所以只能用下面的这种方式来调用文章的第一张图片,WordPress调用文章第一张图片代码如下:
1 在WordPress主题的功能函数function.php文件内添加以下代码,这些 代码主要是查找文章内有没有图片并调用第一张图片地址,其工作原理是查找文章内有没<img />这个标签,如果有就调出第一张图片,如果没有就用张设计好的图片代替,这个方式用来作为文章缩略图非常有用,具体代码如下,拷贝到 function.php <?php … ?>之间即可.
全文如下:
1 在WordPress主题的功能函数function.php文件内添加以下代码,这些 代码主要是查找文章内有没有图片并调用第一张图片地址,其工作原理是查找文章内有没<img />这个标签,如果有就调出第一张图片,如果没有就用张设计好的图片代替,这个方式用来作为文章缩略图非常有用,具体代码如下,拷贝到 function.php <?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)){ //Defines a default image
$first_img = "/images/default.jpg";
}
return $first_img;
}
Wordpress 主题模板调用 catch_that_image()函数,方法很简单,在需要的地方插入
<img src="<?php echo catch_that_image() ?>" alt="<?php printf( esc_attr__( 'Permalink to %s', 'catchbox' ), the_title_attribute( 'echo=0' ) ); ?>.ebingou.cn 代码号" />
即可,例如我是在首页插入,我修改了Content.php全文如下:
<?php
/**
* The default template for displaying content
*
* @package Catch Themes
* @subpackage Catch_Box
* @since Catch Box 1.0
*/
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<header class="entry-header">
<?php if ( is_sticky() ) : ?>
<hgroup>
<h2 class="entry-title"><a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'catchbox' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
<h3 class="entry-format"><?php _e( 'Featured', 'catchbox' ); ?></h3>
</hgroup>
<?php else : ?>
<h1 class="entry-title"><a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'catchbox' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h1>
<?php endif; ?>
<?php if ( 'post' == get_post_type() ) : ?>
<div class="entry-meta">
<?php catchbox_posted_on(); ?>
<?php if ( comments_open() && ! post_password_required() ) : ?>
<span class="sep"> - </span>
<span class="comments-link">
<?php comments_popup_link(__('No Comments ↓', 'catchbox'), __('1 Comment ↓', 'catchbox'), __('% Comments ↓', 'catchbox')); ?>
</span>
<?php endif; ?>
</div><!-- .entry-meta -->
<?php endif; ?>
</header><!-- .entry-header -->
<?php
$options = catchbox_get_theme_options();
$current_content_layout = $options['content_layout'];
?>
<?php if ( is_search() ) : // Only display Excerpts for Search ?>
<div class="entry-summary">
<?php the_excerpt(); ?>
</div><!-- .entry-summary -->
<?php elseif ($current_content_layout=='excerpt' ) : // Only display Featured Image and Excerpts if checked in Theme Option ?>
<div class="entry-summary">
<?php if( has_post_thumbnail() ):?>
<a href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'catchbox' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
<?php the_post_thumbnail('featured-slider'); ?>
</a>
<?php endif; ?>
<img src="<?php echo catch_that_image() ?>" alt="<?php printf( esc_attr__( 'Permalink to %s', 'catchbox' ), the_title_attribute( 'echo=0' ) ); ?>.ebingou.cn 代码号" /> <?php the_excerpt(); ?>
</div><!-- .entry-summary -->
<?php else : ?>
<div class="entry-content">
<?php the_content( __( 'Continue reading <span class="meta-nav">→</span>', 'catchbox' ) ); ?>
<?php wp_link_pages( array(
'before' => '<div class="page-link"><span class="pages">' . __( 'Pages:', 'catchbox' ) . '</span>',
'after' => '</div>',
'link_before' => '<span>',
'link_after' => '</span>',
) );
?>
</div><!-- .entry-content -->
<?php endif; ?>
<footer class="entry-meta">
<?php $show_sep = false; ?>
<?php if ( 'post' == get_post_type() ) : // Hide category and tag text for pages on Search ?>
<?php
/* translators: used between list items, there is a space after the comma */
$categories_list = get_the_category_list( __( ', ', 'catchbox' ) );
if ( $categories_list ):
?>
<span class="cat-links">
<?php printf( __( '<span class="%1$s">Posted in</span> %2$s', 'catchbox' ), 'entry-utility-prep entry-utility-prep-cat-links', $categories_list );
$show_sep = true; ?>
</span>
<?php endif; // End if categories ?>
<?php
/* translators: used between list items, there is a space after the comma */
$tags_list = get_the_tag_list( '', __( ', ', 'catchbox' ) );
if ( $tags_list ):
if ( $show_sep ) : ?>
<span class="sep"> | </span>
<?php endif; // End if $show_sep ?>
<span class="tag-links">
<?php printf( __( '<span class="%1$s">Tagged</span> %2$s', 'catchbox' ), 'entry-utility-prep entry-utility-prep-tag-links', $tags_list );
$show_sep = true; ?>
</span>
<?php endif; // End if $tags_list ?>
<?php endif; // End if 'post' == get_post_type() ?>
<?php if ( comments_open() ) : ?>
<?php if ( $show_sep ) : ?>
<span class="sep"> | </span>
<?php endif; // End if $show_sep ?>
<span class="comments-link"><?php comments_popup_link( '<span class="leave-reply">' . __( 'Leave a reply', 'catchbox' ) . '</span>', __( '<b>1</b> Reply', 'catchbox' ), __( '<b>%</b> Replies', 'catchbox' ) ); ?></span>
<?php endif; // End if comments_open() ?>
<?php edit_post_link( __( 'Edit', 'catchbox' ), '<span class="edit-link">', '</span>' ); ?>
</footer><!-- #entry-meta -->
</article><!-- #post-<?php the_ID(); ?> -->
想要更好的显示效果就需要修改css样式来美化你的WordPress主题模板了。
本文标签:
很赞哦! ()
相关教程
图文教程
wordpress怎么上传外观主题
1、首先登陆WordPress后台,登陆后看到左侧的导航有个外观,点击一下,进入主题的管理界面后,点击“添加”来添加上传主题,
wordPress快速建站的方法步骤
这篇文章将介绍如何使用WordPress建立一个博客、网站和论坛。WordPress是基于PHP的博客架设工具。它提供了一套开源的PHP代码以方便用户在支持PHP的主机上快速的建立博客。W
wordpress官网改成中文简体的方法
其实我们在从WordPress官网网站下载的程序安装的时候,向导会自动切换让我们选择安装语言,但是有些时候确实还不会提示出来选择语言
wordpress文章保存位置在哪
wordpress中的文章是存放在mysql数据库中的post表的。登录后可见,需要wordpress主题支持该功能,目前支持登录后可见的主题有Duxmeng
相关源码
-
(自适应响应式)家电维修清晰服务网站pbootcms模板免费下载本模板基于PbootCMS内核开发,为维修服务类企业打造,特别适合家电维修、设备维护等行业使用。通过简洁直观的界面设计,帮助企业快速搭建专业级服务平台,实现线上业务高效管理。查看源码 -
(自适应响应式)高端珠宝首饰奢侈品pbootcms模板下载本模板为珠宝首饰及奢侈品行业打造,采用PbootCMS内核开发,具备卓越的视觉表现力与商业转化能力。自适应设计确保在手机端呈现产品细节,后台数据实时同步,助您高效展示钻石查看源码 -
(PC+WAP)绿色硅胶橡胶玩具制品营销型网站源码下载为硅胶橡胶制品及玩具行业打造的营销型网站模板,采用PbootCMS内核开发,通过模块化设计实现产品参数、安全认证、应用场景等专业内容的可视化呈现,助力企业建立可信赖的线上展示平台。查看源码 -
(自适应)绿色农业机械设备农场网站源码下载为现代农业机械领域打造的响应式网站模板,采用PbootCMS内核开发,数据实时同步后台管理。通过简洁大气的视觉设计,有效展示农机产品技术参数与应用场景,帮助客户快速建立专业数字化形象。查看源码 -
(自适应)蓝色环保科技设备带三级栏目网站模板下载该模板为环保科技企业设计,提供专业的产品展示与技术服务平台。采用响应式布局,适配环保设备、清洁技术等应用场景,通过可视化后台可快速搭建符合行业特性的展示网站。查看源码 -
(自适应响应式)AI智能电子科技产品pbootcms网站模板下载基于PbootCMS内核的响应式模板,为AI智能硬件、电子产品等科技企业打造,通过技术创新实现品牌数字化升级。查看源码
| 分享笔记 (共有 篇笔记) |

