Wordpress编辑<img/>标记以包含数据属性

时间:2015-10-08 15:02:44

标签: php jquery html wordpress image

我在Wordpress媒体上传器中添加了一个自定义字段,用于存储Vimeo ID。我需要将此自定义字段数据(如果已输入)拉入Wordpress中默认<img>标记的标记中 - 我希望将其添加为数据属性。

在网上搜索过我没有在这里尝试什么的线索,有没有人有这方面的经验?

如果存在上述data-属性,我还想自动将“视频缩略图”类添加到该图像中。

我可以按如下方式调用cusotm字段,但不知道如何将其合并到<img>标记中:

$video_url = get_post_meta($id, 'video-url', true);

默认Wordpress <img>代码

<img class="aligncenter size-large wp-image-114" src="#" alt="" width="1024" height="435" />

期望的结果

<img class="video-thumb aligncenter size-large wp-image-114" src="#" alt="" width="1024" height="435" data-vimeo-id="69171201" />

1 个答案:

答案 0 :(得分:0)

您可以在帖子循环中尝试此操作

$key = 'your custom meta key'

echo get_post_meta($post->ID, $key, true);

全面实施

<?php
$query = new WP_Query('showposts=3');
if ($query->have_posts()):
    while ($query->have_posts()):
        $query->the_post();
        $vimeo = get_post_meta($post->ID, 'your_key', true);
        the_title();
?>

<img class="video-thumb aligncenter size-large wp-image-114" src="#" alt="" width="1024" height="435" data-vimeo-id="<?php echo $vimeo; ?>" />

<?php
    endwhile;
endif;
wp_reset_query();
?>

请阅读here

的更多信息