将“data-”属性添加到图像链接

时间:2015-10-07 作者:at least three characters

是否可以向图像链接添加属性和值?

我目前拥有:

<a href="#">
  <img class="img-responsive aligncenter wp-image-1286 size-full" src="#" alt="..." width="858" height="304">
</a>
并希望添加data-rel="lightbox-0" 至链接:

<a href="#" data-rel="lightbox-0">
  <img class="img-responsive aligncenter wp-image-1286 size-full" src="#" alt="..." width="858" height="304">
</a>
我还需要在特定的分类法中为图像添加新属性,但我想我可以理解这一部分。

1 个回复
最合适的回答,由SO网友:metatron 整理而成

在谷歌搜索同一个问题时,我在Wordpress论坛上发现了你的问题和一个类似的问题。您可以通过image\\u send\\u to\\u编辑器过滤器控制生成代码的输出,如下所示:

function filter_image_send_to_editor($html, $id, $caption, $title, $align, $url, $size, $alt) {
  $html = sprintf(\'<a href="#" data-rel="lightbox-0"><img alt="%2$s" src="%1$s" /></a>\', esc_attr(esc_url($url)), esc_attr($title));

  return $html;
}

add_filter(\'image_send_to_editor\', \'filter_image_send_to_editor\', 10, 8);
原始链接:https://wordpress.org/support/topic/change-generated-html-code-from-add-media-button

相关推荐

在中实现Lightbox照片库

我是WP模板的新手,我正在尝试从一个单页引导主题创建自己的自定义WP主题。对于我的问题是如此特殊,比如说(希望我不要因此而大喊大叫),我很难找到解决问题的方法。我只是用公文包页面做一个简单的主题。到目前为止,我的所有文件都是本地文件。我从下载了一个引导主题here.我遇到的问题是在我的投资组合页面上。我有一个自定义帖子类型和(我猜)一个自定义页面模板加载这个页面(不确定你是否需要知道,只是想确保你知道)。我所要做的就是单击我的一个缩略图,放大并显示在页面上,同时使背景变暗(就像原来的一样),请参见上面链接