Showing posts with label Facebook. Show all posts
Showing posts with label Facebook. Show all posts

Saturday, 31 December 2016

Putting a badge for a Facebook Page into your Blog

This article describes making a Facebook badge to promote your page, and putting it onto your blog.

What is a Facebook page

This article is about how to make a badge to promote a Facebook Page.

This is an example of the "follow me" approach to linking your blog and the social networks, although for Facebook pages your reader becomes a Fan rather than a Friend.

Many people are confused about when they should use each of the types of "thing" in Facebook, ie
  • Profiles - accounts for flesh-and-blood, living, breathing, individual people
  • Pages - for websites, brands, and organisations that don't want to approve all their Facebook members
  • Groups -  for organisations that want to approve individual members who join (and in return, group-owners can send private messages to individual members.
The most common "thing" for blogs to have is a Page - and a Badge is the tool which Facebook provides to help you to promote a Page on your blog or other website.


How to make a badge to promote a Facebook Page

View all your Pages using the arrow drop-down at the very top right of Facebook's toobar.
(Facebook chance the place for actions like this from time to time - you may need to look around to find your pages.)

Copy the URL for the Page you want to promote
(One way is to right click on its name, and choose copy-link-location- or whatever phrase your browser uses.   Another is to to go the page, and copy the URLfrom your address bar.)

Come back to this article and click  here --- Facebook Social Plugins, to reach Facebook's tools.
(I used to have instructions to launch this from Facebook - but I cannot find any link to it from my Pages page any more.)

Choose Page Plugin  / Web.  

Scroll down the page, and set the options for your badge.  The first one is critical - the others optional:
  • Facebook Page URL - this needs to be changed to the URL of your page (which you copied earlier)
    If you have less than 25 Fans already, then your page's URL will be something like http://www.facebook.com/pages/Blogger-Hints-and-Tips/144194435594821 and you can get it by copying the link from the list of Pages for your account.
    Once you have more than 25 fans, you can choose a  page-url on the Edit Info > Username screen.
  • Tab - the tab on your page that is shown
  • Width - choose a value that suits the space on your template where you want to put the box.
  • Show faces, show header:  choose options that suit your purpose and blog template
  • Show stream:  this controls whether you show posting from the Page inside your blog
As you choose options, the preview at the bottom updates to show what the button will look like:



When you are happy with the selections, choose Get Code.
  • Currently, there are options for an iframe or Javascript SDK:   I recommend using the iframe, unless you are comfortable with the two-part installation needed for the Javascripit, and you are sure that the visitors you want to target will have Javascripti enabled. 



Copy the code provided

Install the code into your blog - there several options for installing the HTML, depending on where you want to put the badge or button.


Job Done!   Your blog will now display a gadget that promotes the selected Facebook page - people can view and like your Page from within your blog.


What your visitors will see

People who visit your blog through a web-browser will see a Facebook area, including a Like button and whatever other options you have chosen.

This can be quite a powerful tool:  you can easily use two or three different combinations on different parts of your blog:  one that has no border, no faces and no header but does show a Stream can effectively look like a "live" feed from your Facebook page to your blog, while another one with different options can show off the size of your fan-base.

Be aware that the Like button shown in this button gives people the option to Like your Page in facebook  - not your blog directly, and not the current post that they are reading.   If you want them to be able to Like your blog or blog-posts, you need to provide this option separately (and many of your visitors are likely to be confused by the different).

As always, people who read your blog via a feed reader (Bloglines, Google Reader, etc), or by email subscription (eg having used follow-by-email) may not see the Facebook item, depending on where is places and what options their email program has.


Customizing the code

You can change the characteristics of the box without having to generate the code from Facebook again.   For example you can later the width and/or height - just remember to do it in both of the places required if you are using the iframe option:
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogger-Hints-and-Tips%2F144194435594821&amp;width=160&amp;colorscheme=light&amp;show_faces=false&amp;border_color=purple&amp;stream=true&amp;header=false&amp;height=395" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:160px; height:395px;" allowTransparency="true"></iframe>

fyi, I could have just quoted this code, and said to use it on your blog.  But I don't usually do this when I'm describing how to link Blogger and any third party product, because it's likely that Facebook (or whoever) will change their code in the future:  it's always safest to get the most up-to-date copy of the code from the source-site when you need it.

The facebook page where you get the code from also has more information about controls you can set in the code, too.   Check it out for more information.


Do you need to own the page you want to promote?

No - not any more.

At one stage, the first step in these instructions was to
"Log into Facebook with a profile (ie personal account) that has administrator rights for the page you want to promote."

But that's no longer necessary.   You can promote any Facebook page that you want to, on your blog.

But be aware that if you show the page-feed on your blog, and you don't own the page, then you have no control over what is shown.   It's possible that a feed from someone else's Page will show material which breaks Blogger's terms and conditions - or which you simply don't want on your blog.    For this reason along, I'd recommend only promoting your own, or closely trusted, pages on your blog.




Related Articles

Putting HTML from a third-party into your blog

How the data in Blogger blogs is organised

Linking Blogs and Websites

Tools for linking Blogger and the Social Networking sites

Putting a Facebook "share this" button on your blog

Copyright, Blogs and Bloggers

Why RSS / Subscribe to Posts is important for bloggers

Wednesday, 3 December 2014

Facebook Popup Like Box Widget For Blogger

Facebook has become the leading social media service on the Internet playing host to over 1.3 billion users; of those, 800 million login to their dashboard feeds at least once a day. Thanks to the vast number of active users on services like Facebook, acquiring new readers as a blogger or content provider has become easier than ever.

In order to produce an effective digital campaign, you absolutely must take advantage of social media by doing things like integrating Facebook on Blogger. Email marketing can be useful, but it comes with restrictions that could limit your blog's potential. Perhaps the most significant problem is that emails don't come with a face or personality like Facebook does.

Think of a time when you received an email in you inbox from someone you didn't know. Where you inclined to open it or did you send it right to the junk folder? If it's your first introduction to new consumer, they simply don't know who you are, what you want, and how you got their email. This sets off an initial breakdown of any type of trust that might have developed. The reputation of email marketing is further deteriorated with a study done by Kaspersky Lab, an Internet research firm. They estimate that around 70% of all the emails sent in the world are spam.

Sharing site content using a Facebook Like Box is just one of many strategies that can generate a regular flow of traffic from a diverse demographic that might have been previously inaccessible. Adding a Facebook Like Box to your site helps to reduces your individual workload, and instead distributes that ability equally among your readers.

When someone reads your content and appreciates the kind of work that you produce, they'll be willing to share that information to their followers and fans, setting off a viral reaction. The first step necessary to making this a reality is to make this change to your site. These next few steps will provide you with a quick and easy guide on how to add a 'Like Box' to your Blogger site so that you can began taking advantage of these great opportunities.


Click here for a DEMO


How to Add the Facebook Popup Like Box Widget

1. Log into your Blogger account and select your blog > go to 'Layout' & click the 'Add a Gadget' link on the right side.
2. Once the popup window is open, select the HTML/JavaScript gadget from the list:


3. Copy and paste the following code inside the empty box:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
<style type="text/css">
#fbox-background{display:none;background:rgba(0,0,0,0.8);width:100%;height:100%;position:fixed;top:0;left:0;z-index:99999}#fbox-close{width:100%;height:100%}#fbox-display{background:#eaeaea;border:5px solid #828282;width:340px;height:230px;position:absolute;top:32%;left:37%;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}#fbox-button{float:right;cursor:pointer;position:absolute;right:0;top:0}#fbox-button:before{content:"CLOSE";padding:5px 8px;background:#828282;color:#eaeaea;font-weight:700;font-size:10px;font-family:Tahoma}#fbox-link,#fbox-link a.visited,#fbox-link a,#fbox-link a:hover{color:#aaa;font-size:9px;text-decoration:none;text-align:center;padding:5px}
</style>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie=function(a,b,c){if(arguments.length>1&&"[object Object]"!==String(b)){if(c=jQuery.extend({},c),null!==b&&void 0!==b||(c.expires=-1),"number"==typeof c.expires){var d=c.expires,e=c.expires=new Date;e.setDate(e.getDate()+d)}return b=String(b),document.cookie=[encodeURIComponent(a),"=",c.raw?b:encodeURIComponent(b),c.expires?"; expires="+c.expires.toUTCString():"",c.path?"; path="+c.path:"",c.domain?"; domain="+c.domain:"",c.secure?"; secure":""].join("")}c=b||{};var f,g=c.raw?function(a){return a}:decodeURIComponent;return(f=new RegExp("(?:^|; )"+encodeURIComponent(a)+"=([^;]*)").exec(document.cookie))?g(f[1]):null};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#fbox-background').delay(5000).fadeIn('medium');
$('#fbox-button, #fbox-close').click(function(){
$('#fbox-background').stop().fadeOut('medium');
});
}
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });
});
</script>
<div id='fbox-background'>
<div id='fbox-close'>
</div>
<div id='fbox-display'>
<div id='fbox-button'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
href=https://www.facebook.com/pages/Helplogger/120574614736021&width=339&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'
style='border: none; overflow: hidden; background: #fff; width: 339px; height: 200px;'></iframe>
<div id="fbox-link">Powered by <a style="padding-left: 0px;" href="http://helplogger.blogspot.com/2014/12/facebook-popup-like-box-blogger-widget.html" rel="nofollow">Helplogger</a></div>
</div>
</div>
4. Press the 'Save' button to add the widget to your blog. That's it!

