jquery-php魔术:如何从主页循环fancybox中打开帖子页面 [英] jquery-php magic: how to open the post page from within a homepage loop fancybox

问题描述

我在wordpress中运行一个自定义的花哨框；主页循环是特色图片"网格；单击它们不会打开帖子页面，而是打开带有帖子图像(通常只有一个)的花式框.

I run a custom fancybox within wordpress; the homepage loop is a grid of "featured images"; clicking on them doesn't open a post page but rather a fancybox with the image from the post (usually there's only one).

这可以通过用PHP函数替换the_permalink来完成，该函数可以获取帖子中(第一个)图片的直接URL.到目前为止一切顺利.

This is done by replacing the_permalink with a php function that fetches the direct url of the (first) picture in the post. So far so good.

现在图片已在fancybox中打开；在这里，我已经添加了一个漂亮的打印"链接.我需要的是指向我从中获取该图片的实际帖子页面的链接！

Now the picture has opened in fancybox; Here I've already added a beautifully working "print" link; what I need next to it, is a link to the actual post page I took that image from!!

这对我的大脑来说太难了...

this is too hard for me brains...

...如何通知Fancybox这样的变量?

... how to inform Fancybox of such variable??

显然，告诉fancybox使用<?php get_the_permalink(); ?>是行不通的(PHP代码段将转换为url字符；此外，它是否知道postID?我对此表示怀疑)；

Obviously, telling fancybox to use <?php get_the_permalink(); ?> won't work (the php snippet will be converted to url characters; besides, would it know the postID? I doubt it);

我尝试了在该网站上找到的不同的ajax变体，目的类似，但我无法使用它们.我认为我走的路不正确.

I tried different variants of ajax I found on this website to similar purposes but I couldn't get any of them to work. I don't think I am on the right track.

什么方法?用户单击主页上的fancybox链接后，图像网址应与(例如)帖子ID或帖子永久链接一起发送到fancybox脚本中，以允许fancybox使用此类变量生成链接.

What's the method? The moment the user clicks on the fancybox link on the home page, the image url should be sent into the fancybox script together with (for example) the post ID or the post permalink, to allow fancybox to use such variables to generate the link.

那时，将简单的window.location.replace(permalink);绑定到click动作即可.但是我的大脑看不到如何将固定链接或id传递给fancybox. :(

At that point a simple window.location.replace(permalink); bound to a click action would work. But my brain cannot see how can I pass that permalink or id to fancybox. :(

很抱歉缺少代码，我将发布您认为有帮助的任何内容.

Sorry for the lack of code, I'll post anything you think can help.

(注:我使用的是fancybox 1.3.7；仅在具有打印按钮且几乎没有类似更改的地方进行自定义，没什么大不了的)

推荐答案

很抱歉回答我自己的答案-我对此很陌生:)无论如何，这是 ...通过撰写以上文章，我实际上帮助我的大脑找到了解决这个问题的方法，这很简单:

sorry for answering my own answer -- I am new to this :) Anyway here it is ...by writing the above post, I actually helped my brain to figure a solution to this, which is rather straightforward:

fancybox使用许多变量，而不仅仅是href；我将使用其中之一来进行永久链接，例如title，甚至添加一个新变量(添加自定义变量将在fancybox脚本的顶部进行，这是完成的:

fancybox uses a lot of variables, not just the href; I will use one of them to carry the permalink through, for example title, or even add a new variable (adding a custom variable would happen at the top of the fancybox script, where this is done:

_start = function() {
        var obj = selectedArray[ selectedIndex ],
            href, 
            type, 
            title,
            str,
            emb,
            ret;

        _abort();

但我现在不尝试这样做).

but I'm not trying to do this now).

在php端，我会遇到这种情况:

so I would have such situation, on the php side:

<a class="fancybox-image" title="<?php echo get_the_permalink(); ?>"    href="<?php echo just_the_image(); ?>">

(功能just_the_image正在拍摄帖子的第一张图片)

(the function just_the_image is taking the first image of the post as mentioned above)

然后在fancybox脚本中的jquery端，我将执行此操作(希望这也将回答Erik请求):

then on the jquery side, inside the fancybox script, I'll do this (hope this will answer Erik request as well):

outer.append(permabox = $('<div id="#permabox"></div>'));

还有几行，我将这个动作绑定到了"permabox"上.

and a few lines down, I bind this action to the "permabox" thingy:

$('#permabox').bind("click", function(){
var mytitle = $('#fancybox-title-over').prop('innerHTML');
window.location.replace(mytitle);});

(注意，要使标题成为字符串，我使用了fancybox的innerHTML；这不是我认为的最直接的方法)；

(notice that to get the title as a string, I used the innerHTML of fancybox; not the most straightforward way I reckon);

以上并不是最佳解决方案，因为fancybox习惯于在图像下方显示标题；如上面建议的那样，为此目的添加自定义变量会更好-但关键是上面的方法很有效:)

the above is not the best solution, since fancybox is in the habit of displaying the title under the image; adding a custom variable to this purpose, as suggested above, would be better -- but the point is, the above works :)

这篇关于jquery-php魔术:如何从主页循环fancybox中打开帖子页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！