WordPress 웹사이트에 Twitter 카드를 추가하는 방법

게시 됨: 2023-12-10

트위터에서 콘텐츠를 공유하는 것은 사이트 트래픽을 늘리는 좋은 방법입니다. 그러나 실제 트윗 자체는 공유되는 콘텐츠에 대한 많은 정보를 제공하지 않습니다. 가장 좋은 경우 표준 트윗에는 사용자가 트윗한 소량의 설명 텍스트, 콘텐츠 링크, 수동으로 업로드한 이미지, 한두 개의 #해시태그 또는 @멘션이 포함될 것입니다.

매우 표준적인 내용은 모두 동적으로 검색되지 않았습니다. 게다가 귀하의 트윗이 리트윗되는 경우 원본 트윗(및 트윗된 콘텐츠)의 노출이 최소화됩니다. Twitter 카드는 이 모든 것을 변경합니다. Twitter Cards는 널리 사용되는 Open Graph Protocol을 사용하여 트윗되는 URL에서 콘텐츠를 자동으로 검색하는 기능을 제공합니다.

트위터 카드
이미지 출처: airrayagroup – Pixabay.com / 라이센스: CC0 공개 도메인

텍스트, 이미지, 비디오 등의 발췌문 등의 콘텐츠를 모두 동적으로 검색하여 관련 Twitter 카드 내에 표시할 수 있습니다. 뿐만 아니라 각 카드에는 귀하의 트위터 이름에 대한 직접 링크도 표시되며 원클릭 팔로우도 가능합니다. 즉, 귀하의 트윗이 리트윗되면 해당 사용자가 리트윗하는 것이 아니라 귀하의 정보(및 공유 콘텐츠)가 관심을 끌 수 있는 가장 좋은 위치에 있다는 의미입니다. 이는 트위터 팔로어 수를 늘리는 데 이상적입니다.

Twitter 카드를 통합하는 두 가지 방법

이 획기적인 기능을 WordPress 사이트에 구현하는 방법을 자세히 살펴보겠습니다. Twitter 카드를 WordPress에 구현하는 방법은 여러 가지가 있습니다. 하나는 플러그인을 사용하는 것입니다. 둘째, 하위 테마를 사용하여 테마 코드를 수정합니다.

우리가 살펴볼 첫 번째 옵션은 플러그인을 사용하는 것입니다. WordPress 웹사이트에 Twitter 카드를 쉽게 구현할 수 있는 여러 플러그인이 있습니다. 이 목적을 위해 사용 가능하고 인기 있는 플러그인 중 하나를 다운로드하여 설치하기만 하면 됩니다. 플러그인은 플러그인 디렉터리를 통해 또는 WordPress 대시보드 내에서 플러그인 으로 이동하여 다운로드할 수 있습니다.

트위터 카드 메타 플러그인

트위터 카드 메타
이미지 출처: 스크린샷 – WordPress.org

Twitter 카드 메타 플러그인을 사용하면 WordPress 웹사이트나 블로그에 Twitter 카드를 쉽게 구현할 수 있습니다. 플러그인을 활성화하면 WordPress 대시보드 내에 옵션 페이지가 생성됩니다. Twitter 카드 관리 메뉴를 통해 액세스할 수 있습니다.

이제 Twitter Cards Meta 플러그인 구성을 시작할 수 있습니다. 귀하의 트위터 계정과 관련된 세부 정보를 입력하고, 기본 이미지 URL을 추가하고, 트위터 카드에 표시할 이미지를 선택하세요. 마지막으로 옵션 저장 버튼을 클릭하여 옵션을 저장하세요.

요스트 SEO 플러그인

WordPress SEO 요스트
이미지 출처: 스크린샷 – WordPress.org

WordPress에 사용할 수 있는 가장 인기 있는 플러그인 중 하나는 Yoast SEO입니다. 현재 활성 설치 수가 백만 개가 넘습니다. 이 강력한 WordPress 플러그인은 기본적 으로 Twitter 카드 통합 기능을 갖추고 있습니다. 대부분의 사람들은 SEO 최적화를 위해 이 플러그인을 설치했습니다. 따라서 귀하는 자신도 모르게 이 특정 기능을 이미 사용할 수 있을 가능성이 있습니다.

정상적으로 플러그인을 다운로드하여 설치하고 WordPress 대시보드 내 SEO => 소셜 관리 메뉴를 방문하세요. Twitter 사용자 이름이라고 표시된 필드에 Twitter 사용자 이름을 입력하고 변경 사항 저장 버튼을 클릭하세요. 페이지 상단에는 다양한 소셜 미디어 매체에 대한 탭이 있습니다. 이제 Twitter 탭을 클릭하여 Yoast SEO 플러그인이 포함된 Twitter 관련 옵션 페이지를 엽니다.

Twitter 카드 메타데이터 추가 슬라이더가 활성화 위치에 있는지 확인하고 드롭다운 목록에서 사용하려는 카드 유형을 선택합니다. 이 단계를 완료한 후 변경 사항 저장 버튼을 다시 눌러 옵션을 저장하세요.

