专栏首页一丘一壑Genesis框架从入门到精通(11): 图像函数

Genesis框架从入门到精通(11): 图像函数

Genesis Explained Image Functions

In the previous part of the Genesis Explained series I talked about the formatting functions. Fortunately this subseries doesn’t require you to read each of the previous parts, but I would encourage you to read the entire series in order. I …

Designs By Nick the Geek


Genesis Explained系列的前一部分中,我谈到了样式函数。函数这个子系列不需要你阅读前面的每个部分,但我建议你按顺序阅读整个系列。我在上一篇文章中提到过,我将略过几个文件并直接跳到 genesis/lib/functions/image.php 文件。我建议阅读的同时打开这个文件,这样你就可以看到我正在谈论的函数。

这里是Genesis 中image.php包含的函数列表。

  • genesis_get_image_id():返回一篇文章中所插入的图片文件的ID(如果有图片的话)。默认值是第一张图片。
  • genesis_get_image():根据参数返回图片附件或特征图像。
  • genesis_image(): 把 genesis_get_image()获取到的图片显示出来
  • genesis_filter_attachment_image_attributes():已经废除
  • genesis_get_additional_image_sizes():同上
  • genesis_get_image_sizes():返回图片尺寸大小的数组。

温馨提示

最近发现一个很好的可以在线阅读Genesis代码的网站:

https://genesis.wp-a2z.org/oik_file/lib/functions/image-php/

这些其中一些只是辅助函数,可能不会经常能用到,但是如果你不想仅仅只是用Genesis打扮打扮换换皮肤,那么其中有一些重要的函数是值得你学习一下的。

genesis_get_image($args = array())

如你所见,$args 是一个数组,但这是啥意思呢?简而言之,你需要将传递一个数组作为参数。用一分钟演示一下。现在,让我们看看默认值。(注:更具Genesis 2.8 更新)

	$defaults = array(
		'post_id'  => null,
		'format'   => 'html',
		'size'     => 'full',
		'num'      => 0,
		'attr'     => '',
		'fallback' => 'first-attached',
		'context'  => '',
	);

这显示了可以在数组中传递的4个不同参数,分别看一下每个参数不同的意义(注:斜体为译者丘壑添加):

  • Format: 控制返回的格式
    • html(默认):默认返回为可以直接用作html的图片,无需设置img标签或任何东西。
    • url:返回图片的url(绝对路径)。可以将其用在链接里或构建自己的html代码。
    • src:返回图片的“src”,相对路径。如果你的图片位于“http://example.com/wp-content/uploads/2011/05/img.jpg”,那么它将返回“wp-content/uploads/2011/05/img.jpg”
  • size:控制基于WordPress定义的图片尺寸
    • full (默认): 原始大小
    • large:返回WP的大图片尺寸
    • medium:返回WP中等尺寸
    • thumbnail:返回WP缩略图大小
    • X:使用 add_image_size()设置的其他图片尺寸。要传的是该尺寸的名称(比如verysmall),而不是使用长乘以宽做参数。
  • num:要返回哪一个的图片。 默认值是0,如果文章未设置特色图像,将返回第一个图片附件。使用1将返回第二张图片,以此类推,但将覆盖特色图像。(注:这里的图片附件 — attached image是指在文章编辑的时候直接上传的图片,插入已经上传过的图片不算attached image)
  • attr:用于设置img标签里的属性和值,返回的是一个数组,其中属性为键,属性值为字符串(示例可以更好的说明这一点)
  • fallback: 可以接受多种不同的(但不一定是所有的)类型, 可以用于没有设置特色图的情况下用第一张或其他图片作为替代,或者用false控制什么都不输出。参考
  • context:手动设置一些的定义量,用于适配其他方法或者函数

还有一些过滤器可用。你可以使用 genesis_get_image_default_args来修改默认参数。 genesis_pre_get_image允许你在参数处理完之后再修改参数(注:这个解释起来有点绕,有一个场景下可以理解这个过滤器:如果一篇文章没有设置特色图,就拿一张默认图片作为特色图)。最后,你可以使用过滤器 genesis_get_image修改最终返回的值。

示例

