Facebook에서 공유를 구현하는 동안 특정 이미지를 축소판으로 표시하는 방법은 무엇입니까?

Facebook에서 공유를 구현하는 동안 특정 이미지를 축소판으로 표시하는 방법은 무엇입니까?

---

이 방법을 공유를 구현합니다. 다음과 같이 코드를 사용하고 있습니다.

http://www.facebook.com/share.php?u=my_website_url

이제 Facebook이 썸네일을 표시 할 때 일부입니다. 이 이미지는 내 웹 사이트에서 선택되었습니다. 특정 이미지를 축소 축소판으로 선택 축소 축소판을 표시합니까?

내 블로그 주소로 확인할 수 있습니다 .

---

이 블로그 게시물에 답변이있는 것 : http://blog.capstrat.com/articles/facebook-share-thumbnail-image/

특히 다음과 같은 태그를 사용하십시오.

<link rel="image_src" 
      type="image/jpeg" 
      href="http://www.domain.com/path/icon-facebook.gif" />

이미지의 이름은 예제에서와 동일해야합니다.

"미리보기 작동 확인"을 클릭하십시오.

참고 : 태그는 설명서에 따라 24 시간마다 스크랩합니다. Facebook Lint 페이지를 사용하여 이미지를 Facebook으로 가져옵니다.

http://developers.facebook.com/tools/lint/

---

Facebook의 사양에서 다음과 같은 코드를 사용하십시오.

<meta property="og:image" content="http://siim.lepisk.com/wp-content/uploads/2011/01/siim-blog-fb.png" />

출처 : Facebook Share

---

내 태그는 있었다 문서에 따르면 Facebook은 24 시간마다 긁어 썼습니다. Facebook Lint 페이지를 사용하여 이미지를 Facebook으로 가져 왔습니다.

여기에 URL을 입력하면 FB가 페이지의 메타 데이터를 업데이트합니다.

https://developers.facebook.com/tools/debug (업데이트 된 링크)

---

Facebook은 og:tags및 오픈 그래프 프로토콜 을 사용 하여하여 공유 대화 상자 또는 Facebook의 뉴스 피드에서 URL을 미리 볼 때 표시 할 정보를 해독합니다 .

다음 og:tags과 같은 정보가 포함됩니다.

• 페이지 제목
• 페이지 유형
• URL
• 웹 사이트 이름
• 페이지에 대한 설명
• 페이지 관리자의 Facebook user_id (facebook)

은 다음 일부 예 ( 페이스 북 문서 에서 가져온 )입니다.og:tags

<meta property="og:title" content="The Rock"/>
<meta property="og:type" content="movie"/>
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>

의 올바른 마크 업을 구현 og:tags하고 값을 설정 한 후에는 Facebook 디버거 를 사용하여 Facebook에서 URL을 보는 방법을 테스트 할 수 있습니다 . 디버거 도구는 og:tags페이지에서 발견 되거나 부족한 문제를 강조 표시합니다 .

가지 유념해야 우리 한 할 점은 페이스 북이 있다는을 구석으로입니다 않습니다 그래서 페이지가 t을 구석으로 될입니다이 변경 사항을 적용하려면이 정보와 관련하여 몇 가지 캐싱을 긁어 문서에 명시된 바와 같이 :

메타 태그 편집

페이지의 태그를 업데이트하여 페이지의 속성을 업데이트 할 수 있습니다. og : 제목 및 og : 유형은 처음에만 편집 할 수 있습니다. 페이지에서 좋아요를 50 개 공용면 제목이 고정되고 페이지에서 좋아요를 10,000 개 공용면 유형이 고정됩니다. 이미 페이지를 좋아하는 놀라운 사용자를 방지하기 위해 수정되었습니다. 한 후 제목 또는 유형에 도달하지 않아도 아무 작업도 수행되지 않은 페이지는 원래 제목과 유형을 유지합니다.

변경 사항을 Facebook에 반영 비용 페이지를 강제로 스크랩해야합니다. 페이지 관리자가 좋아요 버튼을 클릭하거나 URL이 Facebook URL Linter Facebook Debugger에 입력하면 페이지가 스크랩 됩니다.

---

모든 내용이 있다는 것을 확인했습니다. 그러나 한 가지 중요한 세부 사항을 간과했습니다. 이미지의 크기는 최소 200X200 픽셀이어야합니다. 인용하는 사용 가능한 첫 번째 이미지로 축소판을 대체합니다. 또 다른 사실은 최소 요구 사항은 Facebook이 og : 이미지를 적용하는 데 필요한 3 개의 메타를 포함하는 것입니다.

<meta property="og:title" content="Title of the page" />
<!-- NEXT LINE Even if page is dynamically generated and URL contains query parameters -->
<meta property="og:url" content="http://yoursite.com" />
<meta property="og:image" content="http://convertaholics.com/convertaholics-og.png" />

Facebook 디버거로 페이지를 디버그하고 모든 경고를 수정하면 매력처럼 작동합니다! https://developers.facebook.com/tools/debug

---

나는 같은 문제를 사용하고 있습니다. 여기에 언급 된 링크 메타 태그를 사용하여 내가 원하는 이미지를 가리 키지 만 핵심은 FB가 다른 이미지를 선택 가져 오기 오지 않는다는 것입니다. 또한 이미지가 너무 크면 선택의 여지가 전혀 없습니다.

