The whole Meteor and SEO subject has been described by many as a world of pain with occasional rays of hope on the horizon. A quick google search yields these types of responses:
Manuel Schoebel dove into the issue almost two years ago but we found that most of this stuff is a bit outdated.
I assume at this point you understand the nature of SEO problems in Meteor apps due to the dynammic nature of the applications. If you don’t, you might want to start here.
We had to set up some SEO jazz + support for Facebook’s Open Graph tags (so you get nice previews of your pages on FB) and found the reality of Meteor SEO to be pretty straighforward and not so grim at all. Here’s how (you can also just jump right in).
Setup
For our particular case, we were dealing with the following setup:
- Iron Router for routing
- Blaze for rendering
- Deployment to Heroku using Jordan Sissel’s buildpack
Step 1: Phantomjs
You will need Phantomjs installed on your server to make sure your app can render client views server side.
For usage with Heroku, we’ve ended up extending the buildpack to enable Phantomjs installation and cofiguration. Adding support for phantomjs to the current buildpack is fairly straightforward.
Note: if you use Meteor up for deployment, you get Phantomjs by default
Step 2: Spiderable
To tell Meteor that you want it to respond to requests from Google and Facebook bots in a friendly way, you will need to add spiderable module to your application
Step 3: Meta tags
To make sure meta tags on your pages are set accordingly, update them like so (Iron Router + Blaze in our case):
DocHead comes from the package made by good people from Kadira. It seems to be the best maintained package for manipulating document head section in Meteor.
Step 4: Deploy and check
Once the app is deployed, you can confirm that it is being rendered correctly for the Google and Facebook bots by appending escaped_fragment= query parameter to your url.
If everything went OK, you should see your page rendered properly with all the html and meta tags set properly. Facebook has a handy tool allowing you to check how your links look on their site.
Resources
- Example App
- Meteor and SEO by Manuel Schoebel
- How bad is Meteorjs for an SEO on Quora
- Spiderable on Meteorpedia
- Open Graph Object Debugger