Search code examples
htmlfacebooktwitter-bootstrapmetahead

HTML confuses my head


When I copy-paste the URL of my site in the chat in Facebook, I am getting a preview that says: Grid Template for Boostrap.

But no...my site uses Boostrap, but its content is about football!

Here is what I have in the head:

<meta charset=utf-8>
<meta http-equiv=X-UA-Compatible content="IE=edge">
<meta name=viewport content="width=device-width, initial-scale=1">
<meta name=description content="Scout the opponent team!">
<meta name=author content="G. Samaras">
<link rel=icon href=img/favicon.ico>
<title>Cage Scouter</title>
<link rel=stylesheet href=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css integrity="sha512-dTfge/zgoMYpP7QbHy4gWMEGsbsdZeCXz7irItjcC3sPUFtf0kuFbDz/ixG7ArTxmDjLXDmezHubeNikyKGVyQ==" crossorigin=anonymous>
<link rel=stylesheet href=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css integrity=sha384-aUGj/X2zp5rLCbBxumKTCw2Z50WgIr1vs/PFN4praOTvYXWlVyh2UtNUU0KAUhAX crossorigin=anonymous>
<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js></script>
<script src=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js integrity="sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin=anonymous></script>
<meta property="og:site_name" content="Cage Scouter"/>
<meta property="og:title" content="Cage Scouter"/>
<meta property="og:description" content="Scout the opponent team!"/>
<meta property="og:image" content="img/favicon.ico">
<meta property="og:url" content="http://cgi.di.uoa.gr/~std10093/test/scouter/index.php">
<meta property="og:type" content="site"/> // not even sure is site is valid. Blog also didn't change anything

Any ideas?

Note how I used meta twice. Initially I had only the first set of them, but got the same result!


Solution

  • The developer should scrape for new changes at the Facebook OG Debugger.