Social Networks

Both the Facebook Like button and the Google +1 button support targeting other pages.  In this post we will see that how to add social sharing links e.g Facebook Like, Google+ for a specific URL and not the current page.

Google + 1 Button:

Based on this snippet from the Setting the +1 Target URL, you can override the default behavior of targeting the current page using either the href attribute or a rel=canonical link element in the header of your page.

The URL that is +1’d is determined by one of three things, in this order:

  1. The button’s href attribute. For example: <g:plusone href="http://example.com"></g:plusone> will target http://example.com.
  2. The page’s <link rel="canonical" ... /> tag If the +1 button’s href attribute is not provided, Google will use the page’s canonical URL. For more information on defining the canonical URL for a page, see Google Canonicalization Help Article.
  3. The URL provided by document.location.href

There’s also a Google +1 configuration tool that you may find useful.

social like buttons for specific page

Facebook Like Button:

Based on the Facebook official documentation you can use either the href attribute or OpenGraph markup. The href attribute works much like it does on the +1 button. Here’s a like button that targets http://example.com.

<div data-href="http://example.com" data-send="true" data-width="450" data-show-faces="true"></div>

The OpenGraph option requires you to add a meta element to your document’s header. Here’s the OpenGraph element to target http://example.com

<meta property="og:url" content="http://example.com" />

Leave a Reply

Your email address will not be published. Required fields are marked *

Allowed Tags:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>