In this series on How to Set Up a Facebook Fan Page for Real Estate Associations, Brokerages and Agents, we will discuss the basics on how to set up a Facebook Fan Page.  Here are the topics in this series:

  • How to Set-Up a Basic Facebook Page
  • How to Create Customized Tabs for Facebook Fan Page
  • HTML/FBML Code, Cheap Tricks and Short Cuts, and Other Design Ideas
  • Strategies for Using Facebook Fan Page to Market and Sell Real Estate

In today's installment, we discuss how to create customized tabs.  As discussed in the prior post, Facebook Fan Pages have six tabs with two tabs universally dedicated on every Facebook Fan Page - Wall Tab and Info Tab.

Step 1 - Install Static FBML Application.  Go to Wall Tab.  On left side, click on "Edit Page".  The bottom section is labeled as More Applications.  Click on "Browse More".  On Applications Page, enter "FBML" or "Static FBML" into search box.  The search results should include an application called "Static FBML".  Click on "Static FBML".  On the Static FBML under the Application icon, click on "Add to My Page".  There will then be a pop up showing your Facebook Fan Pages.  Click on the Fan Page upon which you want to install the custom tab.

PREA Signature Realty - Facebook Fan Page Basic Set Up

 

PREA Signature Realty - Facebook Fan Page Basic Set Up

PREA Signature Realty - Facebook Fan Page Basic Set Up

PREA Signature Realty - Facebook Fan Page Basic Set Up

Step 2 - Create Custom Tab.  Go to Wall Tab and click on "Edit Page."  Go the FBML Application.  Click on "Application Settings".  Click on "Tab Available Add."

PREA Signature Realty - Facebook Fan Page Basic Set Up

PREA Signature Realty - Facebook Fan Page Basic Set Up

 

Step 3 - Create the Page Content for the Tab.  Now, click on "Edit".  There will be an elongated rectangular box.  In the first section, enter the name of the custom tab in the "Box Title" section as you want it to appear on the Facebook Fan Page Tab Bar.  In the second section, cut and paste the HTML/FBML code into the box entitled "FBML".

PREA Signature Realty - Facebook Fan Page Basic Set Up

PREA Signature Realty - Facebook Fan Page Basic Set Up

Step 4 - Creating HTML/FBML Code.  There are three divergent methods on how to create the Page Content for the custom Facebook Fan Page Tab.  Here are some of the methods:

  • HTML Code:  If you are an experienced programmer, you simply write the HTML code necessary to create the page content.  For this method, you want to employ a professional such as Mike Mueller on Activerain.  Here is a link to his website describing his custom Facebook Fan Page Business Services.

 

  • HTML Editor:  Use an HTML editor to create the intended design and look and then click on the source code to obtain the HTML code.  NVU is a free and easy to use HTML editor and can be downloaded for free.  Or, if you blog on ActiveRain, use their WYSIWYG editor, save as draft, and then open again click on HTML.  To join ActiveRain under a free membership, click on New Member.  Cut and paste the code into the Static FBNL box.

NVU Editor

  • Design on Screen
PREA Signature Realty - Facebook Fan Page Basic Set Up
  • Click on Source at the bottom of the design screen to obtain HTML code.
PREA Signature Realty - Facebook Fan Page Basic Set Up
  • Cut and paste HTML code.
PREA Signature Realty - Facebook Fan Page Basic Set Up

ActiveRain Blog

  • Design on screen using WYSIWYG editor. 
PREA Signature Realty - Facebook Fan Page Basic Set Up
  • Save as draft.
PREA Signature Realty - Facebook Fan Page Basic Set Up
  • Click on edit to open blog post.  Click on HTML to switch from WYSIWYG editor to HTML editor.  Cut and past HTML code.
PREA Signature Realty - Facebook Fan Page Basic Set Up

 

  • Image Only HTML:  Create your intended content using any program such as Microsoft Publisher.  Use a screen image capture service like the free Snagit Editor to capture the image and then save the image as a .jpg file.  Upload the jpg file into a free photo hosting service like Photobucket.  Edit the photo to create an image a maximum of 760 pixels wide.  Cut and paste the HTML code from the photo hosting service into the Static FBML box.
  • Create item.  Use screen capture like Snagit to capture the image.  Save as a .jpg.
PREA Signature Realty - Facebook Fan Page Basic Set Up
  • Upload .jpg file to Photobucket.  Cut and paste HTML code for image.