Facebook Popup Like Box Customization

After adding the code, replace the address in blue https://www.facebook.com/pages/Helplogger/120574614736021 with your site's facebook page URL.

The widget will appear 5 seconds after the page finishes loading. If you want to change this delay, change the number 5000 to a greater or lesser number in this part:
.delay(5000)
By default, the like box only shows up the first time the user visits your page.  If you would like the Facebook box to popup every time the page loads, then remove this line of code:
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });
If you want to display only when user visits your homepage, go to 'Template' > hit the 'Edit HTML' button on the right side and search by clicking anywhere inside the code area and pressing the CTRL + F keys for this tag:
</body>
Paste the facebook popup widget right above the body tag and make sure to include the conditional tags below:
<b:if cond='data:page.type == "index"'>ADD THE FACEBOOK WIDGET CODE HERE </b:if>
After saving this widget, you can test it out by returning to one of your old posts which should bring up a little popup widget asking if you'd like to join the site's Facebook page.

If you don't see the Facebook Like Box on the page, you may need to delete your cookies or check out the 'Customization' section above in order to display the widget every time a user visits your site. Once this widget is added to your site, all your hard work should start to translate into an increase in web traffic and number of Facebook fans.

Thursday, 6 November 2014

How to include the blog post description when you share on Facebook

