Ebloger Templates

Friday, October 22, 2010 Anonymous

All the big brands like Coke, Starbucks, Nokia, and even Apple, maintain fan pages on Facebook that are “liked” by millions of people worldwide. These pages are designed professionally and have certain useful features.

For instance, the Apple iTunes page lets you search for apps right inside Facebook. In the case of Threadless, you can comment on your favorite T-Shirt designs without leaving Facebook while CNN has all the breaking news stories listed on its Facebook landing page.

How do they create such interesting Facebook pages? Do you really need to hire designers or skilled programmers who understand the ins-and-outs of Facebook APIs in order to build interactive and beautiful fan pages? Well, the answer is no.

Create a Customized Facebook Fan Page

As an example, see this customized Facebook page that includes a welcome page (also known as custom landing tab) for new visitors, presentations, a live RSS feed, videos and more. And it doesn’t take lot of effort to build such a page. Let’s see how:

Step 1: Assuming that you’ve already created a basic Facebook Page, open the Static FBML application and add it to your Facebook page.

Step 2: Go back to your Facebook Page, click the “Edit Page” link in the sidebar and again click “Edit” under the FBML section.

Step 3: This is your playground -- anything that you insert into this FBML text box will be visible on your Facebook Page. It accepts standard HTML tags so you may insert images, tables, paragraphs and more into your Facebook Page with simple markup.

Step 4: Now click “Edit” under Wall Settings and set the “Default Landing Tab for Everyone Else” to one of your new FBML boxes.

Feeling confused? The following video will walk you through the steps required to create a custom landing page on Facebook using Static FBML. You can add multiple FBML boxes to your Facebook page and they’ll show up as separate tabs.

Add Elements to your Facebook Page

Now that your basic Facebook Page with the Static FBML app is in place, here are some ideas / code-snippets that you may add to your Page:

1. A Better Landing Page

If you want to show a different landing page to fans and non-fans, use the visible-to-connection tag as in the following example.

Fans will see a link to download a PDF book while non-fans will see a welcome image. Remember that the width of this image should not exceed 520px.

    1: <fb:visible-to-connection>
    2: // This is visible to fans only
    3:  <h2>Welcome back!</h2>
    4:  <p>Please <a href="book.pdf">download</a> your gift</p>.
    5: <fb:else>
    6: // This is visible to people who are not fans yet
    7:  <img src="http://example.com/like-me.jpg">
    8: </fb:else>
    9: </fb:visible-to-connection>

2. Embed a YouTube Video

If you would like to embed a YouTube video into one of the tabs of your Facebook Page, copy-paste the following code into the FBML box.

Remember to replace ID_HERE with the actual ID of the YouTube video.

   1: <fb:swf swfsrc="http://www.youtube.com/v/ID_HERE"
   2:     imgsrc="http://img.youtube.com/vi/ID_HERE/default.jpg"
   3:     width="480" height="360" />

3. Add your RSS Feed

If you have an RSS feed for your website /blog, you can easily show the most recently published stories on your Facebook Page as well in a separate tab.

Simply open RSS Feed for Pages and add the app to your Facebook Page.

4. Add a Comments Box

You can easily add a section on your Facebook Page where fans can leave their comments, ask you something or even talk to each other – see example.

   1: <fb:comments xid="user_comments" canpost="true" showform="true">
   2:  <fb:title>Leave a Comment!</fb:title>
   3: </fb:comments>

5. Add Forms and Dialog Boxes

The semi-transparent pop-up dialogs are unique to Facebook and you can easily bring them to your Facebook pages with a simple snippet.

For instance, the following code, when added to your FBML box, will create an “About Us” link on your Facebook Page. When people click on the link, they’ll be shown a dialog as in the above screenshot.

You may also insert HTML forms in Facebook dialogs to collect user preference or even for email based newsletter subscriptions.

1: <fb:dialog id="dialog" cancel_button=1>
2:  <fb:dialog-title>About Us</fb:dialog-title>
3:  <fb:dialog-content>Digital Inspiration is a technology blog.
4:           Would you like to learn more?</fb:dialog-content>
5: <fb:dialog-button type="button" value="Yes" href="http://labnol.org" />
6: </fb:dialog>
7: <a href="#" clicktoshowdialog="dialog">Click here</a> to learn more.

