Boosting Your Website with Facebook

Sometimes my head spins with all the options small businesses have for online engagement. At first you had just websites to worry about. Then blogging was all the rage. Now social media has come of age and everyone is telling you to engage with social media, which is why you are reading this book. It can be confusing.

This chapter shows you how to leverage the power of Facebook and your website, which are even more powerful when blended. It is not an either/or proposition: You typically can’t do away with your website and just maintain a Facebook Page. And you can’t afford not to be on Facebook and focus only on your website. This chapter shows you how to encourage customers to engage with your website through Facebook.

Integrating Facebook with Your Blogs and Website

Website versus Facebook-Only Presence

How a Cake Recipe Website Integrates with Facebook

Integrating Facebook with Your Blogs and Website

Your overall online presence is critical and may be the most important part of finding new customers and keeping the ones you have. Word of mouth is important, but in 2012, a business’s online presence is more powerful.

For many businesses, a website is one of the most important tools for forming this online presence. Your website alone is powerful, but what’s even more powerful is integrating Facebook with your blog or website. This integration could be as simple as linking to your website from your Facebook Page or writing on your blog about a photo on your Facebook Page. The integration could be as complicated as enabling your Facebook users to log in to special sections of your website through their Facebook accounts. You could also integrate your blog’s discussion boards with Facebook.

Facebook is a very powerful marketing tool, and smart businesses think of ways to integrate and leverage it with their websites and blogs.

First, here are a few tips from Jeff Bullas, a digital marketing and social media strategies expert. He wrote nine ways to integrate your website and Facebook in his blog, some of his steps include the following:

• Use Facebook to drive traffic to your website and blog (see the J.Crew link in Figure 5.1).

• Use Facebook to drive traffic to the company blog(s) by linking to the article in a Facebook update (see Figure 5.2).

• Link to your other social media sites on your Facebook Page (see Figure 5.3).

5.1 Creating an obvious link back to your website encourages users to click and visit your site.

5.2 Integrating your blog into your Facebook Page encourages more views from visitors and fans.

5.3 You should always provide links to your other social media sites on your Facebook Page.

• Integrate your e-mail sign-up form on your Facebook Page (see Figure 5.4).

• Provide content on your Facebook Page that incentivizes users to visit your blog or website (see Figure 5.5).

• Offer specials on your Facebook store that link to your e-commerce store (see Figure 5.6).

5.4 Inviting visitors to join your e-mail list when they come to your site increases your marketing reach and allows additional interaction with the user.

You can also use apps to more easily manage your e-mail list. One example is ContactMe (www.contactme.com).

5.5 By creating a competition that drives traffic back to your website, you should see a large increase in website traffic.

Facebook has made it easier than ever to implement social media sharing into your website and blog by developing applications and plug-ins that simplify the connection process. By working with a smart web developer, you can now more closely integrate your website content with the world of your Facebook audience.

In July 2008, Facebook launched Facebook Connect, enabling users to interact more deeply with your website or blog. Facebook Connect gave developers a way to integrate the Facebook platform beyond Facebook.com. Essentially, visitors to your website could now log in or sign in to your website by using their Facebook login information. By connecting in this manner, your users had decided to share their personal information directly with your website and make it known to their friends in Facebook that they connected directly with your site.

5.6 Use your Facebook Page to increase sales and drive visitors back to your e-commerce store.

In 2010, Facebook began to transition away from the Facebook Connect brand because underlying technologies are the same regardless of what you are building: apps, websites, or programs on devices. Though most of the Facebook Connect functionality is still available, Facebook has renamed this process Open Graph (see Figure 5.7).

5.7 The Open Graph protocol shares activity richly across Facebook. When someone likes your website by clicking the Like button, that information is instantly shared to the linking Facebook Pages and user Pages.

Connecting your users’ accounts with Facebook accounts

If you want to increase the interaction on your website, you can install the Login plug-in, which allows visitors to log in, or sign in, to your site using their Facebook information. This process pulls the visitors’ information from their Facebook profiles after an authentication process and eliminates the need to complete additional registration forms. You can access the Login plug-in at https://developers.facebook.com/docs/reference/plugins/login.

You have two options to connect your website with users: the original Login button (see Figure 5.8) or the newer Login button with faces. Unlike the original Login button, the newer button shows profile pictures of the user’s friends who have already signed up for your site, in addition to a Login button (see Figure 5.9). While the function of both buttons is the same, those using the new button with faces have a higher conversion rate, so I suggest you use this button on your website, which you do by selecting the Show Faces check box.

