Engineer
Engineer

Reputation: 48813

Open Graph meta tags do not work as expected

Our website contains single image pages. To achieve beautiful image views on social networks, I have setup almost all the neccessary OpenGraph's (og:) meta tags. Here they are:

<title>Some title</title>
<meta name="description" content="Some description">
<meta property="og:site_name" content="CompanyName">            
<meta property="og:title" content="Photo by @someuser">                
<meta property="og:image" content="https://cdn.companydomain.com/209114427002202.jpg">    
<meta name="medium" content="image">                    
<meta property="og:type" content="mycompanynamespace:photo">
<meta property="og:description" content="Some slogan">            
<meta property="fb:app_id" content="108569252539534">                
<meta property="og:url" content="https://companydomain.com/image/2030203020320302">

However it doesn't work as expected. What it shows is just a domain's name:

enter image description here

What I want is to set it to be like Instagram. What's the magic behind the Instagram 'configuration'? And how to set a logo for the right bottom corner?

enter image description here

Upvotes: 1

Views: 3234

Answers (1)

Joel Hernandez
Joel Hernandez

Reputation: 2213

Engineer, you have 2 situations here:

  1. Handling Open Graph Meta Tags: https://stackoverflow.com/a/19313817/854222
  2. Bootstrap Hover Image: https://miketricking.github.io/dist/

You need to be able to handle the meta tags in order to display them using a CSS overlay, like the option #2.

Hope this helps...

Upvotes: 1

Related Questions