내 사이트를 수정 한 방법은 다음과 같습니다. http://gnorml.com/blog/facebook-link-thumbnails/

---

이것이 모두 작동하는 방법은 다음과 같습니다.

1. 공유하는 특정 웹 페이지의 HTML에 액세스 할 수있는 기능이 필요합니다. 공통 헤더 파일을 사용하면 사이트 전체에서 작동 할 것입니다. 나는 이것을 시도하지 않았지만 작동해야합니다. 그래도 이렇게하면 모든 페이지에 대해 동일한 이미지를 얻을 수 있습니다.

2. 이러한 HTML 메타 태그를. 에 넣으면 작동하지 않습니다. a) 이미지, b) 설명, c) URL 및 d) 제목에 따라 맞춤 설정해야합니다.

실제 예.

<meta property="og:image" content="http://www.coachesneedsocial.com/wp-content/uploads/2014/12/BannerWCircleImages-1.jpg" />

<meta property="og:description" content="Coaches share their secrets to success so you can rock 2015." />

<meta property="og:url"content="http://www.coachesneedsocial.com/coacheswisdomtelesummit/" />

<meta property="og:title" content="Coaches Wisdom Telesummit" />

3. 저장
4. 새로운 Facebook 게시물을 열고 공유하려는 페이지를 다시 시도하십시오.
5. 문제가있는 경우이 Facebook 도구를 사용하여 디버깅 할 수 있습니다. 실제보다 더 괴상 해 보입니다. 공유 할 URL에 게시 할 때 Facebook에 표시되는 내용을 알려줍니다.

https://developers.facebook.com/tools/debug/og/object/

큰 팁 .. HTML에서 "따옴표"가 동일한 지 확인하십시오 (2 개의 직선 표시와 곡선이 없어야합니다.… 가끔 프로그램이 이러한 글꼴을 다른 글꼴로 변경하고 코드를 망칠 수 있습니다.

---

Facebook에서 공유 : 이미지, 제목 및 텍스트를 사용자 지정하여 결과를 개선하는 방법

위의 링크에서. 최상의 공유를 위해 HTML에서 3 가지 데이터를 제안하는 것이 좋습니다.

• 표제
• 간단한 설명
• 영상

이는 HTML의 'head'태그 안에 다음과 같이 배치됩니다.

• 표제: <title>INSERT POST TITLE</title>
• 영상: <meta property=og:image content="http://site.com/YOUR_IMAGE.jpg"/>
• 기술: <meta name=description content="INSERT YOUR SUMMARY TEXT"/>

웹 사이트가 정적 HTML 인 경우 HTML 편집기를 사용하여 모든 페이지에 대해이 작업을 수행해야합니다.

Drupal과 같은 CMS를 사용하는 경우 많은 것을 자동화 할 수 있습니다 (위 링크 참조). 워드 프레스를 사용하는 경우, Drupal 예제를 지침으로 사용하여 비슷한 것을 구현할 수 있습니다. 도움이 되었기를 바랍니다.

마지막으로 언제든지 공유 게시물을 수동으로 편집 할 수 있습니다. 그림과 함께이 예를 참조하십시오 .

---

지난주에 작업 하던 사이트 에도 문제가있었습니다 . 좋아요 상자를 구현하고 좋아요 상자를 테스트했습니다. 그런 다음 헤더에 이미지를 추가했습니다 (ob : image 메타). 여전히 내 페이스 북 알림에 올바른 이미지가 표시되지 않았습니다.

나는 모든 것을 시도했고, 좋아요 버튼의 모든 구현이 캐시된다는 결론에 도달했습니다. 따라서 URL A에서 좋아요 버튼을 클릭 한 다음 헤더에 이미지를 지정하고 URL A에서 Luke 버튼을 다시 클릭하여 테스트한다고 가정 해 보겠습니다. 페이지가 캐시 될 때 이미지가 표시되지 않습니다. B 페이지에서 좋아요 버튼을 클릭하면 이미지가 표시됩니다.

캐시를 재설정하려면 위에서 언급 한 Lint 디버거 도구를 사용하고 캐시 된 URL에 대한 모든 URL의 유효성을 검사해야합니다. 그게 저에게 효과적이었습니다.

---

모든 Joomla 기사에 Facebook Open Graph를 설정하는 가장 쉬운 방법은 다음 코드 인 com_content / article / default.php 재정의에 배치하는 것입니다.

$app    = JFactory::getApplication();
$path   = JURI::root();

$document = JFactory::getDocument();
$document->addCustomTag('<meta property="og:title" content="YOUR SITE TITLE" />');
$document->addCustomTag('<meta property="og:name" content="YOUR SITE NAME" />');
$document->addCustomTag('<meta property="og:description" content="YOUR SITE DESCRIPTION" />');
$document->addCustomTag('<meta property="og:site_name" content="YOUR SITE NAME" />');
if (isset($images->image_fulltext) and !empty($images->image_fulltext)) : 
    $document->addCustomTag('<meta property="og:image" content="'.$path.'<?php echo htmlspecialchars($images->image_fulltext); ?>" />');
else :
    $document->addCustomTag('<meta property="og:image" content="'.$path.'images/logo.png" />');
 endif;

이것은 현재 기사의 세부 사항과 함께 메타 오그 태그를 헤드에 배치합니다.

참고 URL : https://stackoverflow.com/questions/689295/how-to-show-particular-image-as-thumbnail-while-implementing-share-on-facebook