Jquery 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

我们有一个客户端,它使用所见即所得编辑器向自定义帖子类型添加多张照片和不同的位

它们包括使用Wordpress图像标题功能的标题

我们如何(有效地)使用Fancybox的
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();    
});​
说明:

对于每个pic
div
(页面上可能有很多),请执行以下操作

  • 从插入的标题中捕获文本
  • 将文本添加到
    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'
            }
        }
    });