Latest Post
Showing posts sorted by relevance for query Blog trick. Sort by date Show all posts
Showing posts sorted by relevance for query Blog trick. Sort by date Show all posts

Facebook Recommendations Widget for Blogger (Official Bar) (Blog trick)



acebook recently has introduced a new social plugin called Facebook Recommendation Bar. FRB is useful plugin which helps you to drive traffic from Facebook. With Facebook Recommendation Bar, Your blog viewers can LIKE you posts and can see related posts as well.




How to Install Facebook Recommendations Widget in Blogger

You first need to add Facebook open Graphs meta tags. Here is the simple way to add Facebook open graphs in your blogger template.

  1. Got your Blogger template and find this code
  2. <head>
  3. Add new code just AFTER searched code.
  4. <!-- Begin Open Graph metadata -->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <meta content='article' property='og:type'/>
    <meta expr:content='data:blog.title' property='og:site_name'/>
    <meta expr:content='data:blog.pageName' property='og:title'/>
    <b:if cond='data:blog.postImageThumbnailUrl'>
    <meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
    </b:if>
    <b:else/>
    <meta expr:content='data:blog.title' property='og:title'/>
    <meta content='website' property='og:type'/>
    </b:if>
    <meta expr:content='&quot;en_US&quot;' property='og:locale'/>
    <meta expr:content='data:blog.canonicalUrl' property='og:url'/>
    <!-- End Open Graph metadata -->
  5. Save Your Template
  6. Now go to  Facebook Recommendations Bar Official Page
  7. No need to enter anything, directly click the Get Code Button
  8. Click on Create a new app Link
  9. Enter the App Name with your Blog Title and App URL with your Blog URL and click on Continue.
  10. Enter Captcha Code and Click Submit button
  11. Enter your blog URL in URL of the article box and your domain name in Domain box, Click the Get Code Button once again
  12. Copy the code that appears in First Box and Encode the Code using HTML parser.
  13. Now, go back to Blogger > Template > HTML > Proceed and select Expand widget templates
  14. Search <body> and past the encoded code AFTER <body> tag
  15. Now search for;
  16. <data:post.body/>
  17. Paste below given code after the code you searched.
  18. <b:if cond='data:blog.pageType == "item"'> <div class="fb-recommendations-bar" data-trigger="onvisible" expr:data-href="data:post.url" data-read-time="30" data-action="like" data-side="right" expr:data-site="data:blog.homepageUrl" data-num-recommendations="2"></div> </b:if>
  19. Save your template


 

Add a Facebook Page widget Pop Out in Blogger (Blog trick)

 Facebook is one of the most popular way to get traffic to your blog. You can place a pop out on your blog and get likes to your Facebook page. This is an easy way to get page likes as well as traffic from your Facebook page to your blog. Here is an attractive Facebook widget that pops out when any user drag the mouse cursor on it. When widget pop-out, the blog reader can LIKE your facebook page.


Add a Facebook Page widget Pop Out in Blogger

To enable this widget on your blog, you first need to have a jQuery plugin script in your blog template. To add a jQuery plugin;

  1. Go to Blogger > Template > HTML > Proceed and check Expand Widget Templates
  2. Search for this code
  3. </head>
  4. Add this code BEFORE it
  5. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  6. SAVE your template
  7. Go to Blogger > Layout > Add a widget and select HTML/Javascript widget
  8. Copy-paste this code there
  9. <style type="text/css">
    /*<![CDATA[*/
    #fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;} .fbplbadge {background-color:#3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("http://2.bp.blogspot.com/-MaW4PTF8Qkc/T13eWvP_ZoI/AAAAAAAABc8/ZCYfPlB1jug/s1600/w2b_vertical-left.png");background-repeat: no-repeat;overflow: hidden;-webkit-border-top-right-radius: 8px;-webkit-border-bottom-right-radius: 8px;-moz-border-radius-topright: 8px;-moz-border-radius-bottomright: 8px;border-top-right-radius: 8px;border-bottom-right-radius: 8px;} /*]]>*/
    </style>
    <script type="text/javascript">
    /*<![CDATA[*/
    (function(w2b){
    w2b(document).ready(function(){
    var $dur = "medium"; // Duration of Animation
    w2b("#fbplikebox").css({left: -250, "top" : 100 })
    w2b("#fbplikebox").hover(function () {
    w2b(this).stop().animate({
    left: 0
    }, $dur);
    }, function () { w2b(this).stop().animate({
    left: -250
    }, $dur);
    });
    w2b("#fbplikebox").show();
    });
    })(jQuery);
    /*]]>*/
    </script>
    <div id="fbplikebox" style="display:none;"> <div class="fbplbadge"></div> <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2FFOLSOL&width=250&height=250&colorscheme=light&show_faces=true&border_color=%23C4C4C4&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:250px;background:#F5EBF5;" allowtransparency="true"></iframe> </div>
    1. Change the bold part with your Facebook username
    2. Thats it!


 

