jquery - fancybox iframe 内容和谷歌搜索

Question

我的网站上有一个页面，列出了所有项目的拇指。单击特定拇指（项目）时，Fancybox 会在 iframe 中加载项目的详细信息。一切都很好！（iframe 中的内容不包括导航、标题和其他网站元素。）

我遇到的问题是 Google 搜索结果页面 - Google 为所有详细信息页面编制了索引，现在当用户单击 Google 结果中的链接时，详细信息内容页面会在浏览器中打开（而不是 Fancybox iframe）。这很糟糕，因为详细信息页面不包括导航页面。

任何用户友好的解决方案？

Answer 1

如果您对那些没有被 Google 索引的页面感到满意，那么您可以将 rel="nofollow" 添加到链接中：

更多详细信息：http: //support.google.com/webmasters/bin/answer.py ?hl=en&answer=96569

Answer 2

正如我在评论中提到的，您需要在每个“详细信息”页面中包含一个脚本来嗅探 URL 并检测页面是否在新窗口（首页）中打开，如果是，则重定向到修改后的主页URL（使用hash例如）将允许从主页打开fancybox中的“详细信息”页面。

因此，您可以在每个“详细信息”页面中包含此脚本：

<script type="text/javascript">
var isWindow = self == top; // returns true if opened in a new window, otherwise it migh be inside an iframe
if(isWindow){ 
 // alert("this page was opened in a new browser window");
 // then redirect to main page and add hash "detailedXX"
 window.location = "{URL}/mainpage.html#detailed01"
}
</script>

detailed01为每个“详细信息”页面更改为不同的值。

然后在主页中，您可能有指向每个详细信息页面的链接，例如

<a id="detailed01" class="fancybox" href="detailed01.html">Open project detail page 01 in fancybox</a>
<a id="detailed02" class="fancybox" href="detailed02.html">Open project detail page 02 in fancybox</a>

请注意，我ID在每个锚点中都包含了一个与hash我们将在重定向到主页时使用的锚点相匹配的锚点。

然后你的 fancybox 脚本可以是这样的：

<script type="text/javascript">
var thisHash = window.location.hash;
$(document).ready(function() {
 if(window.location.hash) {
  // get the URL without hash so we can restore it if needed
  var thisWindowLocation = window.location;
  var thisWindowLocationSplit = String(thisWindowLocation).split("#")[0];
  $(thisHash).fancybox({
   width: 800,
   height: 320,
   fitToView: false,
   autoSize : false,
   type: 'iframe',
   afterClose : function(){
    // returns URL to main page with no hash
    window.location = thisWindowLocationSplit
   }
  }).trigger('click');
 }
// fancybox for normal main page operation
 $(".fancybox").fancybox({
  width: 800,
  height: 320,
  fitToView: false,
  autoSize : false,
  type: 'iframe'
 });
}); // ready
</script>

我在这里设置了一个DEMO

此演示打开两个“详细”页面：

http://www.picssel.com/playground/jquery/detailed01.html 和 http://www.picssel.com/playground/jquery/detailed02.html

如果您尝试直接打开它们，则会重定向到调用页面并在 fancybox 中打开