How to create a “pretty” link to your Facebook profile. (Advanced tip/trick)

Have you actually tried to memorize your Facebook profile ID?  Sheesh, it’s tough to remember and even more difficult to dictate it to someone or to put it on a business card.

I first saw the concept of a "pretty" Facebook link on Mari Smith’s (@marismith on Twitter) business card.  She uses http://www.marismith.com/facebook as her link.  This will shoot you directly to her Facebook profile.  No clunky ID’s to remember or even see.

My pretty Facebook link is:
http://www.jpluna.com/facebook

This trick/tip requires:

  • Access to a web hosting account
  • Privileges to create and save a Web page from scratch
  • Privileges to create a new directory (folder) on your web hosting account
  • Some HTML knowledge, although I’ll provide the majority of the HTML code

STEP ONE – Get your FaceBook profile link:

Find your Facebook profile link.Your link will look something like: http://www.facebook.com/profile.php?id=750920010. That’s my “ugly” Facebook link.

STEP TWO – Create new directory:

Decide what you want your link to look like. If your Web site or blog is at www.yourblog.com you may want to set the link to be www.yourblog.com/facebook. Or if your domain is fairly long, you can use "fb" at the end instead of "facebook"
to save on space. Remember, you may want to put this new link on your business
card as well, so link length is an issue.

Now, create the new directory (folder) on your Web host root directory and name it "facebook" or "fb" if you go for the super short format.

STEP THREE – Create new HTML page:

Create a new HTML page. You can use Notepad for this on a PC or TextEdit on a Mac. I use a PC so I just open the new file, and type in the basic HTML document tags (html, head, body and their close tags).

In the Head section of the HTML file (between the "<head>" and "</head>" tags), add in code to do a "Meta Refresh" redirect to your regular FaceBook Profile page.

The code will now look like:

Facebook Pretty Link Code

Facebook Pretty Link Code

The Meta tag has a http-equiv attribute and in this case it is set to "Refresh." There is also a "content" tag, that tells the page how long to work before trying to redirect to the new page. The last attribute is "URL." This dictates where the link will go to.

STEP FOUR – SAVE:

You are now ready to save your Notepad or TexEdit Web page. Save the file as index.htm. Make sure the "Save File As" dropdown box shows "All Files." If you don’t check that then you may end up saving the page as index.htm.txt and that won’t work.

FIVE – PUBLISH:

Once this file is saved, copy it up to your Web server under the "facebook" or "fb" directory you created in Step Two and you are all set.

STEP SIX – TEST!:

Go ahead and test out your new link and see if it goes to your Facebook profile. If you need help, post a comment and I’ll help you troubleshoot.

This entry was posted in PRO_TIP, Social, Web/Tech and tagged , , , . Bookmark the permalink.

4 Responses to How to create a “pretty” link to your Facebook profile. (Advanced tip/trick)

  1. Kyle Reddoch says:

    This is a great way to link to facebook. There is also another great way using http://profile.to. You setup a url (for instance my is http://profile.to/kylereddoch) and it will take you directly to your facebook page.

    Thanks for the tip!

  2. Talina says:

    To you knowledge does this trick not work with certain hosting companies or something? We are trying it on http://www.yogabodynutrition.com/facebook/ but even with the file extension saved as .htm or .html it still displays the html on the page when loaded instead of redirecting. So puzzled.

    • Jesse Luna says:

      Hi Talina,

      It looks like you used an HTML editor and added the HTML code to the front end design, not the HTML “backend” code.

      If you use a text editor (I use PCs so I use Notepad) and paste the code that you used into the document and save as “index.htm” then things should work.

      Let me know how things work out. You can also reach me on Twitter – @jesseluna.

      -Cheers,

      Jesse Luna

  3. Kamuran says:

    Would this work with open open source CMSs (joomla ect.) as well?

Leave a Reply

Your email address will not be published. Required fields are marked *