Add Facebook comment box to your blogger (Blog trick)

Add Facebook comment box to your blogger blog.





One of the best ways of increasing your blogger conversations is by adding Facebook comment box to it. This feature was recently disclosed by Facebook. According to id first you will have to create and application using Facebook and then add the code to your blogger blog.

To add Facebook comment box to your blogger blog follow the following steps:

1) First make a back up of your blogger template, which can be done by just going to
Dashboard > Design > Edit HTML > then click on Download Full Template.

2) Now visit this page and enter your blog name URL and click on Create application.

3) Now you will get an App ID, just copy and save that ID somewhere.

4) Now go to your Blogger Dashboard > Design > Edit HTML > then click on Expand Widget Templates.

5) Now search for <data:post.body/> in it.

6) Now post the following code below it:


<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <p align='left'><img alt='' class='icon-action' src='http://lh4.googleusercontent.com/-HvqNmNXhkzY/TjATfsEVeSI/AAAAAAAAAjc/yMCvjARROZk/Screenshot.png'/></p>
  <div id='fb-root'/>
  <script>
  window.fbAsyncInit = function() {
  FB.init({appId: &#39;AXID &#39;, status: true, cookie: true,
  xfbml: true});
  };
  (function() {
  var e = document.createElement(&#39;script&#39;); e.async = true;
  e.src = document.location.protocol  +
  &#39;//connect.facebook.net/en_US/all.js&#39;;
  e.async = true;
  document.getElementById(&#39;fb-root&#39;).appendChild(e);
  }());
  </script>
  <fb:comments/>
  </b:if>
7) Now just press Ctrl+ F and find AXID and replace it with the App ID you had saved before. After that save it.

8) Now go to To Settings > Comments > then select the hide button under Comment section. Now save it again.

9) You are done now.


 

Add a Colorful Popular Posts Widget on Blogger (Blog trick)

Making your blog look interesting and catchy is one of the most important thing. Adding a colorful popular posts widget is a nice option to make your blog look more beautiful and eye catching. By default, blogger allows you to add a popular posts widget however, in this article you will be able to add a multicolored widget displaying popular posts of your blog.



The widget script comes with three display options i.e. display only titles of post, titles with thumbnails or just thumbnails. Follow below mention steps to add a widget.

