wordpress 通过ID和大小获取图像源

mnemlml8  于 2023-08-03  发布在  WordPress
关注(0)|答案(2)|浏览(130)

我在一个WP网站与一些推广/广告滑块与谷歌分析点击事件。作品伟大,现在我想服务正确的图像在正确的分辨率。
我使用picturefill来提供图像。硬编码时工作正常,所以我知道它工作。当我试图得到图像来源与图像上传的WP是不。我知道这是由于我的php技能。
picturfill需要什么:

<span data-picture data-alt="">
    <span data-src="filename_default.jpg"></span>
    <span data-src="filename_small.jpg" data-media="(min-width: 400px)"></span>
    <span data-src="filename_medium.jpg" data-media="(min-width: 768px)"></span>
    <span data-src="filename_big.jpg" data-media="(min-width: 1200px)"></span>

    <!-- Fallback content for non-JS browsers. -->
    <noscript>
        <img src="external/imgs/small.jpg" alt="">
    </noscript>
</span>

字符串
我有URL或id或图像存储在:$attachment_id
我想这样做:

<?php
    $attachment_id = get_field('advimg');
    $large = "adv-pos-a-large";
    $default = "adv-pos-a-default";
    $small = "adv-pos-a-small";

?>

**get_field('advismg');**来自ACF

<span data-picture data-alt="">
    <span data-src="<?php wp_get_attachment_image_src( $attachment_id, $default ); ?>"></span>
    <span data-src="<?php wp_get_attachment_image_src( $attachment_id, $small ); ?>" data-media="(min-width: 400px)"></span>
    <span data-src="<?php wp_get_attachment_image_src( $attachment_id, $default ); ?>" data-media="(min-width: 768px)"></span>
    <span data-src="<?php wp_get_attachment_image_src( $attachment_id, $large ); ?>" data-media="(min-width: 1200px)"></span>

    <!-- Fallback content for non-JS browsers. -->
    <noscript>
        <img src="external/imgs/small.jpg" alt="">
    </noscript>
</span>


但它不起作用。Iv 'e玩过:
wp_get_attachment_image_src wp_get_attachment_image_url wp_get_attachment_image_link
我一定有周五,因为它不是工作和某事告诉我,这不是很难...我只是今天没有看到它。
希望你们能帮忙。
先谢谢你,
/保罗

编辑/最终代码/修复

<?php 
    $attachment_id = get_field('advanced_custom_field_name_here');
    $small = wp_get_attachment_image_src( $attachment_id, 'adv-pos-a-small' );
    $default = wp_get_attachment_image_src( $attachment_id, 'adv-pos-a-default' );
    $large = wp_get_attachment_image_src( $attachment_id, 'adv-pos-a-large' );
?> 

<span data-picture data-alt="alt desc here">
    <span data-src="<?php echo $default[0]; ?>"></span>
    <span data-src="<?php echo $small[0]; ?>" data-media="(min-width: 400px)"></span>
    <span data-src="<?php echo $default[0]; ?>" data-media="(min-width: 768px)"></span>
    <span data-src="<?php echo $large[0]; ?>" data-media="(min-width: 1200px)"></span>

    <!-- Fallback content for non-JS browsers. Same img src as the initial, unqualified source element. -->
    <noscript>
        <img src="<?php echo $default[0]; ?>" alt="alt desc here">
    </noscript>
</span>

eiee3dmh

eiee3dmh1#

wp_get_attachment_image_src的命名很混乱。(更好的名称是wp_get_attachment_image_atts)。它实际上返回了一个包含图像附件文件的图像属性“url”、“width”和“height”的数组。对于图像src,使用返回数组中的第一个元素:

$img_atts = wp_get_attachment_image_src( $attachment_id, $default );
$img_src = $img_atts[0];

字符串
此外,确保ACF图像字段返回类型设置为附件ID,以便$attachment_id = get_field('advimg');提供所需的ID。

kuuvgm7e

kuuvgm7e2#

$image_url = wp_get_attachment_image_src($image_attachment_id, 'large');

字符串
你应该得到一个数组

array (size=4)
  0 => string 'http://domian.test/wp-content/uploads/2023/03/Picture-004-1-1024x352.png' (length=78)
  1 => int 1024
  2 => int 352
 3 => boolean true


注意:图像大小可以是任何注册的图像大小名称,也可以是以像素为单位的宽度和高度值数组(按该顺序)。

相关问题