$img = genesis_get_image( array(
    'format' => 'html',
    'size' => 'thumbnail',
    'num' => 1,
    'attr' => array (
        'class' => 'alignleft'
        ) ) );

因为htmlformat的默认值,所以可以不写,但我想给你展示一下所有的参数值。这将返回第二个附加图像的缩略图,并设置居左class ="alignleft"。很酷。

注:涉及图片的函数都不如文字那么直观,一图胜千言,请看我在开发环境下做的截图。特色图像算作是第一张。如果这篇文章正文里面有图片,都是在编辑的时候上传的,是attached image ,所以可以用genesis_get_image()显示出来,看下面。

genesis_image($args = array())

通常我会说“用echos genesis_get_image() 可以节省你的代码量”,的确如此,但除此之外还有一个非常好的作用。如果没有特色图像也没有附加图片,此函数将返回“false”,因此可以用非常简单的 if / else返回一个默认图像。

if( FALSE === genesis_image( array( 'size' => 'thumbnail' ) ) )
    echo '<img src="http://example.com/default-image.jpg" />';

上面的代码,如果图像存在,它将自动显示图像,否则返回false并加载默认图像。

genesis_get_image_sizes()

这将返回具有图片所有尺寸大小的数组。这在构建窗口小部件或设置主题选项时非常有用,你可以获取到可用的图像大小并将其与你需要的尺寸进行匹配。使用它时你必须做一个foreach,如下所示:

$image_sizes = genesis_get_image_sizes();

echo '<ul>';
    foreach ( $image_sizes as $name => $size ) {
        printf ('<li>%s: ( w:%s h:%s )</li>', $name, $size['width'], $size['height'] );
    }
echo '</ul>';

这会返回带有宽度和高度的图像大小的无序列表。

处理图像的函数用法有点复杂,因为你必须使用数组值,但是一旦你习惯了它们,你会发现它们非常灵活和强大。

写在后面

这一篇虽然讲的内容不复杂,但是信息量还是挺大的,花费了好多时间,主要是在研读代码和验证图像函数的实际展示效果,还有截图做图,甚至连Photoshop都用上了,也是够了。。。图像函数比处理文本的好玩一点,花头比较多,用的好了也能比较抓眼球

下面是多图预警

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Genesis框架从入门到精通(1):什么是框架?

    WordPress主题框架Genesis的工作原理可能会让很多人感到困惑不解,这导致开发者在开始用Genesis框架时可能会一脸蒙逼,无所适从。

    丘壑
  • Genesis框架从入门到精通(7): 框架的过滤器

    Genesis Explained Framework Filters

    丘壑
  • Genesis框架从入门到精通(13): 小部件函数

    Genesis Explained系列中的上一篇文章是关于配置项函数的,并演示了一些用于从数据库中检索自定义字段和主题选项的重要函数。本文是关于 genesis...

    丘壑
  • Genesis框架从入门到精通(12): 配置项函数

    Genesis Explained Option Functions

    丘壑
  • 【pytorch-ssd目标检测】可视化检测结果

    制作类似pascal voc格式的目标检测数据集:https://www.cnblogs.com/xiximayou/p/12546061.html

    西西嘛呦
  • 使用VS2019编写C语言程序,环境安装配置+代码调试

    进入官网后会发现有三种版本可供下载,分别是社区版、专业版和企业版,冲哥这里选择的是专业版。

    C语言中文社区
  • 基于Amazon Rekognition构建人脸识别系统

    人脸识别是目前机器视觉最成功的一个领域了,有许多的人脸检测与识别算法以及人脸识别的函数库。对于入门深度学习来说,从头开始一步一步训练出一个自己的人脸识别项目对你...

    深度学习与Python
  • Python-OpenCV 处理图像(七):图像灰度化处理

    灰度数字图像是每个像素只有一个采样颜色的图像,这类图像通常显示为从最暗黑色到最亮的白色的灰度。

    bear_fish
  • spring中的SpEL表达式

    Spring 3引入了Spring表达式语言( Spring Expression Language,SpEL),它能够以一种强大和简洁的方式将值装配到bean...

    earthchen
  • opencv学习笔记--直方图的均值化

    用户2965768

扫码关注云+社区

领取腾讯云代金券