PREA Signature Realty - Facebook Fan Page Basic Set Up

To see a recent Facebook Fan Page set up for the Metropolitan St. Louis Chapter of the Women's Counsel of Realtors using all of the methods described above, click on:  WCR-St. Louis Fan Page.  It is still a work in process but you will get some ideas.

In the next post, we will discuss how to create more specialized boxes and tabs using simple HTML code.

For more information on how to create your customized Fan Page, contact Ryan Shaughnessy at PREA Signature Realty at 314-971-4381.  Or, visit www.PREASignatureRealty.com and click on the "Technology Toolbox."

 

 

________________________________________________________________________________________________

PREA SIGNATURE REALTY

Download Property BrochuresView Our Listing PresentationWatch Our Property Videos on YouTube

PREA Signature Realty is a full service brokerage located at 1709 Park Avenue in the Lafayette Square neighborhood of the City of St. Louis.  PREA Signature proudly serves the following city neighborhoods:  Lafayette Square, Soulard, Benton Park, Benton Park West, Downtown Loft District, Forest Park Southwest, Central West End, Tower Grove East, Tower Grove South, Compton Heights, Shaw, The Hill, Dogtown, Carondelet, Holly Hills, St. Louis Hills, Dutchtown, and the Other Historic Neighborhoods of the City of Saint Louis, Missouri. 

The opinions expressed herein represent the opinions of the author only and do not reflect the opinions of PREA Signature Realty.  All photos and written content were produced by PREA Signature Realty.  All Rights Reserved - PREA Signature Realty (2009).  This content may not be reproduced or reprinted, except for Active Rain re-blogging, without express written permission of PREA Signature Realty.

For more information, visit our website at www.PREASignatureRealty.com or contact Ryan Shaughnessy at 314-971-4381 or send an email to Ryan@PREASignatureRealty.com. 

 
This post has been included in Missouri Real Estate News
Post is included in group: Facebook Tips
Post is included in group: Rainer's Women's Council of Realtors
Post is included in group: Real Estate Technology
Post is included in group: FREEDOM Office: Professionals Working from Home
Post is included in group: The Art Of Marketing You

19 Comments on Real Estate Technology - Facebook Fan Page Series - Creating Your Facebook Fan Page - Creating a Custom Facebook Fan Page Tab

DEC
09
2009
795,614 Points 5 Featured Posts Outside Blog Attended Rain Camp Called Shot Master

Thanks for the info, I'm going to rest up and hopefully be energized to do this tomorrow.
12:54am • #1
226,807 Points 25 Featured Posts

Michelle - I hope you check out the entire series - three post written with two posts to go.
12:58am • #2
267,808 Points

Thanks for sharing - I really need all the help that I can get with Facebook!
4:08am • #3
283,478 Points 75 Featured Posts Outside Blog Called Shot Master

garaughty, blog design, graphics, marketing, wordpress

 hi Ryan, excellent tutorial, thx for adding it to the group!
10:38am • #4
226,807 Points 25 Featured Posts

Marti - Thanks for the "sharp cookie" feature.  It is going to be a six post series and one acid tongue rant on how this post got censored and banned from NAR's LinkedIn Group.
11:04am • #5

I bookmarked it for when I get my fan page going.  Sounds great, but I need to get the basics before I can fully comprehend why it's needed.
12:08pm • #6
226,807 Points 25 Featured Posts

Jill - We will discuss strategies on how to use in the final post.
2:22pm • #7
DEC
13
2009
235,053 Points Outside Blog

How do you guys come up with all this stuff.  It is just amazing.
7:09pm • #8
DEC
16
2009
226,807 Points 25 Featured Posts

Gene - We talk about the projects that we are working on and often find that there are others working on the same or similar projects.
8:03pm • #9
DEC
17
2009
226,241 Points Outside Blog Attended Rain Camp

Once again Wow, I just started using Static FBML, Thanks for the info getting Html codes/editor, now off to work on my pages.
11:59pm • #10
DEC
18
2009
226,807 Points 25 Featured Posts

Eva - Take a look at the final two posts... There are some ideas and HTML codes in the last 2 posts of the series.
12:25am • #11
DEC
20
2009