This article shows how to make that the description is correctly shown when one of your blog-posts is shared on Facebook.




When you share one of your blog-posts using either the via the "what's on your mind" space on Facebook or the Facebook share button on your blog, you may find that the only information automatically shown is:
  • A picture (hopefully, but not always from the post)
  • The post title
  • The blog URL or the post URL

But many people want the post-description to be included too.

There are two things which you need to do to make sure that this happens correctly.


Step 1: Add search descriptions to your blog-posts

If a post does not have a description, Facebook will sometimes try to estimate one based on the contents. But this is not reliable, and it depends on the blog template you have used, and possibly even on other factors, eg at one stage, Facebook just looked for the the first
(paragraph) tag with at least 120 characters in it - which gave very odd results for some Blogger users. Alternatively it may try to use your post.summary but this also depends on your template.

A more reliable approach is for you to provide the description-text for each post.

For Blogger, the way to do this is described here.

For Wordpress, you need to to use an SEO plugin like SEO Ultimate to do this.

Step 2: Add Open-Graph tags to your template

Some templates already contain code which causes Facebook to estimate the description correctly. But some don't - and some may use two-step methods, eg relying on schema.org tags to imply Open Graph tags.

So, as with descriptions, it's more reliable to ensure you are using the set of tags that Facebook officially supports. These are the Open Graph tags.

You can see how to apply them in Blogger  or there are various plug-ins you can use on Wordpress.

Job Done! Once you have made these two changes, when someone shares your blog on Facebook, your own post-description should be shown. Don't forget to test your changes - as described in the Adding Open Graph tags to Blogger article.


What your readers see

Nothing! People who get to your blog using a web-browser, or who subscribe to your RSS feed or who follow-by email don't see anything different after you have done the steps above.

The only different is when they share a post from your blog in Facebook:  the initial description will come from your Description tag for the the post, not from the overall blog.


What happens for posts that do not have search descriptions

This depends on your blog's template, and on how Facebook is interpreting the information that it provides. You can see what Facebook will do for specific posts using the tag-debugging tool which Facebook provide.

Adding descriptions to old posts is tedious. But if your posts are often shared on Facebook, it may be worthwhile for you to allocate some time each day to edit a few posts LINK and update them with a current description. Provided you don't spend too long working out what the description should say, it should be possible to update 200 posts in a three weeks if you spend ten minutes each day doing just this.

What's more, it is possible that adding descriptions to your posts will make them look more attractive in regular Google search results too, which is A Good Thing if search-traffic matters for your blog.




Related Articles:

How to add a Description meta-tag to posts in Blogger

How to apply Facebook's OpenGraph labels in Blogger

Reasons why SEO and search-traffic don't matter for many blogs

Thursday, 20 February 2014

Add floating social media sharing buttons below Blogger post titles

It is becoming increasingly important to make our posts appreciated and shared on social networks and one of the best ways to get traffic to our blog or site and boost sharing stats is to add social sharing buttons.

In this tutorial we will see how to add a floating social media sharing bar below the title of Blogger posts, so when a reader scrolls down the page, he will still be able to see the sharing buttons without having to scroll back to the top.

Adding the below jQuery script will make the buttons float in a fixed position as soon as they reach "the top" of the page. By scrolling back, the buttons will return to their initial position.

The social sharing bar includes buttons for Facebook, Twitter, Google+, and Pinterest.

Social Media Sharing Buttons below Blogger Post Title

Step 1. From the Blogger Dashboard, go to "Template" and click on the "Edit HTML" button:


Step 2. Click anywhere inside the code area and press the CTRL + F keys to open the search box. Once you see the search box, type the </head> tag inside the search box and hit Enter to find it.

blogger search box, ctrl + f

Step 3. Just above </head> add this script:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>

<script type='text/javascript'>
//<![CDATA[
$(function() {
var $movesbuttons = $("#floating-social-buttons"),
$window = $(window),
offset = $movesbuttons.offset();
$window.scroll(function() {
if ($window.scrollTop() > offset.top) {
$movesbuttons.css({'position' : 'fixed', 'width' : '550px', 'top' : '0px'});
} else {
$movesbuttons.css({'position' : 'absolute', 'top' : 'auto'});
}
});
});
//]]>
</script>
Step 4. Now before the ]]></b:skin> tag (press CTRL + F to find it) add the following CSS styles:
#floating-social-buttons {
padding: 6px 0px 12px;
position: absolute;
background: #F6F6F6;
border-bottom: 1px solid #DEDEDE;
width: 550px;
height: 18px;
z-index: 99;
}
.floating-social-buttons {
margin-left: 5px !important;
}
.floating-social-buttons li {
float: left;
margin-left: 5px;
list-style:none;
}
To change the width of the bar, modify the 550px values in red. Note that this value also appears in the script which also needs to be modified.

