Invisible Icon for Facebook Thumbnails
Found a neat tutorial at justintadlock.com that shows how to use custom fields to add images to posts. I modified the instructions a bit for my needs, so that a nifty icon is inserted into the beginning of all “single.php” posts. When I set my custom key, “Thumbnail Class” to a value of “invisible,” the icon is assigned a CSS class with the property “display: none.” This tells the icon to load in the html source code but not to show up and not to take up space. So it’s there, but doesn’t render on the screen at all.
So what’s the point then? Well, when I past a link for a single blog post into Facebook, the Facebook script sees the invisible icon in the html source code and uses it as a thumbnail. It makes the Facebook post look cool and also is much more eye-catching.
Update: I figured out an easier way, though a bit more kludgy.
<img style="display: none;" src="/path/image.jpg">
Stupid simple. Just paste this in the source code of your post.