To complete the code, choose the width of the plug-in and, if you choose to Show Faces, the maximum rows of photos you want displayed.

5.8 You have two choices of what type of Login button to display. I suggest using the button that shows faces for a higher conversion rate.

5.9 The newer Login with Facebook button with faces allows your visitors to see their friends who have already signed up or registered with your website.

Connecting accounts can be completed when a user logs in to Facebook from your site or accepts a connect invitation request from an already connected friend (see Figure 5.10).

5.10 When visitors sign up on your website through the Login with Facebook app, they are given the opportunity to invite their friends to visit and log in to your site.

Your website and blog are powerful tools for publishing content beyond just selling a product. Working with a developer to leverage the power of Facebook and engage your online visitors where they are already engaged (Facebook) is very compelling.

Authenticating users

When visitors to your website choose to sign up using Login with Facebook, they go through an authentication process. Three things happen in this process:

• Facebook authenticates users to ensure that they are who they say they are.

• Facebook authenticates your website to ensure that the users are giving their information to your site and not to someone else.

• The users must explicitly authorize your website to access their information to ensure that they know what data they are disclosing to your site.

While this may seem like a daunting process, it is not. The user only needs to click a button to go through authentication, and the program running in the background of the application ensures the transfer and authorization of all necessary information.

For example, when visitors come to your website and click Login with Facebook, a dialog box appears requesting their permission to access information (see Figure 5.11). By clicking Allow, the user completes the entire process of authentication and authorization.

5.11 After choosing to log in with Facebook, the user must first allow the site to access certain information to go through the authentication process.

You can show your visitors additional dialog boxes that encourage more interaction after they sign in or register with your website. For example, you can ask them to sign up for daily alerts or newsletters by providing an e-mail address (see Figure 5.12).

5.12 Asking your visitor for an e-mail address for a daily alert or newsletter is an additional way to interact and increase your marketing capability with the user.

Another option is to ask users to invite their Facebook friends to visit your site and register or sign in. With this option, users simply click a friend’s name or multiple friends’ names (see Figure 5.13). After choosing those they want to invite, an invitation is sent directly to the recipient through Facebook (see Figure 5.14). This invitation appears in the News Feed on the recipient’s Page where all of that user’s friends can see the invitation and the link to your website.

5.13 Adding a box that asks users to invite their friends to join your website is a great way to increase your marketing reach.

5.14 An invitation is sent to all recipients chosen with a direct link back to your website.

If the recipient of an invitation has set security settings to disallow this type of posting, the invitation does not appear in his or her News Feed.

Publishing News Feed stories

Publishing News Feed stories is a way to integrate your content across your site and Facebook. It can be a timesaver when updating your online presence, because the content on your website is also published on the web.

One way to publish New Feed stories is through Facebook Connect or Open Graph. Depending on a user’s login state and authorization of Facebook information on your site, there are three possibilities:

• If the user has authorized Facebook and is logged in, you can publish one-line stories automatically, or you can implement feed forms to allow your users to post short or full stories.

• If the user is logged in to Facebook but has not authorized information for your site, an approval message is displayed to the user when your site tries to publish a one-line story. For other story sizes, previews are displayed, which the user can then approve.

• If the user is not logged in, nothing can be published.

Plug-ins that work with Facebook Connect and Open Graph

