Add Share Links to WordPress

Published:

In my previous posts Ghost Share Links Cheat Sheet and Add Share Links to Ghost Themes I explained "no-cost" sharing and provided reusable code snippets in handlebars to add share links to 19 different social networks. Here they are adapted for WordPress in a single easy to use function.

tl;dr: Download WordPress shareLinks at github.

Installing

In your WordPress theme folder you can either simply add the following code to the single.php file inside of the while() loop or add it to your theme's functions.php and call it in single.php

Usage

This code provides a single function shareLinks([$sites]){} which takes an optional parameter $sites[] which is array of sites to output links. If no parameter is provided then all sites are returned. For example:

shareLinks();  //All the things!
shareLinks(array("email")); //Old School!
ShareLinks(array("sinaWeibo", "renren")); //你好！

The function returns a string containing an unordered list with each site as its own list item. The list item contains an anchor with a helper class of the machine-readable site name, like so:

<ul>
  <li>
    <a
      class="stumbleupon"
      href="https://stumbleupon.com/blog"
    >
      StumbleUpon
    </a>
  </li>
  <li>
    ...
  </li>
</ul>

To output the list it needs to be echoed after it is called. The simplest way is like this:

<?php echo shareLinks(); ?>

Ok, now for the dev-nerd stuff/blog.

Query Items

Different networks require/allow different query items and as such shareLinks() provides a number of operators:

  • $share["siteTitle"]: This is a string returned from get_bloginfo('name').

  • $share["siteURL"]: This is a string returned from get_site_url().

  • $share["postTitle"]: This is a string returned from get_the_title().

  • $share["postURL"]: This is a string returned from get_permalink() and then passed through remove_query_arg() to remove the page indicator. If you want to share a specific page of a post then you'll need to remove the remove_query_arg() call.

  • $share["postCategory"]: This is a string of all categories of the post returned from get_the_category() and then the spaces are stripped out of category names and each category is prefixed with "#". For example if a post is categorized as "Word Press, Themes" the return would be " #WordPress #Themes".

  • $share["postDblCategory"]: This is the same as $share["postCategory"] except categories are also suffixed with "#" as is required by some networks. For example if a post is categorized as "The Simpsons, Ralph Wiggum" the return would be "#TheSimpsons# #RalphWiggum#".

  • $share["postExcerpt"]: This is a string returned from get_the_excerpt() and then passed to wp_strip_all_tags(): This will have "Continue Reading" at the end. If you want to remove that you'll need to add a filter to your theme.

  • $share["postShortExcerpt"]: This is $share["postExcerpt"]: substringed to the first 90 characters for networks with shorter share limits.

  • $share["postImage"] This is the URL of the featured image of the post. If there is no featured image for the post, then it will grab the URL of the first image attached to the post. If there are no images in the post then it is empty- which is fine.

Networks Array

Each network (facebook, twitter, etc/blog) is simply part of a multidimensional array. To add another network, simply create another entry in networks[]. Here's the schema of the primary array:

$networks["network-machine-readable-name"] = [
    "name"  => "Network Display Name",
    "url"   => "https://example.com/share?",
    "query" => [
        "foo" => $share["postURL"]
           "bar" => $share["postTitle"],
    ],
];

The machine readable name is the helper class that's provided in the anchor, the "name" is the text output in the anchor content. This is important especially when dealing with multilingual sites, for example "Sina Weibo" is $networks["sinaWeibo"] but the display name is: "name" => "新浪微博" to change the display of the network name you would change the "name" value.

The "url" array value is where the share URL is stored- this is different for each site, but it should always end with the beginning of the query URL (i.e. ?).

The "query" array value should store another array which are the components of the URL query. These are different for each network, but can be populated with elements from the $share[] array as outlined above. For example a query array might look like this:

"query" => [
    "url" => $share["postURL"],
    "title" => $share["postTitle"],
    "redirect" => "false",
],

Notice the last option "redirect=false". It's possible to add static elements to the query URL if they're required by the remote site. In the end this will give us something like:

url=http://example.com&title=Post Title&redirect=false

Finally, our query is passed through http_build_query() to make it URL encoded.

Examples

The following are real examples of this function in action on my wife's blog (iywahl.com) with a random post. Her site is using WordPress 4.1.1 and the "Twenty Fifteen" theme.

Email

$networks["email"] = [
    "name"  => "E-mail",
    "url"   => "mailto:?",
    "query" => [
        "subject" => $share["siteTitle"] . ": " . $share["postTitle"],
        "body"    => $share["postTitle"] . "\r\n" . $share["postURL"] . "\r\n\r\n" . $share["postExcerpt"],
    ],
];

twitter

$networks["twitter"] = [
    "name"  => "twitter",
    "url"   => "https://twitter.com/home?",
    "query" => [
        "status" => $share["postURL"] . $share["postCategory"],
    ],
];