Step 5. Finally, just below the second <div class='post-header'> (press CTRL + F and hit Enter twice to find the second one) add the following code:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='padding:5px 0 35px 0;clear:both;'>
<div id='floating-social-buttons'>
<ul class='floating-social-buttons'>

<li><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp;height=25&amp;action=like&amp;font=tahoma&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:100px; height:25px;'/></li>

<li><a class='twitter-share-button' data-lang='en' href='https://twitter.com/share'>Tweet</a><script src='//platform.twitter.com/widgets.js' type='text/javascript'/></li>

<li><script src='http://apis.google.com/js/plusone.js' type='text/javascript'/><g:plusone expr:href='data:post.url' size='medium'/></li>

<li><a class='pin-it-button' count-layout='horizontal' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;&amp;media=&quot; + data:post.thumbnailUrl + &quot;&amp;description=&quot; + data:post.snippet' style='margin:0 10px 5px 0;'>Pin It</a> <script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/></li>

</ul>
</div>
</div>
</b:if>

Customizing the Floating Social Media Sharing buttons

If you want the buttons to appear at the end of the post, paste this code before or after <div class='post-footer'>
If the bar overlaps with the post content, then change 35px to a higher value.

Step 6. Click on the "Save template" button and you're done!

So these were the steps for adding the horizontal social buttons bar on Blogger. Using this bar it is also useful as it could help you to get more social traffic for your blog.

Friday, 11 October 2013

Funny Facebook files deliver malware


I've recently got notified on an interesting malware campaign. I'll start with some screenshots:


Save the file and run! It is funny :)

DivX plug-in Required!


























 
Download and execute the facebook app, please!














Some examples of files that can be downloaded:
IamFunnyPNG-facebook.com
IamFunnyPNG-fb.com
IamNakedBMP-facebook.com
IamNiceTIFF-fb.com
IamSexyPIC-fb.com
IamSexyPNG-fb.com
MeBitchTIFF-fb.com
MeFunnyJPG-facebook.com
MeNakedJPEG-fb.com
MeNakedPIC-facebook.com
MeNiceGIF-fb.com;
MeNicePNG-fb.com
MeSexyJPEG-facebook.com
MeSexyPNG-fb.com
YouNakedJPG-fb.com
YouNiceBMP-facebook.com
YouSexyJPEG-fb.com
YouSexyPIC-facebook.com
YouWhoreJPEG-facebook.com


I think you get the point here. Users are being socially engineered to download a file that seems to originate from Facebook. The file is supposed to be an image file (PNG, TIFF, BMP, JPEG and even "PIC") but is in fact an executable. The initial landing page also ends in names of females, for example "laura.html" or "birgitta.html" .


Let's take a look at one of the downloaded files:
IamWhoreJPG-facebook.com
MD5: 1273f3ea6ae76340270bab57b073b0b5
Anubis Result
Malwr Result
VirusTotal Result


Unfortunately I was unable to execute the malware, as I currently don't have a physical machine to test it. According to VirusTotal results, it may be a Trojan called Yakes or Tobfy:
Trojan:Win32/Tobfy is a family of ransomware trojans that targets people from certain countries. It locks your PC and displays a localized webpage that covers your desktop. This webpage demands the payment of a fine for the supposed possession of illicit material.

Some variants might also take webcam screenshots, play an audio message pretending to be from the FBI, closes or stops processes or programs, and prevents certain drivers from loading in safe mode - possibly to stop you from attempting to disable the trojan.
See: https://www.microsoft.com/security/portal/threat/encyclopedia/Entry.aspx?Name=Trojan%3AWin32%2FTobfy

According to Ydklijnsma, this specific campaign drops bitcoin miner malware. See:
There's a good blogpost by Brian Krebs on the subject of bitcoin mining malware:
http://krebsonsecurity.com/2013/07/botcoin-bitcoin-mining-by-botnet/



Most of the malware seems to be hosted via the domain registrar "Hong Kong Sun Network":
Hong Kong Sun Network - hosting multiple malicious websites
























Some IPs that are involved - next to it their abuse contacts:









I'm betting it's safe to assume the worst and block these IPs (more investigation is needed though):
91.218.38.0/24
103.9.150.0/24
109.73.166.0/24
112.213.106.0/24
121.127.226.0/24
188.190.120.0/24

Most of the sites use the pattern described here:
If you're interested in some of the websites that are serving this malware, visit the following Pastebin:
http://pastebin.com/raw.php?i=8BqGPvhX
Note that links may still be live! 




Conclusion


  • Don't be fooled by websites that seem to resemble Facebook, always check the URL you are currently on before downloading or executing files
  • Install an antivirus and antimalware product and keep it up-to-date & running
  • Use a linkscanner to verify the integrity of a link on either http://www.urlvoid.com or https://www.virustotal.com/
  • Use NoScript in Firefox or NotScripts in Chrome to block malicious attempts on unknown sites
  • Running "funny Facebook files" will usually provide you with everything but fun


Monday, 24 June 2013

Gina Lisa Facebook scam



Yet another Facebook scam, this time luring users with a sextape from Gina Lisa, whom is apparently a German model:


Yet another Facebook scam: "Gina Lisa Sextape"





















When you click on the link you get:
Verify your age first
















When you click on the video to "verify your age" you are redirected to what appears to be a site for gambling, pokergames, etc....:

Subscribe and get a free bonus. Looks legit
















I suspect you'll probably have to pay up sooner or later to continue playing. Stargames.com is apparently known for spamming blogs & other sites.

hXXp://hot-movie.pw - URLvoid Report
hXXp://stargames.com - URLvoid Report



This scam and/or spam will also post on Facebook on your behalf. Go over your Privacy Settings on Facebook and make sure you delete this "app" if you see it. Remove any posts you have made as well and report posts similar as this made by your friend(s).



Prevention

Pretty straightforward: do not click on any of these links, how tempting they might be ! Ask your friend if he or she knows what it means, and slightly hover over the post until the 'X' becomes visible. You can then mark the post as spam, and it will be removed from your friend's wall.

It might also help to install the WOT extension into your browser. (Compatible with most modern browsers)
WOT is a community-based tool and is therefore very useful for these kinds of scams, whereas other users can warn you about the validity.
More information and to download WOT: http://www.mywot.com/



Conclusion
To keep it short and simple:
don't fall for these types of spam/scam, most of the times it's pretty obvious it's fake.

Sunday, 9 June 2013

How to install Facebook's Open Graph tags into Blogger

This article shows how to install Facebook's Open Graph tags into Blogger


Why Open Graph 


Neil Patel recently explained on Quick Sprout why having Facebook and Twitter tags installed into your blog is important.

To cut his long story short, if you install them, then when someone shares your blog-post, the shared item looks better. This means that more people are likely to follow the link and/or share it themselves - so your blog gets more traffic, and people think you're more professional and thus credible.

Neil also stated that if you don't use Wordpress, "you’ll need to manually generate meta tags for each page on your site" - but fortunately for Blogger users who are brave enough to edit their template that's not true.   Blogger provides lots of SEO-supportive features these days, and you can easily use them to make OG-tags work on your blog - even if you haven't quite got your head around what OG is - personally it took me months to understand what it was all about.

The following sections have more details about how to do this.


How to install Facebook's Open Graph tags into a blog made with Blogger


Edit your template in the usual way.

1     Tell Google about the namespace:

Find the opening <html  ... statement, and add the Open Graph namespace information to it.   The code to add is
xmlns:og='http://ogp.me/ns#'
and it goes after the existing namespace statements.   For example, my current tag looks like:
<html b:version='2' class='v2' expr:dir='data:blog.languageDirection'
xmlns='http://www.w3.org/1999/xhtml'
xmlns:b='http://www.google.com/2005/gml/b'
xmlns:data='http://www.google.com/2005/gml/data'
xmlns:expr='http://www.google.com/2005/gml/expr'    >

or like this after the line is added:
<html b:version='2' class='v2' expr:dir='data:blog.languageDirection'
xmlns='http://www.w3.org/1999/xhtml'
xmlns:b='http://www.google.com/2005/gml/b'
xmlns:data='http://www.google.com/2005/gml/data'
xmlns:expr='http://www.google.com/2005/gml/expr'
xmlns:og='http://ogp.me/ns#'>


2   Add the Open Graph tags


Find the closing </head> tag.
(Hint:  I often search for just </head   ie without the closing >, in case there's something else in the tag in my template)


Put the following code immediately before it:
<!-- Begin Open Graph metadata --> 
<meta expr:content='&quot;en_US&quot;' property='og:locale'/> <meta expr:content='data:blog.canonicalUrl' property='og:url'/> 
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta content='article' property='og:type'/>
</b:if> 
<meta expr:content='data:blog.title' property='og:site_name'/> 
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='
URL-FOR-IMAGE-YOU-WANT-TO-USE-IF-THERE-IS-NOT-A-THUMBNAIL-PHOTO-IN-THE-POST' property='og:image'/>
</b:if>
 
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<!-- Still looking for a way to use the post snippet if there's no description -->
</b:if>
<!-- End Open Graph metadata -->


This code needs to be adapted for your blog.   In particular:
  • en_US
This value is fine if your blog is written in US-English. But if you are writing in UK-English, you may want to change it to en_GB.   

And if you are using a different language altogether, you should change it to the two letter code for that language-territory combination:   see https://developers.facebook.com/docs/internationalization/  for more information about the codes that they support

  • URL-FOR-IMAGE-YOU-WANT-TO-USE-IF-THERE-IS-NOT-A-THUMBNAIL-PHOTO-IN-THE-POST 
Replace this with the web-address of a picture that you want to use if the individual post doesn't have a thumbnail  - perhaps your logo, or a blogger logo.


  • App-ID and Facebook-Profile-ID
If you have got an App-ID associated with your blog, perhaps because you signed up to use Facebook commenting with it, then you may also want to add the following statements, just before  the "<!-- End Open Graph metadata -->"
<meta content='App-ID' property='fb:app_id'/>
<meta content='Facebook-Profile-ID' property='fb:admins'/>


Of course putting in your own values instead of the ones in red   (I'm assuming that if you knew enough to get an App-ID, then you will know how to find it, and also about the risks associated with linking your Facebook-profile-ID to your blog.)


3    Check it's complete:

Preview the template changes to make sure that they've worked, and then save them.




Troubleshooting


Testing the OG tags

Facebook have a tool that you can use to see what values the OG tags in your blog have.
It is found here: https://developers.facebook.com/tools/debug

Enter the URL of one of the posts from your blog and click Debug to see the OG tags which Facebook finds for it.



Descriptions

The Descriptions tag will only work if you have Search-descriptions on (Option > Search > Meta-tags > Enabled), and have entered a search description for each post using the post-editor.   I had hoped to be able to use post.snippet when this wasn't available, but have not been able to work out the correct syntax to do this.

Pictures

Facebook would like you to use an image that's at least 200x200 as your posts's thumbnail image or as the default image to use for posts that don't have one.

If the picture that you use is smaller than this, they do appear to use it.

However you will see the following message when you use a debugging tool to look at what tags Facebook is reading from your site:
og:image should be larger
Provided og:image is not big enough. Please use an image that's at least 200x200 px. Image 'http://3.bp.blogspot.com/XXX.png' will be used instead.




Related Articles:


How to add Twitter-Cards to Blogger - these are the Twitter equivalent to Open Graph tags

Advantages and disadvantages of editing your Blogger template

Post.thumbnail:   a summary image for a post

How to edit your Blogger template

Linking your blog to the social networks

Sunday, 26 May 2013

How To Add Social Media Icons to Blogger Header

social media icons, facebook icons, social media icons for bloggerThis tutorial will help you to add social media icons in the top right corner of the page which could increases the likelihood that readers can follow through the various social networks. There are several ways to do this, like adding a new widget section to the blog header but now, we'll do it using an unordered list that uses icons of Facebook, Twitter, Google+ and blog feed, and as a bonus, the icons will rotate when you hover over them.

You can see a demo in this test blog.


Adding Social Media Icons to Blogger Header

Step 1. From your Blogger dashboard, go to Template and click on the Edit HTML button:

blogger blogspot, blogger template, blogger gadgets

Step 2. To expand the style, click on the small arrow on the left of <b:skin>...</b:skin> (screenshot 1), then click anywhere inside the code area to search (using CTRL + F) for the ]]></b:skin> tag (screenshot 2) and add this code just above it:

 /* Social icons for Blogger
----------------------------------------------- */

#social-icons {
margin-bottom:-30px;
height:50px;
width:100%;
clear:both;
z-index: 2;
position: relative;
}
.social-media-icons {
display:table
}
.social-media-icons ul {
text-align:right;
padding:5px 5px 0 0
list-style-image:none;
list-style-position:outside;
list-style-type:none;
}
.social-media-icons ul {
margin-bottom:0;
padding:0;
float:right;
}
.social-media-icons li.media_icon {
margin-left:6px;
padding-left:0 !important;
background:none !important;
display:inline;
float:left;
}
.social-media-icons li:hover {
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(-360deg);
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}

Screenshot 1:


Screenshot 2:


Step 3. Now search for this line

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

Step 4. And just above it, add this code:

<div class='social-media-icons' id='social-icons'>
<ul>

<li class='media_icon'><a href='http://facebook.com/username'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiR8yjpZiobvb7HWvaoWbwFCURUwM1LSoOcjd8u0I5U3IIP5_LkxiDEEKO1MR-I8AOFYsdLxvD6BPwajc05sSo7ojAjVMaIg5aoQv_xHzqoBdzeT2dMpxZPhbABpmH7rLTBHmI7BQmohQ0/s1600/Facebook.png'/></a></li>

<li class='media_icon'><a href='http://twitter.com/#!/username'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie-wsSjG-4QEUm51tFZXaYuOaXCnfeEhGgdeQnHt2zIDAuUsAjG0Fy0HFvmn5LyNFhdCScriaWKvbgKAKfddHAevWJ9CHtofPvRqDIM4iNy1-Ab-FPglM4ZkYQY5QNuuc8leNJccA5agw/s1600/Twitter.png'/></a></li>

<li class='media_icon'><a href='https://plus.google.com/XXXXXXXXXXXXXXXXXX/about'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHTeWEUB0NeO0lxngxJo-VIGFdQo54yQHmSr6RWCksvGVaMY2kh5wfxyzVkw0UqraET8xwzjT5oY4oJ8TcclA8xqbOosIDj1gdfym7i7vMc_GC6FTC5Z00qo8mjH9k48pzq4XrLtZ6s7I/s1600/googleplus.png'/></a></li>

<li class='media_icon'><a href='http://name-of-your-blog.com/feeds/posts/default'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIWTD3C4O-z3tM5H97l55iWOS56DJSUGqPyu4w1Lc3BRB4lvJhrQhLz7zvoyDdbAP1qFdFudoh5bTpHVAjIHSgeTn8TOOYyLmvj11nJL0YrLOUEefeevf0ndSXont7H8ur7f9AEzyzlRo/s1600/RSS.png'/></a></li>

</ul></div>

Customization

- Change what's in red with your usernames and id: the first is your Facebook username, the second is that of Twitter, in the third you should change the X by the ID of your Google+ profile and in the fourth you will put the name of your blog.
- To change the icons, just replace the urls in blue with the ones of your images.
- You can add more icons if you want, you just have to add before </ul></div> a line like this for each extra icon you want:

<li class='media_icon'><a href='Link URL'><img border='0' src='Image URL'/></a></li>

Step 5. Finally, Save the Template to apply the changes.
The effect is done with CSS3, so this effect will not work in older browsers.

Monday, 6 May 2013

Facebook Status Quotes About Life and Love 2013

Now a days people change their Facebook status to keep their family and friends updated about their activities, their views about something, their mood, and much more. As facebook is evolving as the best social networking site, people are utilizing the Facebook status in the most innovative ways. Facebook users often search for status quotes to post on facebook.
Mostly people try to impress their friends through their FB Status. Here bestrix.blogspot.com will provide you some Facebook Status Quotes about Life and Love.

Facebook Status Quotes About Life


  • Every day you need to look yourself in the eye and ask yourself if this is what you should be doing with your life.
  • Yea I make mistakes but …. life doesn’t come with instructions.
  • Life is a big question that even google can’t answer.
  • Don’t wait for the right person to come into your life. Be the right person to come into someone’s life.
  • We never get what we want. We never want what we get. We never have what we like. We never like what we have. That is life.
  • You were given this life because you are strong enough to live it.
  • Your life is your message to the world. Make sure it’s inspiring.
  • I was smiling yesterday, I am smiling today and I will smile tomorrow. Life is too short to cry for anything.
  • Life is like the ocean. It can be calm and still or rough and rigid but in the end, it is always beautiful.
  • Enjoy the little things in LIFE …. One day you will look back and realize they were the big things.
  • Don’t let a bad day make you feel like you have a bad life.
  • Everytime you subtract negative from your life, you make room for more positive.
  • Don’t worry we all make mistakes so forget about the past & move on with life.
  • Life has no remote. Get up and change it yourself.


Facebook Status Quotes About Love


  • And in the end, the love you take is the love you make.
  • Once in a while, right in the middle of an ordinary life, love gives us a fairytale.
  • Ever has it been that love knows not it's own depth until the hour of separation.
  • Love is like a butterfly. If you chase after it, it will fly away. But if you are patient and sit still long enough, it will land into your hands. 


Facebook Status Quotes About Life and Love 2013

People visit this page while searching for the following terms :
  • facebook status quotes about life
  • facebook status quotes about love
  • facebook status quotes about life and love 
  • good facebook status quotes about life and love 
  • facebook quotes about life and love 
  • quotes for a facebook status about love and life 
  • quotes about life and love on facebook 

Saturday, 4 May 2013

How to Get Likes on Facebook Pic Status Photo and Fan Page


As all of know that Facebook is the most popular Social networking site and almost every modern guy/girl have a Facebook account. Everybody share their status and pics on facebook and expect to get likes on Facebook Pics Status and Fan pages.
Here bestrix.blogspot.com will provide you some simple and easy tricks to get likes on Facebook by using genuine methods and tricks.

How to get likes on facebook? 

To get likes on Facebook pics or pages, you need to post something interesting and funny that belongs to you. The content that you are posting on facebook should meet following criteria :
  • It should be unique : Don't copy others. Try to make something of your own. Copy-cats might get some comments but can't get likes.
  • It should be engaging : Your pic or status or fan page should be engaging, so that people like it and watch it again and again. They might share it if they find it funny. If your friends start to share your status and pics then it acts like a chain reaction and you get multiple likes through them.
  • Post something on regular basis : If you want likes on your facebook page /fanpage then you should always post something on regular basis. Either its pics or some status message, it should be engaging and unique.
  • Post puzzles : Puzzles are the best way to engage facebook fans and friends and get likes and comments. Mathematical puzzles are the best in this case as everybody tries to show their intelligence and comment and like on it.
  • Use you watermark on your pics : Use a watermark of your facebook page url on your pics, so that if anybody copy your images, your url will still spread.
Apart from these tricks to get likes on Facebook Pics and status don't try any thing illegal to get likes and comments. Illegal tricks can get you into problem and your facebook account or page might get banned. Some websites sell facebook likes and those likes are from illegal FB account which cam also lead you to problem. Always remember that genuine ways might take some time but they are beneficial in longer run.

People visit this page while searching for following terms :

  • how to get likes on facebook 
  • how to get likes on facebook page 
  • how to get likes on facebook status 
  • how to get likes on facebook photo 
  • how to get likes on facebook fan page 
  • how to get likes on facebook profile picture 
  • how to get likes on facebook picture 
  • how to get likes on facebook page hack 
  • how to get likes on facebook page free 
  • how to get likes on facebook fast 
  • get likes on facebook picture free 
  • get likes on a facebook post 
  • get more likes on a facebook page 
  • how to get likes on facebook automatically 
  • get likes on facebook business page 
  • get likes on facebook band 
  • get more likes on facebook business page 
  • get likes on facebook cheat 
  • get more likes on facebook contest 
  • get likes facebook.com 
  • how to get likes on facebook company page 
  • get likes count facebook 


Saturday, 27 April 2013

Select All Friends on Facebook Javascript Code Chrome Extension

Select All Friends on Facebook

Sometimes you need to invite your friends to like a page or to an event on Facebook. Its easy if your friends are just 20 or 30. But its frustrating if you have to select thousands of friends.
You can't click 1000 times to select 1000 friends. So here the trick to help you.
Bookmarklet
Select All

Add the Bookmark to make it easy