Add a Colorful Popular Posts Widget on Blogger

  1. Go to Your Blog Template > Edit HTML > Proceed and check "Expand Widget Templates"
  2. Find this code
  3. /* Variable definitions    ====================
  4. Place this code
  5. <Group description="PopularPosts Backgrounds" selector="#PopularPosts1"> <Variable name="PopularPosts.background.color1" description="background color1" type="color" default="#fa4242" value="#ff4c54"/> <Variable name="PopularPosts.background.color2" description="background color2" type="color" default="#ee6107" value="#ff764c"/> <Variable name="PopularPosts.background.color3" description="background color3" type="color" default="#f0f" value="#ffde4c"/> <Variable name="PopularPosts.background.color4" description="background color4" type="color" default="#ff0" value="#c7f25f"/> <Variable name="PopularPosts.background.color5" description="background color5" type="color" default="#0ff" value="#33c9f7"/> <Variable name="PopularPosts.background.color6" description="background color6" type="color" default="#ff0" value="#7ee3c7"/> <Variable name="PopularPosts.background.color7" description="background color7" type="color" default="#ff0" value="#f6993d"/> </Group>
  6. Now, find this code
  7. ]]></b:skin>
  8. Place new code just before/above it.
  9. #PopularPosts1 ul{margin:0;padding:5px 0;list-style-type:none} #PopularPosts1 ul li{position:relative;margin:5px 0;border:0;padding:10px} #PopularPosts1 ul li:first-child{background:$(PopularPosts.background.color1);width:90%} #PopularPosts1 ul li:first-child:after{content:"1"} #PopularPosts1 ul li:first-child + li{background:$(PopularPosts.background.color2);width:85%} #PopularPosts1 ul li:first-child + li:after{content:"2"} #PopularPosts1 ul li:first-child + li + li{background:$(PopularPosts.background.color3);width:80%} #PopularPosts1 ul li:first-child + li + li:after{content:"3"} #PopularPosts1 ul li:first-child + li + li + li{background:$(PopularPosts.background.color4);width:75%} #PopularPosts1 ul li:first-child + li + li + li:after{content:"4"} #PopularPosts1 ul li:first-child + li + li + li + li{background:$(PopularPosts.background.color5);width:70%} #PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"} #PopularPosts1 ul li:first-child + li + li + li + li +li{background:$(PopularPosts.background.color6);width:65%} #PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"} #PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:$(PopularPosts.background.color7);width:60%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"} #PopularPosts1 ul li:first-child:after, #PopularPosts1 ul li:first-child + li:after, #PopularPosts1 ul li:first-child + li + li:after, #PopularPosts1 ul li:first-child + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{position:absolute;top:20px;right:-15px;border-radius:50%;background:#353535;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff} #PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:40px;height:40px} #PopularPosts1 ul li a{font-size:12px;color:#444;text-decoration:none} #PopularPosts1 ul li a:hover{color:#222;text-decoration:none}
  10. Find this code
  11. <b:section class='sidebar' id='sidebar' preferred='yes'>
  12. Paste the code shown below just below/after it
  13. <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'> <b:includable id='main'>    <b:if cond='data:title'>     <h2><data:title/></h2>    </b:if>    <div class='widget-content popular-posts'>     <ul>      <b:loop values='data:posts' var='post'>       <li>        <b:if cond='data:showThumbnails == &quot;false&quot;'>         <b:if cond='data:showSnippets == &quot;false&quot;'>          <a expr:href='data:post.href' expr:title='data:post.title' rel='bookmark'><data:post.title/></a>         <b:else/>          <a expr:href='data:post.href' expr:title='data:post.snippet' rel='bookmark'><data:post.title/></a>         </b:if>        <b:else/>         <b:if cond='data:showSnippets == &quot;false&quot;'>          <b:if cond='data:post.thumbnail'>           <img class='item-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnail'/>          <b:else/>           <img alt='no image' class='item-thumbnail' src='http://4.bp.blogspot.com/-A6NQTW-MBZY/T37HVOov53I/AAAAAAAAAys/XLjZX6HrE50/s1600/defaultimage.jpg'/>          </b:if>          <a expr:href='data:post.href' expr:title='data:post.title' rel='bookmark'><data:post.title/></a>          <div class='clear'/>         <b:else/>          <b:if cond='data:post.thumbnail'>           <img class='item-thumbnail' expr:alt='data:post.title' expr:src='data:post.thumbnail'/>          <b:else/>           <img alt='no image' class='item-thumbnail' src='http://4.bp.blogspot.com/-A6NQTW-MBZY/T37HVOov53I/AAAAAAAAAys/XLjZX6HrE50/s1600/defaultimage.jpg'/>          </b:if>          <a expr:href='data:post.href' expr:title='data:post.snippet' rel='bookmark'><data:post.title/></a>          <div class='clear'/>         </b:if>        </b:if>       </li>      </b:loop>     </ul>    </div>   </b:includable> </b:widget>
  14. Save Your Template

Settings

  • Now got o Page Element You will find out a popular widget
  • Click on the edit link of Popular Posts widget
  • Select “Display Up To 7 Posts
  • Now Save the widget

How to Change the color scheme

If you want to change the color scheme, Go To
Design → Template Designer → Advanced → PopularPostsBackground 
and select the colors you want.


 

How To Add Image Zoom Effect For Blogger(Blog trick)

Zoom hover effect is very special for making more beautiful look of images in blogger. Actually zoom hover effect is a effect that zooms pictures or screenshots when you move or put your mouse cursor on images in blogger.




It's really cool effect. Now let's see how to add image zoom hover effect. Remember it's only for blogger. You can see a demo for you


View demo
Go to Blogger → Design → Edit HTML

Back up your template for safety

Now tick on "Expand Widget Templates"

And find the following code Using CTRL+F

]]></b:skin> 

Paste following code just it

/*URL: http://www.edutechnology.net */
.hovergallery img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
}

.hovergallery img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
opacity: 1;
}

Save your template

When you want to show zoom hover effect on pictures you have to use class="hovergallery" this code. Let's see an example
This is a image link

<a href="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s1600/Blog-Exposure-300x300.jpg"<img src="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s320/Blog-Exposure-300x300.jpg" /></a>

Now you have to add class="hovergallery" this code if you want to enable this effect on pictures. See below

<a class="hovergallery" href="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s1600/Blog-Exposure-300x300.jpg"<img src="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s320/Blog-Exposure-300x300.jpg" /></a>

I hope you already understood. you have to insert this code class="hovergallery" manually to every image if you want to show the effect and it's very easy

Please make comment if any ask, we appreciate you to share our posts with your friends if you like


 

Add Facebook Like Box Just Below Of Every Blogger Post (Blog trick)



Facebook is largest social media company in the world having alexa rank 2.If you have enough number of subscribers on facebook then just automatically publish your posts on your wall and get the traffic.Previously we shared two tutorials about adding facebook like button and twitter tweet button just below of blogger posts this time we will add a full width facebook like box below of every blogger posts.With using facebook like box your readers/visitors can like your fan page directly through your blog so that this box will increase number of your facebook fans.Now lets see how to add it to blogger blog.Also you can see the demo at the bottom of this page.

How To Add Facebook Like Box To Blogger Posts?

  1. Go to Blogger Dashboard > Design > Edit HTML
  2. First take a backup of your template
  3. Tick the expand widget check box
  4. Find for below code in your template

<data:post.body/>

Just after it paste below code

<b:if cond='data:blog.pageType == &quot;item&quot;'><iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fbtsnts&amp;width=570&amp;height=180&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:570px; height:180px;" allowTransparency="true"></iframe></b:if>


  • Now replace btsnts with your own fan page username
  • To change width of like box,adjust the value 570
  • If you wish to change heigh of like box then just edit the value 180

Live Demo ▼


 

50 Tricks to Get More People To Like Your Facebook Page(Facebook trick)

There are over three million active facebook pages, and these pages are gaining millions of new fans every day.

Yes, I just said fans.

Although the button has changed from “Become a fan” to “Like,” the action of joining a brands page remains the same. Facebook pages are still fan pages.

With Facebook’s announcement of The New Messaging there are more reasons to like Facebook, and Facebook pages, than ever.

I hope you enjoy this post about 50 Ways to Get More People to “Like” your Facebook Page, and if you do I would really appreciate it if you share these tips with your friends, and join the ProHackingTricks fan page.

Here are the tips:

1. Post a Status Update

Post a status update mentioning your facebook page.

Don’t be afraid to outright ask people to join your facebook page.  Ask and you shall receive.

Give them a great reason why they should join, tell them news, or find a creative way to mention and link to your page

2. Get fans to upload and tag photos

If you host (or attend) an event with several of your fans take a bunch of pictures, post them to your page, and then ask your friends to tag themselves in the pictures.

If you can get your fans to upload pictures to your page, or tag themselves in pictures you uploaded, this will post to their walls as well and will lead to additional traffic for you.


3. Offer an incentive for people to sign up

Using some static fbml you can create a dynamic facebook landing page with a “reveal tab” that contains content that is visible only to fans of your page.

The more valuable your incentive is, the more people will be compelled to click the “Like” button to access it.

Examples of exclusive content could be: An exclusive Video, an exclusive whitepaper/.pdf, exclusive pictures.

Stay tuned to ProHackingTricks.  In one of our upcoming posts will explain how to set up a “reveal tab.”

The image below shows different levels of increasing effectiveness for acquiring new fans.


Involver offers apps (and several of them are totally free) that make it easy to create a “Fan Gate” containing incentives, like a file or coupon, that will cause more people to “Like” your page.

4. Contact admins of groups related to your page

Groups are more powerful than pages in terms of their messaging ability. Pages send updates, but groups send messages directly to a users facebook inbox, triggering an email alert.

If you contact the admin of a facebook group with some valuable content that adds value to their readers then this can help them nurture their community and help you build yours.

5. Get people to join your page via SMS

Send a text message to 32665 (FBOOK) with the words “fan yourusername” OR “like yourusername” (without the quotes).

This feature is ideal when you’re in front of a live audience.

6. Install a page Badge


Facebook Badges are a simple, yet effective way to link to your facebook profile.

Unlike widgets, badges are simply images, and will load much faster.

7. Install a facebook “Like Box” into your site

Installing a “Like Box” is an excellent way to allow visitors to your site become fans without even leaving your page.

The like box builder tool makes it easy to customize the size of your like box, the number of connections to display, and even the color scheme.

Shown in the image below is the rarely used “dark” color scheme.

8. Use status tagging

Status tagging is a cool and fairly new feature of facebook.

This feature allows you to tag any page or person by entering the @ sign and then typing the name of the page or person you want to tag.

9. Suggest your page to friends

Use the “suggest to friends” feature of your page. Use this feature sparingly. Personally, I try to only invite people go my page once because I know it annoys me when multiple people invite me.

If you have many friends you might want to consider using the “invite all” Google chrome extension, rather than clicking hundreds or thousands of times.

10. Install a Like Button into your site

Installing a like button allows visitors to like your page, and when they do this posts the their activity stream.

This can send more traffic to your site and if you have a facebook “Like Box” and other content promotion your fan page, since this will help you convert your visitors into fans.

11. Connect your page to Twitter

Connecting your page to Twitter is an excellent way to convert your twitter followers into facebook fans.

Using this strategy will cause all of your posts to be sent to twitter, with a link back to the facebook version of the post.

www.facebook.com/twitter

12. Link to Your Page as  a Place of Employment

The info box uner profile pictures is being phased out, so now if you want an omnipotent link on your profile to your page you will need to list your Page under employment.  Once you do this your Facebook Page will appear under your name on your Profile.

13. Install commenting on your landing page

This will allow people to comment on your page, even if they are not a fan.

Any comments made can broadcast to news feeds and lead to more traffic to your page.

Setting up facebook commenting requires registering a facebook application, so act on this tip with caution unless you are comfortable with code.

14. Leverage Traditional Media

Since facebook is so widespread you can use any forms of traditional media and achieve results.

Newspapers, Media Buys, Radio, and TV all work, but are often very costly.

To maximize your promotion offer a free gift to those who join you page.

15. Newsletter Promotion

If you do email marketing send a message to your subscribers letting them know about your fan page and consider including a link to your fan page in every email.

16. Email Signature

Every email you send is an opportunity to link to your facebook page.

Check out the email signature tool wisestamp for a creative way to link to your social profiles.


17. Get business cards promoting your Facebook page

Business cards are cheap.

You can get 500 business cards from Vista Print for $1.99.

For this minimal investment you can get up to 500 new fans for your page!

Throw a link on your card and people will almost certainly check it out.

If you’re pressed for space in your design all page urls can be shortened from facebook.com to fb.me, or fb.com.

For example, www.facebook.com/prohackingtricks, www.fb.me/prohackingtricks, and www.fb.com/prohackingtricks all point to the same page.

18. Fiverr


Fiverr is an online marketplace where services are sold for five bucks.

Check out their “Social Marketing” and “Advertising” section and here you will find some people who are willing to suggest your page to 5,000 of their friends for just $5.

You will need to make the person who will suggest your page to their friends an admin in order for them to do this for you, but if you are willing to place your trust in someone to do this and they come through for you this will allow you to pick up dozens if not hundreds of new fans.

19. Create a Landing Page with Static FBML

By creating a custom landing tab for your facebook page you can increase the conversion of visitors to fans.

20. Run a “fans only” contest

An excellent way to run a fans only contest is using wildfireapp.

There are rules and regulations around running a contest on facebook so be sure to check out the facebook Statement of Rights and Responsibilities (“Statement”) before you run one.

21. Link to your page from your profile

Edit your Facebook profile information to include promotion for your Fan Page.

At the bottom of the info section of your profile you can include links to any websites you are affiliated with.

The more links you can build to your Page, the more traffic you will be able to send to your Facebook Fan Page. I am constantly seeking new opportunities to build links that will send traffic to my Fan Page.

22. Blog Commenting

Comment on blogs and in the website section use a link to your fan page.

23. Link to your facebook page from your linkedin profile

Linkedin gives every user three slots for links to whatever you’d like right on your profile.

You can make the anchor text of these links whatever you like, so I recommend using a call to action such as: Join my facebook page.

24. Upload video to facebook

Facebook video is very underrated, and exceptionally powerful.

When you embed a facebook video on another website this video includes a watermark link in the top left corner to the fan page it came from.


25. Watermark your videos with a link to your website

Using a video editing program include a link to your website.

I use camtasia to add my watermarks, and to record any screencast I create, and this program comes with a free 30 day trial.

26. Create a memorable URL

If you go to facebook.com/username you will be able to create a custom URL for your page.

Remember that this cannot be changed once it is set, so choose wisely.

27. Deliver an exceptional experience

Although facebook pages are no longer officially considered “fan pages” if you work to create fans of your brand many of them will certainly seek out and join your facebook page.

Strive to deliver an awesome experience for those who interact with your brand. Go above and beyond when engaging with your community and they will spread the word.

A famous article called 1,000 true fans maintains that they are all you need to create a thriving business. Don’t try just to get people to click “like” but instead seek to create raving true fan who will spread your word far and wide.

28. Link it up

This tip comes from @garyvee and it’s a good one: link it up!

Hyperlinks are what weave the web together so use them often and every time you do you are opening up another gateway into your fan page.

29. Flip the funnel

Drive your fans back to your website for new blog posts.

Make sure that your blog has social sharing and many of your fans will “like” your blog posts and tweet it out to their followers on twitter as well.

30. Track your growth with Facebook insights

Facebook insights shows you how many fans you have over time, and some fairly detailed demographic information as well.

Using this knowledge you can analyze what activities drive the most growth, and then duplicate your success.

31. Analyze your demographics with insights

Facebook demographics are a powerful feature of insights that allows you to determine the gender and age of the people in your page.  Once you know this information you can focus your content to appeal to the age group and gender of your fans.

Here is the demographic information of the FacebookFlow fan page:




32. Talk and Blog about your page

Word of mouth does not start itself. Get the conversation going by mentioning your facebook page in blog posts and in every day conversation.

33. Learn more about Facebook

The more you know about facebook the more you can use this knowledge to drive the gowth your community.

34. Drive more traffic to your website

Use these tips to get more free traffic to your website. Make sure that your “Like Box” is featured prominently, and plenty of this traffic will “Like” your page.

35. Produce Epic Content

If your blog content is epic this will drive the growth of your page in a serious way.

Epic content has the best chance of going viral and if a blog post goes viral this also causes it to move up in the rankings in Google, leading to even more traffic, a percentage of which will convert to fans.


36. Install a like button into your posts

Installing a like button into your posts will help drive extra traffic to your posts and it will also show that facebook is an integral part of your brand.

If you have a self hosted wordpress blog I recommend installing the WP FB Like plugin.

The more you can integrate facebook with your site the more likely people will be to join your facebook page.

37. Make a Facebook like sign

Blue Sky Factory created a  Facebook “Like” sign tool that you can use to create a cool image that will help promote your facebook page.

38. Buy Them

Although I do not recommend this option, there are several services out there that sell facebook likes.

The first 1,000 fans are usually the hardest to get so a service like this might help you get the critical mass needed to get more genuine organic fans.

39. Run a targeted ad campaign

Facebook advertising is exceptionally powerful due to the ability it offers to hyper target your market.

Facebook ads can be targeted based on age, location, and interests.

40. Turn your customers into fans

If someone likes you enough to buy your product then there is a good chance that they will like you on facebook as well.

Rig up your “thank you” page with a facebook “Like Box” and you’ll be good to go!

41. Advertise your page

The more you advertise your page the more fans you will be able to achieve.

Facebook advertising is a smart way to promote since you can target specific demographic and interest groups.

You will need a sales funnel in place in order to justify an advertising budget and I recommend setting this up prior to advertising on Facebook.

42. Use Hootsuite to manage your page



By using Hootsuite to manage your facebook pages you can maximize engagement by scheduling your posts ahead of time to go out when they will get the most attention.

Facebook posts get the most engagement early in the morning and a few hours before bed.

43. Get an attractive profile picture

A picture says a thousand words, so to really optimize your business page you should use the largest profile picture possible.

Currently the maximum profile picture size is 200 x 600 pixels.

44. Do a “fan of the month” promotion

By highlighting one of your best fans every month you indirectly encourage fans to engage more, so that they can win the coveted fan of the month title the next month.

Offer a monthly prize, such as a cool free product or service related to your brand, and the competition for this title will only increase.

45. Message your friends and ask them to join

This tried and tested method takes more ground work, but this method will allow you to build relationships and target the friends that you think are the most relevant to your page.

46. Include a link to your fan page in your forum signature

If you are active in any forums you will have the option to attach a “signature” to every post that you write.

Throw a link in your signature to your facebook page, and it will be clicked.

Do your best to add value and answer questions with your posts, and people will be more inclined to click your link and join your page.

A link with a call to action is more likely to get clicked than a link alone, so go with “Join my Facebook Page: www.facebook.com/prohackingtricks” instead of simply: “www.facebook.com/prohackingtricks”

47. Create a redirect URL

Creating a redirect to your facebook fan page is one way to “presell” the people who click it on joining your page.

For example, if your link is: www.yourdomain.com/joinmyfacebookpage anyone who clicks it will probably join your page.

48. Give away fan page swag

Websites like Zazzle make it easy for people to customize swag, such as the nifty “you like this” t-shirt below.

If you gave away shirts (or mugs, or stickers) like this with your facebook url included you could easily amass an army of walking billboards for your facebook page.

49. Find more facebook friends

The more friends you have, the better your chances will be that some of these friends will join your fan page.

Facebook has a “Find Your Friends Tool” that allows you to import your contact list from a variety of email clients, or an email list.

This tool also displays “People you may know” which I have found is very good at suggesting people that have many mutual friends as me.

50. Share this article with your facebook friends

If you share this post with your facebook friends and it will become obvious to them that getting more fans important to you, and if you have included a link to your facebook page in your info box or the “Website” section of your website there is a good chance that they will click it.


 

How To Add Image Magnifier In Blogger Using Jquery Effect (Blog trick)

Magnifier Image effect is an awesome image effect that enlarge images or screenshot on both blogger or wordpress when mouse hover. Image effect makes images more special and beautiful. This is one of the most nice image effect and also worth for using on your blog. But how to add image magnifier effect in blogger ? Don't worry just follow the instruction step by step





  • Go to Blogger DashboardDesignEdit HTML
  • Backup your Template before making any changes to your blog
  • Now Expand Widget Templates
  • Find the code shown below using [ctrl+F]

Now find the following code

</head>

