Jquery Wordpress标题作为Fancybox标题
我们有一个客户端,它使用所见即所得编辑器向自定义帖子类型添加多张照片和不同的位 它们包括使用Wordpress图像标题功能的标题 我们如何(有效地)使用Fancybox的Jquery Wordpress标题作为Fancybox标题,jquery,wordpress,fancybox,caption,Jquery,Wordpress,Fancybox,Caption,我们有一个客户端,它使用所见即所得编辑器向自定义帖子类型添加多张照片和不同的位 它们包括使用Wordpress图像标题功能的标题 我们如何(有效地)使用Fancybox的title选项来实现这一点 结构如下: <div id="attachment_180" class="wp-caption"> <a href="image.jpg" rel="performance"> <img class="size-full" src="someim
title
选项来实现这一点
结构如下:
<div id="attachment_180" class="wp-caption">
<a href="image.jpg" rel="performance">
<img class="size-full" src="someimagethumb.jpg">
</a>
<p class="wp-caption-text">The Image Caption</p>
</div>
图像标题
抓住它,然后递给fancybox
var txt = $( '.wp-caption-text' ).text();
//do fancybox with txt passed to the title property
我想你可能想要这样的东西
$('div.wp-caption').each(function(){
var caption = $(this).find('p.wp-caption-text').text();
$(this).find('img').attr('title',caption);
$(this).find('p.wp-caption-text').remove();
});
说明:
对于每个picdiv
(页面上可能有很多),请执行以下操作
img
元素的title
属性中p
元素示例:我在
functions.php
文件中使用了一个钩子,而不是JQuery:
function add_title_attachment_link($link, $id = null) {
$id = intval( $id );
$_post = get_post( $id );
$post_title = esc_attr( $_post->post_excerpt );
return str_replace('<a href', '<a title="'. $post_title .'" href', $link);
}
add_filter('wp_get_attachment_link', 'add_title_attachment_link', 10, 2);
标题现在将显示在lightbox中。我希望我不必使用性能糟糕的功能。查找,但我认为没有其他方法……使用fancybox v2.x非常简单(您需要将其硬编码到WordPress中)。这是怎么回事
$(".fancybox").fancybox({
helpers : {
title : {
type : 'over'
}
}
});