fix: add missing image open graph tags (#53)

byCedric · Oct 17, 2018 · 34686cd · 34686cd
1 parent 7b1a392
commit 34686cd
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 6 deletions.
diff --git a/public/index.html b/public/index.html
@@ -6,11 +6,14 @@
 		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 		<meta name="theme-color" content="#000000">
 
-		<meta property="og:type" content="profile" />
-		<meta property="og:url" content="%PUBLIC_URL%" />
-		<meta property="og:title" content="%REACT_APP_GITHUB_USERNAME%" />
-		<meta property="og:image" content="https://github.com/%REACT_APP_GITHUB_USERNAME%.png" />
-		<meta property="profile:username" content="%REACT_APP_GITHUB_USERNAME%" />
+		<meta property="og:type" content="profile">
+		<meta property="og:url" content="%PUBLIC_URL%">
+		<meta property="og:title" content="%REACT_APP_GITHUB_USERNAME%">
+		<meta property="og:image" content="https://github.com/%REACT_APP_GITHUB_USERNAME%.png?size=240">
+		<meta property="og:image:width" content="240">
+		<meta property="og:image:height" content="240">
+		<meta property="og:image:type" content="image/png">
+		<meta property="profile:username" content="%REACT_APP_GITHUB_USERNAME%">
 
 		<!--
 			manifest.json provides metadata used when your web app is added to the

diff --git a/src/molecules/user/user-meta.js b/src/molecules/user/user-meta.js
@@ -23,7 +23,7 @@ export default function UserMoleculeMeta(props) {
 			<meta name="keywords" content={keywords.join(', ')} />
 			<meta property="og:title" content={title} />
 			<meta property="og:description" content={props.description} />
-			<meta property="og:image" content={props.avatarUrl} />
+			<meta property="og:image" content={`${props.avatarUrl}?size=240`} />
 			<meta property="profile:username" content={props.username} />
 			<meta property="profile:first_name" content={nameFirst} />
 			<meta property="profile:last_name" content={nameLast} />