Take the 2-minute tour ×

I have been searching for a few days now trying to figure out a clean way to handle the updating of Facebook metadata ie: og:title, og:description with AJAX loaded articles and I keep coming up short.

I have a news.php page on site I am developing that has a list of articles on the left. When A user clicks a link it loads the appropriate article .php page into a div on the right. Everything functions as it should and the content for each respective article is loaded correctly. I am including an with the Facebook like button on each ajax loaded page. When a user clicks the like button on one of articles it links to the news.php and loads the article.

The issue is the metadata remains the same regardless of what article the user likes, this being because Facebook scrapes the html that was loaded on the news.php page. My question is, what is the best way to manipulate metadata when a new page is loaded into the existing news.php page? I need to display the appropriate title and description for each article instead the the default data loaded on the news.php page. Any suggestions? Thanks!

share|improve this question
You'll need to set the meta tags on the server side so that when a client requests the page (such as the Facebook scraper) the correct meta tags are visible. Facebook's scraper presumably won't run javascript which is why the meta tags must already be set when the page is first requested. –  Peter Horne Nov 6 '11 at 16:26

1 Answer 1

Our solution involved modifying our header code, so that if an article_id was sent as a parameter we looked up the article in the database in order to get the title and other OG attributes we wanted to include. This means that when a user opens an article (and it's loaded using AJAX), the attributes won't be updated. However, if they Like the article and the Facebook linter looks at (for example) www.yoursite.com/?article_id=123, the correct OG metadata will be loaded as part of the page.

share|improve this answer

Your Answer


