7 {{ upvoteCount | shortNum }}
7 {{ upvoteCount | shortNum }}

How to define which image on a webpage should be shared on facebook?

by storhatt
6 replies
As I understand it if I want to include a an image in a facebook share I among other things define the open graph property og:image in the page header:

Code:
<meta property="og:image" content="http://mydomain.info/myimage.jpg" />
Now the thing that I dont understand: How could different sharebuttons be associated to and share different images on the same page if og:image property is only defined for the topmost image? Any suggestions?
#define #facebook #image #shared #webpage
  • Profile picture of the author BranTheMan
    Code:
    <meta property="og:image" content="http://mydomain.info/myimage.jpg" />
    ^ well you can remove this code entirely if you would like and the Facebook share would display the first image that is on your site.


    Code:
    <meta property="og:image" content="http://mydomain.info/myimage2-2-2-2-2-2-2.jpg]" />
    ^ you can change this to show any specific photo you want in the FB share just by switching the the name to another photo in your sites directory.



    Code:
    <meta property="og:title" content="Rock"/>
<meta property="og:type" content="movie"/>
<meta property="og:url" content="http://www.imdb.com/title/opewwdug/"/>
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
    ^ you can change this to show different images based on keywords of the image.


    Maybe I don't fully understand your question... Would you mind elaborating a little more on what exactly is was that you are asking? I have had a lot of trouble with this stuff in the past, so I have quite a bit of experience with it.
    Signature
    Buyral Media Web Marketing Services.
    {{ DiscussionBoard.errors[10155855].message }}
    • Profile picture of the author storhatt
      I got facebook share to include images I used open graph tags as you suggested.

      I have two problems remaining:

      1) If I have a new post, that has been shared zero times, fist time that I click on sharebutton image is not inluded in the share. Sometimes second time does not work eighter. After that image gets included correctly. I guess facebook reads the image from their share cache after first time.

      2) If a user clicks the share button the number of shares gets incremented by one, regardless if the users acctually share anything or if he/she presses cancel. So the number of shares presented on the page is the number of times sharebutton has been clicked, and not the number of acctual shares that has been made.

      Any suggestion or ideas what to do with the above problems?
      {{ DiscussionBoard.errors[10159501].message }}
      • Profile picture of the author Teesane
        Originally Posted by storhatt View Post


        1) If I have a new post, that has been shared zero times, fist time that I click on sharebutton image is not inluded in the share. Sometimes second time does not work eighter. After that image gets included correctly. I guess facebook reads the image from their
        I think I can solve this issue for you. Once you make a change to your open graph code, go to the Facebook Debugger Tool, enter the URL of the page, and click fetch data at least three or four times.

        It will force Facebook to immediately re-cache your page and provide the correct information when shared. I find that title and description changes will update with one fetch refresh, but images may take three or four.

        https://developers.facebook.com/tools/debug/
        Signature
        Lower Pricing than Teespring. Make More Per Campaign.
        {{ DiscussionBoard.errors[10160294].message }}
        • Profile picture of the author storhatt
          I have solved the first problem. There is no need to use the facebook debugger. If you set width and height for the image by open graph tags og:image:height and og:image:width it will work from the first time you share.
          {{ DiscussionBoard.errors[10161974].message }}
  • Profile picture of the author ErickShawn
    One thing that I have observed,
    When you enter a link in a post on Facebook, it ask for suggestions if there are more than one images available. You can also an image from them.
    {{ DiscussionBoard.errors[10160784].message }}
  • Profile picture of the author WinstonCarter
    Banned
    wow, learned something new today, didn't know we could do that with coding, thanks fellas
    {{ DiscussionBoard.errors[10162933].message }}

Trending Topics