使用查询字符串或#将URL重定向到现有页面!添加到

时间:2013-05-09 作者:Ryan Giglio

我正在尝试创建一个照片库,在这里,个人照片可以在Facebook和Twitter上共享,当你单击链接时,共享的照片将自动在灯箱中打开。

大多数lightbox插件都提供了一个深度链接功能,它以#的形式提供了这一功能!在URL之后。不幸的是(https://www.facebook.com/sharer/sharer.php?u=http://google.com) 和推特(http://twitter.com/share?text=My%20Tweet&url=http://google.com) 共享框删除#之后的所有文本。这意味着,当您尝试共享深度链接的灯箱照片时,链接只会将您带回图库,而不是打开该照片。

我提出的非WordPress解决方案是共享一个静态URL,然后使用重写规则将它们发送到正确的位置。例如,用户会在Facebook上共享“example.com/gallery/123/”,当他们去那里时,他们会被发送到“example.com/gallery/?photo=123”。这将由Javascript解析,以编程方式单击正确的图像并打开lightbox。

我提出的重写规则:

RewriteRule ^gallery/(.*)/$ /gallery/?photo=$1 [R]
在静态站点上工作很好,但在WordPress中不行,这就是我来这里的原因!

我希望URL为/gallery/#/123,但我知道你不能添加#!有了RewriteRule,如果有人能想出一种方法来做到这一点,那就更好了!

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

有一种方法可以通过内部WordPress重写实现这一点,然后设置一个查询变量,您可以在javascript排队时检查该变量,并通过localize script.

所以首先,重写规则以拦截gallery/ 添加内容后,加载名为gallery, 并设置查询变量gallery_id 指向URL中的任何内容。此外,我们还添加了gallery_id 查询var,以便WordPress了解它。确保在添加重写后访问permalinks设置页面,以刷新规则和此新规则。

function wpa_gallery_rewrite(){
    add_rewrite_rule(
        \'gallery/([^/]+)/?$\',
        \'index.php?pagename=gallery&gallery_id=$matches[1]\',
        \'top\'
    );
}
add_action( \'init\', \'wpa_gallery_rewrite\' );

function wpa_gallery_query_var( $query_vars ){
    $query_vars[] = \'gallery_id\';
    return $query_vars;
}
add_filter(\'query_vars\', \'wpa_gallery_query_var\');
现在,当我们将javascript排队时,我们可以检查该值并设置一个var,该var将与脚本一起添加并可用于脚本。

function wpa_scripts() {
    wp_enqueue_script(
        \'wpa_script\',
        get_template_directory_uri() . \'/js/my_gallery.js\',
        array(\'jquery\'),
        null,
        false
    );
    $default_photo = ( get_query_var( \'gallery_id\' ) ) ? get_query_var( \'gallery_id\' ) : 0;
    wp_localize_script(
        \'wpa_script\',
        \'wpa_data\',
        array(
            \'default_photo\' => $default_photo
        )
    );
}
add_action( \'wp_enqueue_scripts\', \'wpa_scripts\', 100 );
现在在javascript中,检查wpa_data.default_photo 查看它是否等于0,或者是否请求了特定的照片。

结束

相关推荐