wordpress当文章没有添加Featured media的时候,

就调用文章第一张图片,

调用的wordpress代码函数为:

<?php echo catch_that_image(); ?>

网站使用的themes是Notio,配套插件为Gantry 5 Fraamework,
然而Notio使用的是twig模版引擎,前台文件都是以.twig结尾,
Notio的分类首页使用的文件为主题根目录下的index.php,
而分类下的各个页面使用的是archive.php文件,两者都调用了模版views/partials/content.html.twig

index.php先将所有的数据存放在$context中,之后传递给模版文件使用,
而我发现$context中并没有文章第一张图片这个属性,但是有post_id, content等等的属性,
所以可以自己加上去,通过正则匹配读取post content ,提取出第一个img 的url,作为网站的第一张图片。
同理把如下代码加到archive.php中,

// add from Ryan 2018/05/09 catch posts the first image
function catch_the_image( $post_content ) {
// global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post_content, $matches);
$first_img = $matches [] []; return $first_img;
} for ($i = ; $i < count($context['posts']); $i++) {
$context['posts'][$i]->the_posts_first_image = catch_the_image($context['posts'][$i]->post_content);
} Timber::render($templates, $context);

接着就是在显示到前台页面了,由于在index.html.twig有对posts的数据进行循环,
而我们的数据就存放在posts中,因此可以直接绑定。