마지막 단계는 사이트의 사용자 계정에 Twitter 사용자 이름을 추가하는 것입니다. WordPress 대시보드의 사용자 => 프로필 관리 메뉴를 통해 이를 수행할 수 있습니다. For Twitter Cards Meta 제목이 보일 때까지 사용자 프로필 페이지를 아래로 스크롤합니다. 제공된 필드에 Twitter 사용자 이름을 추가할 수 있습니다. 변경 사항을 올바르게 저장하려면 프로필 업데이트 버튼을 클릭하십시오.

JM 트위터 카드 플러그인

JM 트위터 카드
이미지 출처: 스크린샷 – WordPress.org

JM Twitter Cards는 Twitter 카드를 WordPress 웹사이트에 쉽게 통합할 수 있는 또 다른 플러그인입니다. 모든 카드 유형을 지원하며 Yoast SEO와 충돌하지 않습니다. 이를 통해 Twitter 카드 요구 사항에 이 플러그인을 사용하려는 경우 다른 Yoast 기능을 계속 사용할 수 있습니다.

플러그인을 활성화하면 JM Twitter Cards를 클릭하여 WordPress 대시보드의 옵션 페이지를 방문할 수 있습니다. Twitter 사용자 이름, 카드 유형, 이미지 크기 등 요청된 세부 정보를 입력하기만 하면 됩니다. 이제 게시물 이미지가 없는 경우 표시될 대체 이미지를 업로드하세요.

또한 Google Play , Apple Store 등 다양한 모바일 기기 스토어에 연결되는 추가 데이터를 제공할 수도 있습니다. 이를 통해 공유되는 콘텐츠와 연결될 수 있는 앱을 자체적으로 홍보할 수 있습니다. 옵션 페이지 상단에 있는 게시물 유형 탭을 사용하면 게시물, 페이지 및/또는 첨부 파일이 게시물별로 각 Twitter 카드를 추가로 사용자 정의할 수 있는 기회를 제공할지 여부를 선택할 수 있습니다.

플러그인 없이 Twitter 카드 추가

테마 개발자와 일부 코드를 직접 사용하고 싶은 사람들은 트위터 카드를 WordPress 테마에 비교적 쉽게 구현할 수 있습니다. 활성화한 특정 테마의 하위 테마를 사용하여 단순히 function.php 파일에 다음 코드를 추가하세요:

함수 my_twitter_cards() {
    if (is_singular()) {
        전역 $포스트;
	$twitter_user = str_replace('@', '', get_the_author_meta('twitter'));
	$twitter_url = get_permalink();
	$twitter_title = get_the_title();
	$twitter_excerpt = get_the_excerpt();
	$twittercard_image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'full');
	$twittercard_thumb = $twittercard_image[0];
	if (!$twittercard_thumb) {
	    $twittercard_thumb = 'https://www.example.com/default-image.png';
	}
	if ($twitter_user) {
	    echo '<meta name="twitter:creator" value="@' . esc_attr($twitter_user) . '" />' . "\N";
	}
	echo '<meta name="twitter:card" value="summary" />' . "\N";
	echo '<meta name="twitter:url" value="' . esc_url($twitter_url) . '" />' . "\N";
	echo '<meta name="twitter:title" value="' . esc_attr($twitter_title) . '" />' . "\N";
	echo '<meta name="twitter:description" value="' . esc_attr($twitter_excerpt) . '" />' . "\N";
	echo '<meta name="twitter:image" value="' . esc_url($twittercard_thumb) . '" />' . "\N";
	echo '<meta name="twitter:site" value="@mhthemes" />' . "\N";
    }
}
add_action('wp_head', 'my_twitter_cards');

여기서 우리가 한 일은 my_twitter_cards 라는 PHP 함수를 생성한 것뿐입니다. 이 함수는 wp_head 작업에 연결되어 있으며 현재 보고 있는 게시물의 일부 데이터를 일부 PHP 변수에 할당합니다. $twitter_user 값을 개인 요구에 맞게 변경하고 $twittercard_thumb 에 대한 대체 이미지 URL을 제공하는 것을 잊지 마세요. 이 데이터는 게시물의 메타데이터 로 사용됩니다. Twitter 카드가 검색하여 화면에 표시하는 것은 바로 이 데이터입니다.

URL 확인 중

WordPress 웹사이트나 블로그에 Twitter 카드를 구현하기 위해 위 옵션 중 하나를 수행한 후에는 Twitter에 공유할 수 있는 게시물 URL 중 하나의 유효성을 테스트해야 합니다. 이렇게 하면 Twitter 카드 기능이 올바르게 구현되었고 예상대로 WordPress 웹사이트에서 올바르게 작동하는지 확인할 수 있습니다.

어떤 경우에는 선택한 카드 유형에 따라 도메인이 자동으로 허용 목록 에 추가됩니다. 그렇기 때문에 이 검증 프로세스를 수행하는 것이 좋습니다. 게시물 중 하나의 URL을 복사하여 Twitter 카드 검사기에 붙여넣으면 됩니다. 검증이 완료되면 특정 게시물이 트위터에 공유된 후 어떻게 표시되는지 미리 볼 수 있습니다. 이제 Twitter 카드를 사용하고 콘텐츠를 전 세계와 공유할 준비가 되었습니다!

ClickWhale - 워드프레스 링크 관리자