When I add a link to my website (rainscapes.com) to Facebook it allows me to choose a thumbnail. However the problem is that I used CSS to replace an H1 tag of the company name and used text-indent and a background image for the logo. So Facebook only sees the images in the body of the page. I tried to fix this with a workaround by adding an additional image of the logo and using absolute positioning to situate it directly on top of the background image of the logo, but Facebook will not recognize it at all.
Why does this happen, and how can I fix this?
Thanks for anyones help in advance!
I did save out a smaller cropped version of the logo and that was included with the img src tag inside a div that has the id logo-fix. Check out the source code and the CSS to see the smaller version of the logo. The logo fix image should not exceed the image width max for Facebook.
I have already used absolute positioning to insert an image as opposed to a background image like on the H1 tag. The actual location of the absolute positioning of that image should not matter. But, in short, the image is there and it does not offer that logo image as a thumbnail option for the link when added to Facebook.
Hmm, maybe you could just place it at the end of the code and abs pos it off the page? Don’t know if that has any negative effect on search engines, though. Also don’t know if it would work.
I have no idea about this, but does Fb have a limit on the dimensions of images? I mean, your logo is quite wide, so wouldn’t fit well in that box. Perhaps if you had a cropped version? Don’t know, just clutching at straws.