6. Embed a Slideshare Presentation

Like your YouTube video clips, you can easily add any of your Slideshare slideshows to your Facebook Pages using the fb:swf tag. Here’s an example:

   1: <fb:swf swfsrc='http://slideshare.net/swf/ssplayer2.swf?doc=ID_HERE'
   2:           width='515' height='425' imgsrc="thumbnail.jpg" />

Replace thumbnail.jpg with the URL of the actual thumbnail image of your presentation.

7. Add a Chat Room

You can use your Facebook page to chat with your fans live while they are on your page. To get started, simply create a Flash based chat widget for your Facebook page using MeeboMe and then embed it into your Facebook FBML box using the code below:

   1: <fb:swf swfsrc='http://widget.meebo.com/mm.swf?ID_HERE'
   2:           width='515' height='425' imgsrc="chat-thumbnail.jpg" />

Replace ID_HERE with the ID of the chat widget supplied to you by MeeboMe. This will let you chat with your Facebook fans but they won’t be able to chat with each other.

8. Add Podcasts and other MP3 Audio

Facebook makes it extremely easy for you to embed MP3 audio files in Facebook Pages. You need to host them online (see options) and Facebook will wrap them in their own player as show in the above animation.

To add an MP3, use the following code.

   1: <fb:mp3 src="http://example.com/podcast.mp3"
   2:   title="Episode 12" artist="This Week in Facebook" />

You may also use custom MP3 players but then you’ll have to rely on the fb:swf tag.

9. Add Polls to your Facebook Page

While there are quite a few Facebook apps for polls, I prefer a solution that would let people vote directly without requiring them to add the Facebook App to their profile.

So here’s a simple workaround. PollDaddy, which is one of the best polling software around, offers a Flash based widget for embedding polls in websites. You can grab their widget code and insert it into your Facebook Page via FBML as shown here:

   1: <fb:swf swfsrc='http://i.polldaddy.com/poll.swf?p=ID_HERE'
   2:           width='250' height='500' imgsrc="poll-thumbnail.jpg" />

Now fans of your Facebook page will be able to vote with a click. Do replace the ID_HERE with your own Poll ID.

10. Surprise your fans

A lesser-known but very interesting feature of Facebook Pages is that you can randomize content with the help of FBML (visit this page and hit F5 to see it in action).

The idea is that you create multiple blocks of content and show them randomly to your visitors. For instance, the following code will pick one random image from the available pool and, if you put this code on the landing page, your visitors will probably see something new and refreshing on every visit.

   1: <fb:random pick="1">
       2:   <fb:random-option>
       3:     <img src="http://example.com/image-1.jpg" />
       4:   </fb:random-option>
       5:   <fb:random-option>
       6:     <img src="http://example.com/image-2.jpg" />
       7:   </fb:random-option>
       8:   <fb:random-option>
       9:     <img src="http://example.com/image-3.jpg" />
      10:   </fb:random-option>
      11:   <fb:random-option>
      12:     <img src="http://example.com/image-4.jpg" />
      13:   </fb:random-option>
      14:   <fb:random-option>
      15:     <img src="http://example.com/image-5.jpg" />
      16:   </fb:random-option>
      17: </fb:random>

You can extend this idea to showcase your popular content in a self-rotating manner.

Read more...

Sitemaps, in simple English, are text files (see example) containing a list of all web pages that exist on your site. It is important that you create a comprehensive sitemap as it will help Google and other search engines crawl your site better and that might mean more traffic coming your way in the long run.

The Problem with Blogger Sitemap Files

Ideally, the sitemap file should contain all URLs of a site but if your blog is hosted on blogspot.com (or if you are using a self-hosted version of Blogger with a custom domain), you’ll be surprised to know that the default sitemap file (see example) contains only the 26 most recent pages of your blog.

That’s a bad thing because some of your older blog pages, that are missing from the system-generated sitemap file, may never get indexed in search engines. There’s however a simple solution to fix this problem.

Generate a Complete Sitemap for your Blogger Blog

Step 1: If you haven’t done this already, sign-in to your Google Webmasters account and add your blog. For details, check this video tutorial on how to add a blog to Google.

Step 2: Once your blog is added to Google, open the Sitemap Generator and type the full address of your blogspot blog (or your self-hosted Blogger blog).