The easier trick is that you just drag the Bookmarklet "Select All" to your bookmark bar and forget it. Once you are on that FB page where you have to select all of your friends just click on this bookmark "Select All". It will select all of your friends in one go. It might take some time depending upon the number of friends you have got. It can take upto 1 min if you have got 1000 friends.

Javascript Code to Select All friends on Facebook

Here i will tell you the javascript code and the method to use it. One you are on the page where you have to select all of your friends follow the following steps. I will suggest you to use Google Chrome.
Step 1: Scroll down in the facebook Select Friends box so that the complete friends list is loaded.
Step 2: Press F12 and go to console tab.
Step 3: Paste the following code into it and press "Enter".

javascript:var x=document.getElementsByTagName("input");for(var i=0;i<x.length;i++) {if (x[i].type == 'checkbox') {x[i].click();}}; alert('Done, all your friends have been selected');

Step 4: Wait for a while till the javascript works. It might take 1 or 2 minutes depending upon the number of friends you have got.
Step 5: It will display a message when all friends are selected. Press "OK" to clear it and then Press "Invite" button on FB.

Facebook Timeline Cover Photo Dimensions | Size In Pixels Inches And cm

Facebook Timeline has attracted a lot of people since it is launched on 24 Jan 2012. However it was available since November, but it was made mandatory on Jan 24th. People were using only a profile pic till that time but now they need a Timeline Cover Photo.
However facebook has provided some methods to use photos from your albums and crop them into correct size to fit your Facebook timeline, but some expert users can design their own Facebook Timeline Cover Photo so that it looks much better.

Facebook Timeline Cover Photo Dimensions

Advanced users need Dimensions to FB Cover Photo to design it using some image editor. Here bestrix.blogspot.com will provide Facebook Cover Photo dimensions in pixels inches and cm.

Facebook Timeline Cover Photo Size in Pixels

  • Width : 720 px
  • Height : 265 px

Facebook Timeline Cover Photo Size in Inches

  • Width : 4 Inch (300 dpi)
  • Height : 1.5 Inch (300 dpi)

Facebook Timeline Cover Photo Size in cm

  • Width : 10.8 cm
  • Height : 4 cm
Here is an example of an attractive FB Cover Photo to give you inspiration to create one
















Sunday, 21 April 2013

How to use Facebook Graph Search in India for Marketing

Facebook Graph Search is the latest search engine to challenge Google. Its not yet released in India but you can view its example on https://www.facebook.com/about/graphsearch . This page shows how Facebook Graph Search will work. As per my knowledge it will be an intelligent search engine, which will be able to analyse the meaning of search queries and show accurate results.



How to use Facebook Graph Search in India for Marketing

Currently Google is being used for online marketing. SEM (Search Engine Marketing) firms are using Google for SEO (Search Engine Optimization). All of their website optimization is being done after keeping Google in mind. But Now number 2 site on the internet is planning to launch its search engine, which will also use its social networking capabilities and it will definitely make a mark on internet. Search Engine Marketers are already planning their strategies to use Facebook Graph Search for Marketing purpose.
We will bring you more information on how to use graph search very soon.

Wednesday, 6 March 2013

How to remove a friend on Facebook ?

If you are a frequent user of Facebook and want to remove a friend from your friends list then you are at right place. This is quiet easy to do.
But you might be thinking that he/she will get a notification that you removed him/her from your friends list. If you are thinking that, then be relaxed. He/She will not get any notification.

How to remove a friend on Facebook ?

Open the timeline of friend whom you want to remove from friend's list.
Click on the Friends Button, as shown in the screenshot.
It will open a dropdown menu. In this menu click on Unfriend as shown in the image below.
And thus he/she is removed from your friends list.
Facebook is the best social networking site in terms of security features. Bestrix.blogspot.com will get you more information and tricks about facebook in near future. Keep Visiting !












Tuesday, 5 March 2013

How to Protect Your Facebook Account from Hackers 2013


Facebook Account and Hackers

Facebook has become a worldwide phenomenon. Every educated person owns a facebook account and updates it on daily basis, sharing his Pics, sharing his views, chatting with friends and lot more. Sometimes we upload some such things on Facebook which are only meant for our friends to see.
Usually Hackers don’t try to use information from a simple individuals account, they need someone big like a celebrity or politician. Then they can use that information to get money from him or some means of illegal activities.
That is one of the reason that celebrities try to avoid using social networking sites to remain unaffected from such problems. Most celebrities and politicians prefer Twitter for such use and to remain in touch with their fans.

How do Hackers Hack your Facebook Account ?

Usually they take help of Fishing Websites. Fishing websites are look-a-likes of original website. When someone goes to such page, he/she thinks  that they are on original facebook login page and they enter their username and password. That one step send their Facebook password to hackers in their email. It is just one way to hack your account. Hacker can also use key trackers on your PC, so that they get record of all keystrokes on your keyboard. Such keytrackers are easily available as virus. Such keytracker virus are known as trozan- horses.

How to Protect your Facebook account from Hackers ?

  • ·         Always check the URL in address bar before entering your username and password. It should be “https:www.facebook.com” .
  • ·         Intall an anti-virus and anti-spyware on your PC.
These two steps seems to be very simple but they can really help to protect your account