Question

我在WordPress网站上使用Fancyapps的FancyBox，这很棒。唯一的问题是客户想要添加下载或查看PDF的功能。

因此，当您单击站点上的图像时，您将获得显示该图像的大型版本的FancyBox模式窗口。在FancyBox模式窗口的右下角，我添加了一个“PDF”按钮。

我需要能够在WordPress中为每个帖子附加PDF，并在点击“PDF”按钮时进行相关的PDF下载/显示（取决于您的浏览器和插件）。

我找到了在fancybox源目录（jquery.fancybox.pack.js）中添加PDF按钮的位置，但我不知道全局变量将链接到附加到每个帖子的PDF。

这是代码（第34行）：

if(c=a.current.title)c=d('<div class="fancybox-title fancybox-title-'+b.type+'-wrap">'+c+"</div><a class='pdf_dl' href='{href}' target='blank'>PDF</a>").appendTo("body"),"float"===b.type&&(c.width(c.width()),c.wrapInner('<span class="child"></span>'),a.current.margin[2]+=Math.abs(parseInt(c.css("margin-bottom"),10))),c.appendTo("over"===b.type?a.inner:"outside"===b.type?a.wrap:a.skin)}};d.fn.fancybox=function(b){var c=d(this),e=this.selector||"",f,g=function(g){var h=this,j=f,k;!g.ctrlKey&&!g.altKey&&!g.shiftKey&&!g.metaKey&&!d(h).is(".fancybox-wrap")&&

有什么想法吗？我可能会以错误的方式解决这个问题。谢谢！

Answer 1

这里有两个相关主题

客户端：Fancybox

正如您所说，您需要更改Fancybox窗口并添加下载链接。我认为操纵Fancybox的原始源文件是一个坏主意（你甚至似乎已经发布了minified生产版本的一部分，它几乎不可读）。如果发布新版本的Fancybox，你打算做什么？您必须手动将更改移植到新版本。

相反，请使用Callbacks that Fancybox provides。例如，将您自己的javascript挂钩到beforeShow回调中并操纵那里的Fancybox窗口元素。您需要选择URL（见下文）并创建所需的链接。

服务器端：Wordpress

为了了解您应该链接到哪个 PDF文件，Wordpress需要将URL放入页面。您可能希望隐藏它，因为您只在打开Fancybox时显示它。一种简单的方法是使用隐藏链接：

<a href="/wp-content/uploads/myfile.pdf" id="pdflink" style="display: none;"></a>

实施取决于您的需求。在Wordpress主题中，您可以使用wp_get_attachment_url()和get_posts()从数据库中获取信息。

这里有一个建议如何将Wordpress示例代码修改为一个函数，该函数返回任何帖子的第一个PDF附件的URL（尽管未经测试）：

function getPdfUrlForPost( $postId ){
    $args = array(
        'post_type' => 'attachment',
        'numberposts' => -1,
        'post_status' => null,
        'post_parent' => $postID
    );

    $attachments = get_posts( $args );
    if ( $attachments ) {
        foreach ( $attachments as $attachment ) {
          $url = wp_get_attachment_url( $attachment->ID );   
          if( substr(strrchr($url,'.'), 1) == 'pdf' ){
              return $url
          }
        }
        return false;
     }
}

在WordPress中为FancyBox添加PDF下载选项

1 个答案:

客户端：Fancybox

服务器端：Wordpress