Step 3: What you get is list of sitemap files that contain each and every page of your blog. You now just have to ping Google, Yahoo and Bing to inform them about these XML sitemaps.

As shown in the video screencast below, you need to manually add each of the sitemap files into your Google Webmaster Tools dashboard but for Bing or Yahoo, you can simply click blue hyperlinks and these search engines will automatically download the relevant sitemap files from your blogspot site.

Once all the Sitemaps are added, your Google Dashboard should look something like this.

If you see a red cross or an orange exclamation symbol instead of the green tick, that means something is wrong with your XML sitemap. Verify that the file exists by typing the sitemap URL in your browser.

Sometimes media enclosures (like MP3 files) in blog posts can create warnings during sitemap submission. And if you have switched from Blogger to WordPress, it still makes sense to submit sitemaps of your old Blogspot blog as that will only help search engines discover your new WordPress pages. Good luck

Read more...

Wednesday, October 20, 2010 Anonymous

Some might have heard about Spread Firefox, an initiative by Mozilla community to spread the word of Firefox among the Internet users. Recently they had added an affiliate program for bloggers and webmasters to earn cool prizes. As a Spread Firefox affiliate you earn credit for each download made through your link and top affiliates name will be displayed on their website. Well, its not only for blogger and webmaster, even students can benefit by becoming Firefox campus rep to spread the word about Firefox within their college or university. So why wait, get yourself involved with Spread Firefox campaign and earn rewards.

Still using IE? Download the latest version of Firefox

Read more...

Ever since Firefox came into existence, their growth seems unstoppable. Even with big players like Google getting into this business with lighter and simpler web browser experience, Firefox looks to be the people favorite in reliability. Especially Firefox add-on has gained huge popularity among user, with more than hundred thousands addon available, there by making it one of the largest addon base for any web browser. Here I am listing out some of the must have Firefox add-on for better surfing.

1. Adblock Plus: Most of us get annoyed by advertisements and banners on the Internet. At many instance it sucks our bandwidth, by increasing the web page loading time. This is a perfect add-on which avoids all those flashy glossy banner and stops you from annoying about advertisements.

2. Tab Mix Plus: This add-on takes tab browsing to a next level. It comes with cool features such as duplicating tabs, tab clicking options, undo closed tabs, window and much more. A very useful add-on for those who close the tab or a window by mistake, which leads to losing those browsed session.

3. DownloadThemAll: This is the first ever download manager build inside Firefox. It comes with a accelerator to boost your download speed by upto 400% and also allow you to pause and resume the download. All you need is to just hit on this add-on to download all the links and images in the web page. Good news is DownloadThemAll is absolutely free to use.

4. Firefox Showcase: Got impressed by Internet Explorer showcase feature, then you can expect the same from Firefox with Firefox Showcase. This add-on manages your Firefox tabs and windows by displaying them as thumbnails.

5. Sxipper: If you are an Internet savvy having multiple accounts with many websites, then this add-on is for you. Sxipper keep tracks of your unlimited user name, password and personal information securely on your computer. So no more worries of losing your stored info, when you reinstall the application.

Read more...

Facebook has opened up the feature of setting our own custom username for Facebook fan page on Jun 12th 2009. But sadly only few are aware of how to change the default fan page URL to custom URL. Normally when we create a page, we get the fan page URL as www.facebook.com/pages/Bloggermint/163941377964, but if you have more than 25 liked members for your page, you have the ability to create a custom username, which looks like www.facebook.com/bloggermint.

How to create custom username

1. Login to your Facebook account

2. Open a new tab and type http://www.facebook.com/username

3. Click on Set a username and choose the fan page to add a custom username, if its available

(Note: Before hitting confirm, be sure that you haven’t made any typo errors. The username cannot be changed once set, so be cautious before confirming)

4. Finally hit on Confirm button to change the default URL structure to your own custom username.

The same procedure can be used to even change your Facebook profile page link. I hope this might help to short your fan page URL and some brand value to the URL.

Read more...

There are many who switch to Wordpress, only because of its huge template base. On that note there are numerous free premium like themes available over the Internet. As of I know there are more than 300 quality premium templates which are available for free to download. So here is my set of best free premium Wordpress themes and I hope it would help Wordpress newbies and also for bloggers who cannot afford to go with a paid template.

Moi from WP Skinner