Introducing the Facebook Custom Tab Generator
R.J. LaCount Apr 20 2012
Custom tabs on Facebook Pages allow us to display our own HTML content inside Facebook Pages by embedding code in iframes. This is done by creating a Facebook app and providing a few parameters (like the URL where our custom HTML page is located). Here’s an example of a custom tab:
Add a Custom Tab to your Facebook Page
Have you tried to add a Custom Tab Application to your Facebook Page lately? It seems impossible with the Facebook Timeline changes.
Before Timeline, every app used an App Profile Page. This was a confusing process because every Facebook Custom Tab forced Facebook to create these App Profile Pages, which were unique URLs inside Facebook that no one visited. Since Facebook didn’t want thousands of App Profile Pages, they removed the process.
Unfortunately, this also removed a convenient button on App Profile Pages that allowed us to add our apps as a custom tab on any Page we admin.
Facebook’s solution to add apps to Pages is to visit this URL, replacing the all-caps values with your app’s info:
At this custom URL you’ll get a drop-down list of all the pages you admin and you can add your app to any of them.
So, that works. Why do I need the Custom Tab Generator?
Because simple tools are awesome. A couple big input fields are much easier to deal with than remembering a complicated URL or changing sections of a bookmark every time you want to use it. So here it is:
Will generate this:
I originally created the tool for myself; In fact, I’ve already used it several times from the time I built it and the time this post went live. I’m excited to share it with you now, and hopefully it is as useful to you as it will be for me.
If you like the Facebook Custom Tab Generator, a share would be much appreciated. Let us know what you think in the comments below!
R.J. brings several years of web design and front-end development experience to Portent. His attention to detail borders on neurosis and he always takes care to create pixel-perfect websites for clients. Read More