Facebook

$networks["facebook"] = [
    "name"  => "Facebook",
    "url"   => "https://www.facebook.com/sharer/sharer.php?",
    "query" => [
        "u" => $share["postURL"],
    ],
];

Google+

$networks["googlePlus"] = [
    "name"  => "Google+",
    "url"   => "https://plus.google.com/share?",
    "query" => [
        "url" => $share["postURL"],
    ],
];

LinkedIn

$networks["linkedin"] = [
    "name"  => "LinkedIn",
    "url"   => "https://www.linkedin.com/shareArticle?",
    "query" => [
        "mini"    => "true",
        "url"     => $share["postURL"],
        "title"   => $share["postTitle"],
        "summary" => $share["postExcerpt"],
        "source"  => $share["siteTitle"],
    ],
];

Pinterest

$networks["pinterest"] = [
    "name"  => "Pinterest",
    "url"   => "https://pinterest.com/pin/create/button/?",
    "query" => [
        "url"         => $share["postURL"],
        "media"       => $share["postImage"],
        "description" => $share["postShortExcerpt"], 
    ],
];

Tumblr

$networks["tumblr"] = [
    "name"  => "tumblr",
    "url"   => "http://www.tumblr.com/share/link?",
    "query" => [
        "url"         => $share["postURL"],
        "name"        => $share["postTitle"],
        "description" => $share["postExcerpt"],
    ],
];

reddit

$networks["reddit"] = [
    "name"  => "reddit",
    "url"   => "http://www.reddit.com/submit/?",
    "query" => [
        "url"   => $share["postURL"],
        "title" => $share["postTitle"],
    ],
];

Xing

$networks["xing"] = [
    "name"  => "Xing",
    "url"   => "https://www.xing.com/spi/shares/new?",
    "query" => [
        "sc_p" => "xing-share",
        "url"  => $share["postURL"],
    ],
];

VK

$networks["vk"] = [
    "name"  => "VK",
    "url"   => "https://vk.com/share.php?",
    "query" => [
        "url"         => $share["postURL"],
        "title"       => $share["postTitle"],
        "description" => $share["postExcerpt"],
        "image"       => $share["postImage"],
        "noparse"     => "true",
    ],
];

buffer

$networks["buffer"] = [
    "name"  => "buffer",
    "url"   => "https://bufferapp.com/add/?",
    "query" => [
        "url"  => $share["postURL"],
        "text" => $share["postShortExcerpt"],
    ],
];

StumbleUpon

$networks["stumbleupon"] = [
    "name"  => "StumbleUpon",
    "url"   => "https://www.stumbleupon.com/submit?",
    "query" => [
        "url"   => $share["postURL"],
        "title" => $share["postTitle"],
    ],
];

新浪微博 (Sina Weibo)

$networks["sinaWeibo"] = [
    "name"  => "新浪微博",
    "url"   => "http://service.weibo.com/share/share.php?",
    "query" => [
        "url"   => $share["postURL"],
        "pic"   => $share["postImage"],
        "title" => $share["postTitle"] . "%0D%0A" . $share["postShortExcerpt"] . $share["postDblCategory"],
    ],
];

Baidu空间

$networks["baidu"] = [
    "name"  => "Baidu空间",
    "url"   => "http://hi.baidu.com/pub/show/share?",
    "query" => [
        "url"   => $share["postURL"],
        "title" => $share["postTitle"],
    ],
];

人人网 (Renren)

$networks["renren"] = [
    "name"  => "人人网",
    "url"   => "http://share.renren.com/share/buttonshare?",
    "query" => [
        "link"  => $share["postURL"],
        "title" => $share["postTitle"],
    ],
];

腾讯微博 (QQ Tencent Weibo)

$networks["tencentWeibo"] = [
    "name"  => "腾讯微博",
    "url"   => "http://v.t.qq.com/share/share.php?",
    "query" => [
        "title" => $share["postTitle"] . " " . $share["postShortExcerpt"] . $share["postDblCategory"],
        "url"   => $share["postURL"],
    ],
];

QQ空间

$networks["qzone"] = [
    "name"  => "QQ空间",
    "url"   => "http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?",
    "query" => [
        "title"   => $share["postTitle"],
        "url"     => $share["postURL"],
        "summary" => $share["postShortExcerpt"],
    ],
];

腾讯朋友网 (Pengyou)

$networks["pengyou"] = [
    "name"  => "腾讯朋友网",
    "url"   => "http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?",
    "query" => [
        "to" => "pengyou",
        "title"   => $share["postTitle"],
        "url"     => $share["postURL"],
        "summary" => $share["postShortExcerpt"],
    ],
];

Wow, are you still reading this? Go download shareLinks from github and add it to your theme!