Skip to content

Instantly share code, notes, and snippets.

@QROkes
Last active August 21, 2020 23:46
Show Gist options
  • Save QROkes/530eb31dbd764fbd7d61 to your computer and use it in GitHub Desktop.
Save QROkes/530eb31dbd764fbd7d61 to your computer and use it in GitHub Desktop.
HTML Head metatags with OpenGraph (Facebook & Twitter)
<html lang="es-MX" xmlns:fb="http://ogp.me/ns/fb#" prefix="og: http://ogp.me/ns#"/>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Titulo de la página</title>
<meta name="description" content="Descripción de la página"/>
<link rel="canonical" href="http://mydomain.com/pagina" />
<meta name="robots" content="index,follow" />
<meta name="googlebot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1" />
<meta name="bingbot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1" />
<!-- OpenGraph metadata-->
<meta property="og:locale" content="es_LA" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Titulo de la página" />
<meta property="og:description" content="Tu descripción" />
<meta property="og:url" content="http://mydomain.com/pagina" />
<meta property="og:site_name" content="Nombre del sitio" />
<meta property="og:image" content="http://mydomain.com/image.png" />
<meta property='fb:admins' content='FB-AppID'/>
<meta name="twitter:card" content="summary"/>
<meta name="twitter:description" content="Tu descripción"/>
<meta name="twitter:title" content="Titulo de la página"/>
<meta name="twitter:site" content="@Organization"/>
<meta name="twitter:creator" content="@Author"/>
<!-- Favicon -->
<link rel="icon" href="http://mydomain.com/favicon-32x32.png" sizes="32x32" />
<link rel="icon" href="http://mydomain.com/favicon-192x192.png" sizes="192x192" />
<link rel="apple-touch-icon-precomposed" href="http://mydomain.com/favicon-180x180.png">
<meta name="msapplication-TileImage" content="http://mydomain.com/favicon-270x270.png">
<!-- Multi-language support -->
<link rel="alternate" href="http://mydomain.com" hreflang="es" />
<link rel="alternate" href="http://mydomain.com/en/" hreflang="en" />
<meta property="og:locale:alternate" content="en_US" />
<!-- Stylesheet CSS & Fonts-->
<!-- Google Analytics Code -->
</head>
<body>
<!-- HTML Code -->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment