featured contributor

By Igor Bredikhin (Own work) [GFDL (http://www.gnu.org/copyleft/fdl.html) or CC-BY-3.0 (http://creativecommons.org/licenses/by/3.0)], via Wikimedia Commons

One of the only issues that I’ve ever had with social sharing plug-in Digg Digg was the fact that it didn’t shorten the URL on the Tweet button. When people would tweet from my website, it always looked a little unrefined to me. And since Twitter’s t.co URL shortener only reveals on mobile Twitter apps, anyone seeing my link on their desktop would see my full URL in all its clunky splendiferousness. I decided I needed to figure it out and I did.

There are two steps for creating this functionality for your Twitter share button:

  • Change the WordPress short URL to goo.gl using Goo.gl Shortlinks plug-in
  • Create a Twitter button with a PHP call for the shortlink

Change the WordPress short URL to goo.gl

I’m sure that there’s a way to do this without a plug-in, but I’m lazy. I downloaded the Goo.gl shortlinks plug-in, which converts the WordPress short URL to a goo.gl URL. It takes a minimal amount of configuration and the instructions are pretty straightforward. Note that it doesn’t change all of your URLs at once: saving a post triggers the goo.gl action.

Create a Twitter button with a PHP call for the shortlink

(Note that I changed all of my share buttons to manual buttons, but I imagine you could do this with Digg Digg or any other social sharing plug-in by finding the Tweet button in the code) 

On the Twitter buttons page, Twitter will create a generic code which shares the URL of any page you put it on. It looks something like this:

<a href=”https://twitter.com/share” class=”twitter-share-button” data-via=”leaderswest”>Tweet</a>

We’re going to ignore the script and focus on the “a” link. We’re going to add an attribute “data-url” that ties back to the goo.gl shortlink that the plug-in created. Like this:

<a href=”https://twitter.com/share” class=”twitter-share-button” data-url=”php echo wp_get_shortlink(); ?> data-via=”leaderswest”>Tweet</a>

We’re not finished, though: One of the peculiarities about implementing this is that all of the previous share data disappears. So, we’re going to add one more attribute (data-counturl) to tell Twitter what the short-url links to. We do that with a PHP call back to the permalink, like so:

<a href=”https://twitter.com/share” class=”twitter-share-button” data-url=”<?php echo wp_get_shortlink(); ?> data-counturl=”<?php echo get_permalink(); ?> data-via=”leaderswest”>Tweet</a>

Now you have a short-url in your Tweets, the counters are fully functional, and that’s all there is to it. Share this post and check it out. :)


Photo by Igor Bredikhin (Own work) [GFDL or CC-BY-3.0], via Wikimedia Commons
Jim Dougherty

Jim Dougherty

Writer and chief of miscellany at leaderswest.com
I aspire to give people something to think about rather than tell them what to do. My favorite Google Alert is "social media research," I am increasingly compelled by Gen Z, and I appreciate good writers agnostic of where they write. At one time I was Kred's 12th most influential social media blogger and Klout's most influential person on the topic of David Hasselhoff. Transplant from Seattle living in Cincinnati. Haven't entirely adopted the local sports teams yet.
Jim Dougherty
Jim Dougherty
Jim Dougherty

Share your thoughts.