2012-09-07 3 views
1

이것은 "Direct link to any fancybox", but with URL in address bar 이후입니다. 이제는 내 fancybox 갤러리의 각 이미지에 고유 한 URL을 할당 할 수있게되었습니다. image # 1 URL을 사용하면 페이스 북에서 정확한 엄지 손가락을 얻을 수 있습니다.fancybox의 URL에 엄지 할당하기

최신 fancybox 및 jquery 버전을 사용하고 있습니다. 여기

는 자바 스크립트입니다 :

var thisHash = window.location.hash; 
    $(document).ready(function() { 

     $('.thumbs').fancybox({ 
      prevEffect : 'fade', 
      nextEffect : 'fade', 
      closeBtn : true, 
      arrows : true, 
      nextClick : true, 
      padding : 15, 
      helpers : { 
       title : { 
        type : 'inside' 
       }, 
       thumbs : { 
        width : 80, 
        height : 80 
       } 
      }, 
      beforeShow: function() { 
       var id = this.element.attr("id") 
       if (id) { 
        window.location.hash = id; 
       } 
      }, 
      beforeClose: function() { 
       window.location.hash = ""; 
      } 
     }); 

     if(thisHash) { 
      $(thisHash).trigger('click'); 
     } 
    }); 

그리고 여기에 HTML입니다 : 나 이미지를 열 때이 코드로, 기본적으로

<a class="thumbs" data-fancybox-group="group1" id="image1" href="http://freeimagesarchive.com/data/media/206/1_black.jpg"><img src="http://freeimagesarchive.com/data/media/206/1_black.jpg" /></a> 

, URL은, 예를 들어이 될 것이다 www.mysite.com # image1

해당 주소를 복사하여 페이스 북과 같이 붙여 넣으면 분명히 공유 할 엄지 손가락이 없습니다. 올바른 엄지 손가락은 http://freeimagesarchive.com/data/media/206/1_black.jpg이지만 아이디어는 이미지 링크를 공유하는 것이 아니라 fancybox 링크를 공유하는 것입니다.

나 자신을 분명히했으면 좋겠다. 영어를 유감스럽게 생각한다.

이 작업을 수행하는 방법은 무엇입니까?

답변

0

Facebook이이 이미지를 제대로 공유하기를 원한다면, 각 이미지에 대해 적절한 Open Graph meta tags과 함께 페이지가 필요합니다. 이들은 정적 파일에 하드 코딩되거나 서버 측 스크립트에 의해 동적으로 생성되어야합니다. 이 페이지는 Facebook에서 공유하는 URL이므로 parser에서 읽을 수 있습니다.

최종 사용자가 팬시 박스 버전을 보도록하려면 공유 URL을 방문 할 때 자바 스크립트 코드로 리디렉션 할 수 있습니다.

+0

안녕하세요, 답변 해 주셔서 감사합니다. 문제는 이미 각 이미지에 대해 고유 한 URL을 가지고 있습니다. 이렇게하면 작동하지 않습니까? 각 ../#image에 대해 OG 태그를 생성하는 방법이 없습니까? – coldpumpkin

+0

@coldpumpkin 나는 몇 년 후 여기서 당신의 발자취를 따라 가고 있습니다. 이걸 알아 냈어? – dotcommer

+0

@dotcommer 아니요, 저는 없습니다 : \ – coldpumpkin