{# Begin Featured Image #}
{% if gantry.config.get('content.' ~ scope ~ '.featured-image.enabled', '') and post.thumbnail.src %}
{% set position = (gantry.config.get('content.' ~ scope ~ '.featured-image.position', 'none') == 'none') ? '' : 'float-' ~ gantry.config.get('content.' ~ scope ~ '.featured-image.position', 'none') %}
<a href="{{ post.link }}" class="post-thumbnail" aria-hidden="true">
<img src="{{ post.thumbnail.src|resize(gantry.config.get('content.' ~ scope ~ '.featured-image.width', '1150'), gantry.config.get('content.' ~ scope ~ '.featured-image.height', '285')) }}" class="featured-image tease-featured-image {{ position }}" alt="{{ post.title }}" />
</a>
{% else %}
<a href="{{ post.link }}" class="post-thumbnail" aria-hidden="true">
<img src="{{post.the_posts_first_image}}" class="featured-image tease-featured-image {{ position }}" alt="test" />
</a> {% endif %}
{# End Featured Image #}

twig判断变量是否为空:

{% if var is null %}
{# do something #}
{% endif %} }如果这个变量为:array(0) { }一个空数组,那么下面的判断很有效
{% if var|length > 0 %}
{# do something #}
{% endif %}

  

PHP模版引擎twig wordpress中调用文章第一张图片的更多相关文章

  1. 织梦CMS调用文章第一张图片(非缩略图)终极方法

    之前,网上流传了很多在织梦CMS中调用第一张图片的方法,但大体都一样.即删除缩略图字符串,并添加后缀.然而这种方法仅限于jpg图片或其他单独图片类的调用.如果一个站有png.JPG.gif等多种格式. ...

  2. PHP模版引擎 – Twig

    在网站开发过程中模版引擎是必不可少的,PHP中用的最多的当属Smarty了.目前公司系统也是用的Smarty,如果要新增一个页面只需把网站的头.尾和左侧公共部分通过Smarty的include方式引入 ...

  3. 将wordpress中的文章导出为markdown

    一.进入wordpress后台,选择工具-导出数据,选择你需要导出的内容.文章等,会下载一个xml文件到本地电脑 二.使用一个名为wordpress-to-markdown的工具 源码地址:wordp ...

  4. wordpress 首页调用文章 不同样式的方法

    <?php $count = 1; $display_categories = array(1); foreach ($display_categories as $category) { ?& ...

  5. dede调取文章内容的第一张图片

    dede调用文章第一张图片(非缩略图)的实现方法 这篇文章主要是介绍dede调用文章第一张图片的实现代码,需要的朋友可以参考下 需要进行两个操作 第一步,修改include/extend.func.p ...

  6. PHP获取网站中各文章的第一张图片的代码示例

    调取文章中的第一张图作为列表页缩略图是很流行的做法,WordPress中一般主题默认也是如此,那我们接下来就一起来看看PHP获取网站中各文章的第一张图片的代码示例 ? 1 2 3 4 5 6 7 8 ...

  7. PHP获取网站中文章的第一张图片作为缩略图的方法

    调取文章中的第一张图作为列表页缩略图是很流行的做法,WordPress中一般主题默认也是如此,那我们接下来就一起来看看PHP获取网站中各文章的第一张图片的代码示例 $temp=mt_rand(1,4) ...

  8. Underscore模版引擎的使用-template方法

    之前项目里有遇到在DOM中增加大量的html结构的时候,傻乎乎的在js中写一堆模版,然后用replace一个一个做替换.当时就是难看了点,不觉得啥,现在了解了模版引擎之后回头来看真的比较捉急了,以后是 ...

  9. 【dedecms】DEDE列表页调用文章内容第一张图片(非缩略图)方法

    打开 ../ include/ common.func.php 添加代码 //将缩放图转变为文章第一张图片 function firstimg($str_pic) { $str_sub=substr( ...

随机推荐

  1. cpu 满载测试软件

    for i in `seq 1 $(cat /proc/cpuinfo |grep "physical id" |wc -l)`; do dd if=/dev/zero of=/d ...

  2. SharePoint 2016 功能比较

    SharePoint 2016中有很多功能.我们经常和客户谈论SharePoint安装时,我问他们是否计划安装SharePoint Server 2016 Standard或Enterprise.通常 ...

  3. 扒一扒IT大佬高考:马云数学1分考北大 李彦宏是状元

    http://news.cnblogs.com/n/522622/ 高考今天正式拉开序幕,而像李彦宏.马云等 IT 大佬之前也都参加过高考,他们成绩又都是怎样的呢? 马化腾:放弃天文梦选择计算机 20 ...

  4. COGS 13. 运输问题4

    ★★☆   输入文件:maxflowd.in   输出文件:maxflowd.out   简单对比时间限制:1 s   内存限制:128 MB [问题描述]     一个工厂每天生产若干商品,需运输到 ...

  5. ES6, Angular,React和ABAP中的String Template(字符串模板)

    String Template(字符串模板)在很多编程语言和框架中都支持,是一个很有用的特性.本文将Jerry工作中使用到的String Template的特性做一个总结. ES6 阮一峰老师有一个专 ...

  6. 5分钟部署一个Hello World Servlet到CloudFoundry

    首先从我的Github下载我写好的hello world Servlet到本地. 安装Maven,然后执行命令行mvn clean install,确保build成功,在项目根目录的target文件夹 ...

  7. UVA 12673 Erratic Expansion 奇怪的气球膨胀 (递推)

    不难发现,每过一个小时,除了右下方的气球全都是蓝色以外,其他都和上一个小时的气球是一样的,所以是可以递推的.然后定义一类似个前缀和的东西f(k,i)表示k小时之后上面i行的红气球数.预处理出k小时的红 ...

  8. Android(java)学习笔记134:Android数据存储5种方式总结

    1.使用文件(File)存储 存储一般的数据 2.使用sharedperference(xml) 存储设置信息.配置信息.密码 3.数据库Sqlite 开源的,嵌入式的数据库,轻量级 4.使用Cont ...

  9. CPP-基础:c++读取ini文件

    配置文件格式是[JP]K=2EC156673E 2F4240 5595F6 char str[50];GetPrivateProfileString("JP", "K&q ...

  10. String java

    https://www.golinuxcloud.com/java-interview-questions-answers-experienced-2/ 75. What is the meaning ...