Before you start, you’ll need to install the WebMatrix helpers.
- Run your site and go to http://localhost:yourport/_admin and follow the instructions. You’ll get to the NuGet feed, from which the helpers can be installed. You’ll need to install the ASP.NET Web Helpers Library, which includes a helper called LinkShare that makes it easy for people to link to your page by using Digg, Reddit, Facebook, Twitter, and other sites.
- To get started with LinkShare, create a new WebMatrix site called 8-1. Add a new index.cshtml page and edit it so that looks like this:
<!DOCTYPE html> <html> <head> <title></title> </head> <body> <p>My First Link</p> @LinkShare.GetHtml("My first link") </body> </html>
- Run the page. You’ll see something like Figure 8-1.
In the rest of this section, you’ll look at how each of these social networking sites works so that you can see how your site’s visitors can use them from within your site.
Delicious is a social bookmarking site that allows users to save links to their favorite sites from anywhere. It offers tagging and sharing facilities to help keep those sites organized. If you, like me, have a bunch of computers, and a bunch of browsers on each, it’s hard to keep all of your bookmarks organized. Delicious provides a service that does this. Naturally, you want people to bookmark your site, so you want to make it as easy as possible for them to do so.
Users can sign up for a Delicious account on their site or they can sign in with a Yahoo ID. You can see my home page on Delicious in Figure 8-2. At this point, I haven’t saved any bookmarks.
When a user clicks the Delicious link on your LinkShare page, the browser will automatically launch the Delicious Save Bookmark page. You can see this page in Figure 8-3.
As you can see in the image, the URL of the page is automatically populated and the title is set to the parameter that you set in your code.
Remember, when you wrote it, it looked like this:
@LinkShare.GetHtml("My first link")
As a result, the text My first link was loaded into the Title field. When the user clicks the Save button, the link will be added to his or her set of bookmarks on Delicious. You can see it in Figure 8-4.
And just as easy as that, your page has been added to the Delicious bookmarks. Users of Delicious can then share their bookmarks with each other and drive a lot of traffic to your site!
Digg is a social site where users share what they like with other users. Basically, if you “dig” a page (American slang for really liking it), you can tell Digg.com that you like it, and the fact that you like it will be shared with other Digg users. If a lot of people like a site and share this fact, the site can become very popular, and the snowball effect can drive a lot of traffic to the site.
To test this with a WebMatrix site, you’ll need a live site. You can’t share an http://localhost site on Digg, so, I recommend that you visit http://www.microsoft...b/hosting/home/. You’ll find links to several hosting providers that you can use to host your site there. For the example site in this section, I’m using Cytanium.
You can see my site in Figure 8-5. It’s a modification of the Bakery template that is included with WebMatrix and shows how to sell something (in this case, books) using PayPal.
If the user clicks the Digg icon (second from the left), the Digg wizard will launch and allow him or her to submit your page automatically. Digg might ask if the page has a duplicate; if so, the user will end up digging the original page, which is the ultimate idea—the more diggs your page gets, the higher it will appear in the Digg rankings, and the more traffic you’ll receive. You want as many diggs as possible!
The next stage is to describe the link. You can see this page in Figure 8-6.
When you finish filling out the form, your site will be added to Digg. Figure 8-7 shows the Digg screen after my site was added.
Making it as easy as possible for someone to add your page to Digg will mean that they’re more likely to do so. As you can see, the LinkShare helper made this very simple!
Using Google Reader
Similar to Delicious, Google Reader allows users to store and share bookmarks to sites. The third item in the LinkShare list allows the user to log your site on Google Reader. When your users select the item, a browser window opens, allowing them to add your site to Google Reader. You can see this in Figure 8-8.
This is a simple user interface that allows the user to add a note about your site and tag it. After this is done, the window closes, but the user can visit the Google Reader site at http://www.google.com/reader. You can see mine in Figure 8-9, where the link from the WebMatrix site has been shared.
As you can see, it’s pretty easy to allow your users to add links to their social sites. We’ll continue exploring how they work by taking a look at Facebook in the next section.
When your user clicks the Facebook icon on your site, his or her individual Facebook page will appear (possibly after a logon screen). This action creates a share link with your site and displays a really nice summary of your site’s contents. Continuing with the site that I’m using as an example in this chapter, Figure 8-10 gives a pretty good summary. Not only that, users can add their thoughts to this summary so that it gets shared with their friends.
Figure 8-10. Sharing your site on Facebook.
Facebook can scan your page for thumbnails, so you can pick the one you want to use. In this example, I changed the thumbnail to a different one and clicked Share. On my Facebook profile, I saw what’s in Figure 8-11.
As with the other sites, if you make it very easy for people to share your content on Facebook, they just might do it.
Reddit is another popular site for sharing links. Again, the LinkShare helper makes it as easy as possible for your users to share your site on Reddit. When they click the Reddit link, they’ll be taken directly to the Reddit submit page (see Figure 8-12).
Then, after your user has submitted your page, it will be on the Reddit list, where it can be voted up or down by the Reddit user community (see Figure 8-13).
Reddit users can comment on your site and help you to be successful, so be sure to post good links with good descriptions.
StumbleUpon is another recommendation engine like Digg or Reddit, but StumbleUpon takes into account your interests, what your friends like, and what similar users like. So, of course, you want people to be able to share your site easily with this tool, because it will raise the likelihood that their friends—and those friends’ friends, and so on—will have the site recommended to them.
When users click the StumbleUpon link on your page, they’ll get a browser window where they can recommend your page to the current StumbleUpon population (see Figure 8-14).
When the user clicks Submit, the page will be submitted to the StumbleUpon engine. Then that user’s friends will be more likely to have it recommended to them when they sign in! See Figure 8-15 for an example of what the StumbleUpon opening page might look like.
StumbleUpon also shares content with Facebook, so sites linked here can reach both populations.
The last link is a link to Twitter. Again, if it’s as easy as possible for your users to tweet your site, they’ll be more likely to do so. Then, every one of those users’ followers will see your page, giving you free marketing. If you are using the LinkShare helper, when the user clicks the icon on your site, his or her Twitter page will open, and the text you used in the LinkShare code line will be displayed, followed by the URL of your page. You can see an example in Figure 8-16.
All of these add up to what could be free word-of-mouth marketing on social networking sites. And all you needed to write was a single line of code!
Learn more about this topic from Introducing Microsoft® WebMatrix™.
Get a running start with Microsoft WebMatrix—the free, downloadable web development solution featuring all the tools you need for server-side programming. This practical book introduces the templates, helper libraries, and other tools in WebMatrix for building and customizing a data-driven site—including techniques for adding video, email, web forms, and other features. Learn how easy it can be to create a dynamic web presence for your small business or organization with WebMatrix.