Tuesday Tech Tip: Tailoring Your Webpage For Social Media

A good social media strategy is more than how to use Twitter and Facebook; a good social media strategy involves integration. And having the little F logo on your webpage linking to your Facebook page isn’t enough, either. You need to code your page for social media.

Think of images that Facebook chooses when you post a link. Sometimes the image you want to display appears automatically; sometimes you have to flip through a few options; and sometimes there’s nothing to choose from. But you can control all this!

What do I mean? First, take a look at the Facebook debugger http://developers.facebook.com/tools/debug.

Using this page as an example (which is managed through WordPress), I entered newmedianook.wordpress.com

Facebook Debugger gave me the following:

fb:app_id:

249643311490

og:url:

https://newmedianook.wordpress.com/

og:type:

article

og:title:

New Media Nook

og:image:

Description: http://external.ak.fbcdn.net/safe_image.php?d=AQBb6Ocl1aqN6690&url=http%3A%2F%2Fnewmedianook.files.wordpress.com%2F2012%2F09%2Fkeyboard.jpg

og:description:

A fine WordPress.com site

og:site_name:

New Media Nook

og:updated_time:

1359520388

As you can see, Facebook knows that this is a blog, WordPress gave the description “A fine WordPress.com site,” and Facebook knows which image to use as well.

So how does Facebook know all this? It’s in the code!

<meta property="og:type" content="blog" />
<meta property="og:title" content="New Media Nook" />
<meta property="og:description" content="A fine WordPress.com site" />
<meta property="og:url" content="https://newmedianook.wordpress.com/" />
<meta property="og:site_name" content="New Media Nook" />
<meta property="og:image" content="http://sample.com/my.jpg" />

An alternative for the meta code for the image is to just link it like so:

<link rel="image_src" href="http://www.newmedianook.com/MyImage.jpg"/>

And voilà! Now when people post your link, all your information will automatically populate.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s