I was at a meeting recently and saw one office that had an agent roster on their fanpage.  Since then, I've been adamant that I was going to figure out how to do that for our office and was ecstatic when I found your post.

 I got the FBML tab going, downloaded Nvu and created the table with all necessary info.  I got the code, pasted it in the html box and...nothing.  I feel like I'm missing something here.  Why isn't my code working properly within the tab?  It would post to craigslist, but nothing would show up with the code in my activerain blog. 

 
11:00pm • #12
226,807 Points 25 Featured Posts

Amanda - I'm leaving town for the holidays.  However, you have to delete the header codes on the HTML and post only <body> to <body>.  Here is some info on what you may need to do to edit the HTML code produced by NVU's html editor:

 

* You CANNOT auto-run JavaScript in an FBML page – it must require a user action; you can also use FBJS (Facebook JavaScript);

* You SHOULD NOT use a tag — it works in most browsers, but NOT in Internet Explorer (of course); you can, however call an external style sheet via <link href="”http://yoursite.com/styles/layout.css”" mce_href="”http://yoursite.com/styles/layout.css”" rel=”stylesheet” type=”text/css” /> (Read this post about the difference between Internet Explorer and other browsers regarding Static FBML and CSS…);

* Maximum width of FBML page is 760px (However, Facebook has announced this will be reduced to 520px in later 2009/early 2010.);

* Include ONLY the HTML/CSS that’s between the <body> and </body> tags; NO <html>, <body>, <head> or meta tags;  [This was the culprit for me when I cut and paste]

 
11:40pm • #13
DEC
21
2009
474,879 Points 15 Featured Posts Outside Blog Called Shot Master

Ryan - thanks for some terrific information.  Just curious, are you allowed to add more than one FBML page?  I tried and it didn't seem to work.  I have a "Stanton Homes" fanpage.
6:02am • #14
DEC
23
2009

THANK YOU, RYAN! I reduced the table to 520 pixels and only pasted the code between <body> & </body> and it worked great! 

And I have come to find out that the inspiration page I saw was only pictures OF their agents linked back to a photobucket account.  Now we have a functional table with links back to our agents websites. :) That's always good. 

Thanks again, Ryan!
10:18am • #15

As far as adding a second FBML tab - it's a little bit tricky, but can be done!  At the bottom of your first page (under the content field) it will say "Add another" FBML tab.  Click that, then click the "edit" link that appears next to it. 

For me, it then showed up in my "Boxes" tab, then I had to click the Edit icon, change it to "Show in Wall tabs" THEN click the >> button to add the new tab. (This is because I forgot that you can just edit your page and change it in the Application Settings.)

Hope that helps while the guru is on holiday.  ;)
11:09am • #16
JAN
04
2010
179,293 Points 2 Featured Posts Attended Rain Camp

Thanks for providing the steps to create a custom tab on FB!  It was just what I was looking for!  See my results, www.facebook.com/edmondrealtor
9:33pm • #17
JAN
05
2010
226,807 Points 25 Featured Posts

Penny - Yes - You can add more than 1 static FBML page.  I have 6 or so on my facebook fan pages.  It does cap out - I think the max is 10 FBML pages.

Amanda - Described it exactly as it works.

Kristyn - You have a great fan page - definitely have a better eye for design and layout than me.
7:03pm • #18
NOV
13
2010

wow.. I am saving this information. great stuff!
5:02pm • #19

Login or register to leave a comment
 
Ambassador_large

Ryan Shaughnessy, Broker/Attorney - Your Lafayette Square Real Estate Partner

Saint Louis, MO

More about me…

PREA Signature Realty - www.preasignaturerealty.com

Address: 1709 Park Avenue, Saint Louis, MO, 63104

Office Phone: (314) 397-3182

Cell Phone: (314) 971-4381

Email Me

A Blog for New Home & Other Sales Professionals and for Sellers and Buyers Interested in City Living PREA Signature Realty proudly serves the communities of Lafayette Square, Soulard, Benton Park, Benton Park West, Downtown Loft District, Forest Park Southwest, Central West End, Tower Grove East, Tower Grove South, Compton Heights, Shaw, The Hill, Dogtown, Carondelet, Holly Hills, St. Louis Hills, Dutchtown, and the Other Historic Neighborhoods of the City of Saint Louis, Missouri.

View Ryan Shaughnessy's profile on LinkedIn


twitstamp.com
Ryan Shaughnessy's Facebook profile



Links

Archives

RSS 2.0 Feed for this blog