Read it here: https://www.printful.com/blog/3-signs-that-your-facebook-campaign-is-leaking-money-and-7-solutions-to-fix-it
Hiển thị các bài đăng có nhãn Facebook. Hiển thị tất cả bài đăng
Hiển thị các bài đăng có nhãn Facebook. Hiển thị tất cả bài đăng
Thứ Ba, 20 tháng 2, 2018
Thứ Bảy, 31 tháng 12, 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.
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
(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:
When you are happy with the selections, choose Get Code.
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.
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.
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.
At one stage, the first step in these instructions was to
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.
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
What is 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.
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
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
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&width=160&colorscheme=light&show_faces=false&border_color=purple&stream=true&header=false&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 blogHow 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
Thứ Năm, 6 tháng 11, 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:
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.
(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.
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.
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.
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.
How to apply Facebook's OpenGraph labels in Blogger
Reasons why SEO and search-traffic don't matter for many blogs
- 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 BloggerHow to apply Facebook's OpenGraph labels in Blogger
Reasons why SEO and search-traffic don't matter for many blogs
Chủ Nhật, 9 tháng 6, 2013
How to install Facebook's Open Graph tags into Blogger
This article shows how to install Facebook's Open Graph tags into Blogger
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.
Edit your template in the usual way.
or like this after the line is added:
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:
This code needs to be adapted for your blog. In particular:
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.
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:
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
Why Open Graph
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 isxmlns: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='"en_US"' property='og:locale'/> <meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.pageType == "item"'>
<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
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
- 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
