[깃허브 예제] head 부분/ og, twitter:card/ 외부에 정보를 전달하기

자바칩 프라푸치노 2021. 4. 21. 07:53

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>GitHub</title>

    <meta name="author" content="javachip">
    <meta name="description" content="GitHub is where people build software. More than 31 million people use GitHub to discover, fork, and contribute to over 100 million projects.">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, maximum-scale=1, minimum-scale=1">
    
    <!-- og:Open Graph 다른 사이트에 여기에 대한 정보를 제공한다. -->
    <meta property="og:type" content="website">
    <meta property="og:site_name" content="GitHub">
    <meta property="og:title" content="Build software better, together">
    <meta property="og:description" content="GitHub clone coding / GitHub is where people build software. More than 31 million people use GitHub to discover, fork, and contribute to over 100 million projects.">
    <meta property="og:image" content="img/logo__github.png">
    <meta property="og:url" content="https://github.com">

    <!-- twitter card  -->
    <meta property="twitter:card" content="summary">
    <meta property="twitter:site" content="GitHub">
    <meta property="twitter:title" content="Build software better, together">
    <meta property="twitter:description" content="GitHub clone coding / GitHub is where people build software. More than 31 million people use GitHub to discover, fork, and contribute to over 100 million projects.">
    <meta property="twitter:image" content="img/logo__github.png">
    <meta property="twitter:url" content="https://github.com">
</head>
<body>
    
</body>
</html>

오픈그래프와 트위터카드는 다른 사이트에서 공유가 될때 어떤 사이트인지 알려주는 역할을 한다.

http://ogp.me/

Open Graph protocol

The Open Graph protocol enables any web page to become a rich object in a social graph.

ogp.me

https://developer.twitter.com/en/docs/tweets/optimize-with-cards/guides/getting-started.html

Getting started with Cards

By using Twitter’s services you agree to our Cookies Use. We use cookies for purposes including analytics, personalisation, and ads.

developer.twitter.com

728x90

저작자표시 비영리 변경금지 (새창열림)