Facebook has developed many plug-ins that work with Connect and Open Graph programming to make sign in and other user activity seamless. Users who trust the site already do not have to retype login information or can be assured that their login information updates automatically. To learn more about the plug-ins available, check out the Facebook Connect Plugin Directory (https://developers.facebook.com/docs/plugins) to help all developers and bloggers find plug-ins that easily integrate into their sites and blogs. The directory enables users to create, list, and offer or sell their own plug-ins (see Figure 5.15).

5.15 Facebook provides a listing of all the plug-ins available that help you connect to your website or blog to encourage interaction between the different platforms.

Other integration ideas

Beyond Facebook Connect and Open Graph, there are a few simple touches you can use to create an integrated digital appearance between your website and Facebook.

A meta description

One small coding detail on websites and blogs that increases your visibility is the meta description on a web page. In the HTML code of your website, you can include a description of your website and the particular web page. Speak with your local web developer about how to code meta tags on your website in particular descriptions. The description is visible on a post. The description has always been available to search engines and has been part of an essential step with search engine optimization. Search engines use your description meta tags to give a preview of your website before a user opens the entire site.

If you are not HTML-savvy, do not worry. The description is very easy to spot. In an HTML page, the code for a meta description looks like this:

<meta name=”description” content=”Here’s what’s happening at my store this week” />

You can also view it in a web page’s code by clicking on the page source or view code selection in your web browser. To view your meta tags in Internet Explorer version 9, right-click on the website in question and then click View and then Source.

Regardless of how you view the code, you can use the meta description to your advantage. Insert useful words that depict the purpose of the content, particularly if the page has a Like button. Just make sure that you really explain your page in the first sentence or two.

Here is what a page looks like when the Share button is clicked (see Figure 5.16). The description is the same as what is shown in the content=“ ” segment of the meta description code. This simple step lets people know what to expect from the page.

5.16 Inserting the meta description on your website increases your visibility within Facebook by improving link sharing and enabling you to tailor the link description.

Also consider the images you use on your pages and ensure that they relate to your subject, as any of them can be potentially selected as the thumbnail for your shared content. When someone shares one of your website posts on Facebook, Facebook automatically attempts to include at least one image from the web page. If there is more than one image, Facebook gives the person sharing the page the option of selecting which image to use — or that person can opt to not use any image when sharing the post.

The point is to use everything at your disposal to identify your post, making it interesting enough for people to share. You can also build your social media image by making it clear that the articles you share are helpful for the audience. If the page is an e-commerce site, describe your product with keyword terms that people are potentially using. Finally, appreciate the ease in which this description can be created. If you are already managing search engine optimization, adding a meta description is not too extensive an extra step because it is also a part of an optimization plan from the start.

Facebook plug-ins

Adding Facebook plug-ins to your website can improve the overall look and boost interaction with potential customers. Plug-ins have a specific purpose that may not be revenue generating, but their appearance on a web page can pique interest to encourage others to work with you. Most plug-ins are available via a simple code you add to your page, or a web developer can help you. You can adjust the width (if your widget is to fit into a column) as well as the color and some other details. Here are some of the plug-ins you can try:

• Facepile. The Facepile plug-in shows the people who have liked your page or joined your website, providing social proof of activity and interest in your business.

• Like Box. The Like Box plug-in can display your latest fan Page posts in a widget clickable on your site. Facebook users who discover your page can like a post without leaving the website. Moreover, the widget displays the names of other Facebook connections who have also liked the page. Site visitors seeing that their friends have liked your page or website have social proof that can entice them to click on the widget and like the page as well. This may also sound as if a visitor would be drawn from the site, but the right placement of a Like Box plug-in can encourage others to take action on your site. The widget can be just as powerful as a better business bureau or membership seal.

• Comments Box. The Comments Box is another useful plug-in that enables a user to comment on your site. If a user leaves the Post to Facebook check box selected when she posts a comment, a story appears on her friends’ News Feeds indicating that the person has made a comment on your website, which also links back to your site. A Comments Box measures the quantity and quality of comments (how much they are shared, how often, and so on) to surface the highest-quality comments for each user. Comments are ordered to show users the most relevant comments from friends, friends of friends, and the most liked or active discussion threads, while comments marked as spam are hidden from view. This makes the Comments Box a specifically tailored way of displaying social proof to Facebook users who have arrived to your site, haven’t “fanned” your page, but have friends and connections who have.

Social media icon

Just as Facebook plug-ins can appear on a web page to pique interest, Facebook icons can appear in blogs and other online digital media to ensure that people come to your Facebook Page. You can use a number of sources for blogs, for example. Here are a few sources:

• SexyBookmarks. (http://shareaholic.com/publishers/sharing) This is a WordPress plug-in and a catchall for social media links. The user can select which social media icons appear in an array at the bottom of a post.

• Wibiya. (http://wibiya.conduit.com) This one is that mysterious bar that scrolls up from the bottom of a web page view. Offered by Conduit, this application is customizable and allows viewers to click a link to a social media site of the user’s choice.

• Custom buttons. There are a ton of sites with HTML codes for custom Facebook buttons. Just type the phrase social media icons in a search engine, and you find a number of websites where you can copy code for your own site.

Adding these plug-ins should not require any coding and should take only a few minutes to install. The most important aspect is making sure that these are available. With Facebook’s popularity, it is essential that these links are easy for readers to see and click.

Website versus Facebook-Only Presence

As Facebook development and offerings increased over the years, there has been some debate among marketers and pundits about whether a Facebook presence in place of a standard website would be best in the long run. Part of the reasoning has been due to the audience Facebook has generated. An eMarketer report in February 2011 titled “Facebook Reaches Majority of U.S. Web Users” indicated that Facebook reached 57 percent of Internet users and nine out of ten users of social media. So many professionals argue that a Facebook-only presence would gain more exposure than any effort committed for a website, such as search engine marketing.

Despite Facebook’s enormous audience, maintaining a website as well as a Facebook presence is the best tactic. The most significant reason to maintain a website is the simple fact that you own the website and completely control the content and functionality of that site. With a Facebook Page, you are at the mercy of the Facebook platform and its controls and functionality. A website can provide visual branding for your customers — it can be designed to closely imitate your building, for example. A website can also permit the development of navigation features that may not be developed as easily within Facebook. Moreover, eliminating a website would eliminate many options for integrating your website and Facebook, such as Like buttons and Facepiles, which allow a larger market reach, encourage new visits to your site, and engender trust. Finally, many analytic solutions for Facebook Pages are not as nuanced as those for websites and blogs. The solutions are meant to help you understand interaction with respect to a Facebook Page, but not necessarily clickstream analysis — how people navigate through a website. As a result, you lose the ability to understand how segmented audiences receive certain content as well as the ability to test for improvements that can increase online sales or leads.

Nevertheless, a Facebook Page and a website or blog can complement each other and create an impressive, coherent presence for your business (see Figure 5.17). Moreover, do not assign Facebook to second-rate status by not developing special content and strategies of engagement for it. Remember that Facebook has a gigantic audience reach that spends a considerable amount of time on the social network. Treat a website and Facebook presence with equal importance, respecting and leveraging their differences.

5.17 A cohesive connection between your website, Facebook Page, and blog creates strong marketing of your brand and delivers a coherent impression to visitors.

How a Cake Recipe Website Integrates with Facebook

How are real small businesses using Facebook and their websites to better engage customers?

Vladimir Prelovac, founder and CEO of Prelovac Media, a social media consulting firm in Belgrade, Serbia, analyzes TorteKolaci.com, a Serbian blog offering cake recipes. The following sections take a look at how this website is using Facebook.

Facebook Like button

Using a basic Facebook widget is another way of saying you like something that you find on a site, but with one important difference: your preference will be visible on your profile Page for all your friends to see. The recipe on TorteKolaci.com for ice cube cake has 4,000 likes, a number even sites like Mashable would envy. Almost 4,000 likes on a single recipe. We have a Facebook Like button two times on the Page so you don’t miss it (see Figure 5.18).

5.18 Over 4,000 people have viewed and liked this single recipe on TorteKolaci.com.

Facebook comments

Receiving comments on your website or blog is great and there are a variety of easy ways to enable comments (see Figure 5.19). Facebook also has a solution, which enables you to manage comments on your website with Facebook. On his blog, Vladimir has written about TorteKolaci.com changing its comment system so that it is integrated with Facebook. To start using Facebook’s comment system in your website, check out its social plug-ins at http://developers.facebook.com/docs/reference/plugins/comments.

5.19 By allowing comments to appear on its website from Facebook, TorteKolaci.com saw an instant increase in participation.

“Before the change, we received around 5 to 10 comments daily,” Vladimir wrote. “After the change this number jumped up immediately to 20 to 30 comments a day! Main reason seems to be easier accessibility, as now the user can start writing the comment immediately (provided they are already logged into Facebook, which most of them are). Compared to a standard blog comment form where you need to type in your name, e-mail, and website, Facebook comments are much more likely to be used (in our experience around three times more likely).”

An added bonus of Facebook comments is that the user can easily post the comment directly to his or her profile Page. That brings more attention not only to the comment but also to the related Page.

Facebook group

You join groups in the offline world (Sunday school, Boy Scouts, professional associations, chambers of commerce, and so on), and online the world is very similar. You want to join groups of like-minded people, hence the growth of Meetup. With this in mind, the marketers at TorteKolaci created a Facebook group for lovers of sweets. According to Vladimir, the group has more than 9,000 members and is growing every day. Group members engage by sharing their stories, recipes, and photos.

Instead of a default Facebook group widget, Vladimir created his own, which blends into TorteKolaci’s site much better (see Figure 5.20).

“I am still not sure whether this has positive or negative impact on new member sign ups (as this kind of test would be hard to set up), but my gut feeling says positive,” Vladimir wrote.

See Chapter 3 for more information on using groups and an explanation of the differences between Facebook Pages and groups.

5.20 TorteKolaci.com marketers created their own group, or fan Page, button for their website. As you can see, they also do a fabulous job of incorporating other available Facebook plug-ins (such as Facepile) on their website to generate interaction and interest in the site.