Now copy and paste the following code just before or above the just mentioned above

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
 <script type="text/javascript" src="https://rafiblog.googlecode.com/svn/magnify.js"> </script>

  • Now save the template






  • Now for showing effect on images just follow the below instraction just like this

    <img class="magnify" style="width: 210px; height: 250px;" src="YOUR IMAGE URL" />

    Enjoyed the article ? Please share if you like


     

    Add Animated Flying Twitter Bird in Blogger (Blog trick)




    We sometimes visit blogs and see animated flying cute twitter bird. That looks very amazing indeed. One of my visitors requested me how to add an animated flying twitter bird in blogger. Well, you can easily add flying twitter bird in both blogger and WordPress. But the procedure is different in two section.







    You already have seen the flying twitter bird in my website. Today i am only talking about blogger but how to do this in WordPress, will tell later.

    Log in to blogger > Design > Edit HTML

    Now press CTRL+F and find the following code

    </body>

    Now paste following code just after </body>

    <script src='https://rafiblog.googlecode.com/svn/flyingtwitter.js' type='text/javascript'>
    </script>
    <script type='text/javascript'>
    var twitterAccount = &quot;your twitter username&quot;;
    var tweetThisText = &quot; <data:blog.pageTitle/> : <data:blog.url/> &quot;;
    tripleflapInit();
    </script>

    You have to replace your twitter username with the highlighted color text. Save the template and see a nice animated flying twitter bird
    If you like please spend few moments to share this with your friends

    For Further Reading, 
     


     

    Blogger Navigation - Page Numbers for Comments(Blog trick)

     Earlier we enjoyed blogger page navigation for posts, now we have a navigation system for comments. By default, Blogger shows 200 comments per page and show navigation links (oldest,older,newer and newest) at the top and bottom if you have more than 200 comments on any post. If you don't like the default navigation system and want to place page navigation with numbers, this is very useful widget for you.


     Important Point

    • Comments navigation only works if you have more than 200 comment in your blog post.
    • Comments navigation will not works for Threaded Comments. As threaded comment system Loads old comments with the help of AJAX

    How to add Comment Navigation numbers?

    1. Go to Blogger > Template > HTML > Proceed and check Expand Widget Templates
    2. Search for this code
    3. <b:includable id='comments' var='post'>
    4.  Place the Below Code AFTER it.
    5. <b:if cond='data:post.commentPagingRequired'>
      <script type='text/javascript'>
      var w2bTotalComments =
      <data:post.numComments/>;
      var w2bPrevBtnText = "Prev";
      var w2bNextBtnText = "Next";
      </script>
      <script type="text/javascript" src="https://folsol.googlecode.com/files/folsol_commentspagination.js"></script>
      </b:if>
    6. Find this code 
    7. ]]></b:skin>
    8. Add this style code BEFORE it.
    9. .w2bCommentsPaging{
      font-size:12px;
      display: block;
      }
      .commPageOf{
      padding:5px 10px;
      margin-right:6px;
      }
      .commPrev a,.commNext a,.commentNum a {
      text-decoration:none;
      background: #4E4E4E;
      padding: 5px 10px;
      margin: 0 4px;
      text-decoration: none;
      color: #FFF;
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      border-radius: 3px;
      }
      .commPrev a:hover, .commNext a:hover, .commentNum a:hover, .commentNum.commCurrent a{
      background:#8956B8;
      color:#fff;
      }
      .paging-control-container {
      clear: both;
      display: block;
      float: none;
      font-size: 80%;
      margin: 10px 0;
      overflow: hidden;
      padding: 10px 0;
      text-align: right;
      }
    10. Save Your template and you're done with it.


     

    How To Add Loading Effect On Blogger (Blog trick)

    Loading effect is a very nice effect. When visitors access your blogger website they will find a loading effect until the the webpage fully loads. Obviously effects are sometimes very necessary to attract readers, such as loading effect. Normally blogger webpage loads quickly but due to some heavy templates it may cause the loading slow. Its may also visitors to leave your site. But i am enough sure if they find a the effect while loading, they must be curious and don't feel awkward


    Here is a nice demo for you

    View demo


  • Log in with your blogger account

  • On the dashboard → Design → Edit HTML

  • Now backup your current template

  • Tic on Expand Template Widget

  • search code following code


  • <body>
  • Having met the code mentioned above,Delete it and replace with the code below

  • <body onLoad='init()'><div id='loading' style='position:absolute; 
    width:100%; text-align:center; top:300px;'> <img border='0' 
    src='http://i1220.photobucket.com/albums/dd456/cybersahrul/loading.gif'/>
    </div> <script src='http://loading-js.googlecode.com/files/loading.js' type='text/javascript'/>
    

    Save the template and done :)

    Comment here if you like the tutorial and good luck


     

    Add Tilt Image Effect To Blogger (Blog trick)

    Tilt image effect is an effect when you place your mouse pointer on the image, it will be shaking. Tilt image effect is really awesome effect only for blogger. There are many image effects for blogger and it is one of them. I already noticed many bloggers liked this effect. In the previous i posted about Image Shadow effect and Image Zoom Effect. It is also cool. You just have to see the demo, then decide.




    Here is the demo. Place your mouse pointer on the below image to see the effect


    View demo
  • Go To Blogger → Design → Edit HTML



  • Press CTRL + F To Find the follwing code




  • ]]></b:skin>
    
    Copy and Paste the below code just Above/Before ]]></b:skin>

    .post img {
    -webkit-transition:  -webkit-transform .15s linear;
    -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
    -moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
    padding: 5px 5px 5px 5px;
    -webkit-transform:  rotate(+2deg);
    -moz-transform: rotate(+2deg);
    }
    .post img:hover {
    -webkit-box-shadow:  0 3px 6px rgba(0,0,0,.5);
    -moz-box-shadow: 0 3px 6px rgba(0,0,0,.5);
    -webkit-transform:  rotate(-1deg);
    -moz-transform: rotate(-1deg);
    }


    Save the template and done
    Enjoyed the article ? Please take only 10 seconds to share this article if you like


     

    How To Remove Hello Bar Logo From Blogger (Blog trick)



    Hello bar is a sticky bar that displays announcement and important messages or link. Hello bar now a days becoming popular. But Hello bar H logo containing backlink, when a reader clicks on the logo, it redirects to hello bar homepage. A small CSS code will aid you to remove the Hellobar "H" logo


    Removing Hello Bar logo From Wordpress




  • Log in to your site




  • Now you have to add the following CSS code In header.php file




  • Open header.php file and add the following CSS code above </head>


  • <style type='text/css'>
    a#hellobar-logo, a#hellobar-logo:link, a#hellobar-logo:visited {
    display:none;
    }
    </style>
     

  • Now save the file and done



  • Removing Hello Bar logo From Blogger


  • Go to Blogger dashboard → Design → Edit html





  • Now add the following CSS code just above ]]></b:skin>



  •  a#hellobar-logo, a#hellobar-logo:link, a#hellobar-logo:visited {
    display:none;
    }
     

  • Now Save




  • I hope you all enjoyed the tutorial. Please share if you like
     


     
     

    Copyright © 2011. Tricks Duniya - All Rights Reserved