Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
How to Customize The Tweet Button for Maximum Marketing Impact
1. How to Customize The Tweet Button for Maximum
Marketing Impact
A few months ago Ross wrote a post on our content marketing blog exposing just how few websites
take the time to optimize their tweet buttons. Surprisingly, there are a lot of free marketing
opportunities being missed due to a sub-optimal tweet structure.
What is the Optimal Tweet Structure?
Tweets with the best chance of marketing success have three distinct characteristics: a clean post
title, a clean URL, and an appropriate Twitter username included.
Clean
Post Title: You spent time crafting the perfect title that you think will lead to a high CTR and lots
more shares. So why structure your Tweet syntax to look like this?
Clean URL: A URL free of tracking code and other strange add-ons can offer a cleaner feel that may
improve CTR. This may also have a subtle branding effect when your URL is seen rather than a
shortener.
Account Inclusion: Include your Twitter account, which improves the probability that the person
sharing the tweet and the people reading the tweet will follow your account. It also boosts
awareness that your brand is behind the content, potentially improving CTR if you have a positive
reputation in your industry.
Why Don't Sites Configure Their Tweet Structure?
2. The big question on my mind was, with so much to gain from an optimal tweet structure why do so
many sites skip this step?
After reading the comments it became apparent that the biggest reason more tweet buttons aren't
optimized is that the marketing folks most likely to see the value of optimization don't have the
coding skills to roll their own Twitter buttons, and the developer folks in charge of coding up
websites don't have the marketing experience to see the need for such a feature.
Part of my job as a front-end developer for a marketing company is to bridge these sorts of gaps. So
I put together this tutorial showing how to build your own tweet button and configure it to maximize
your marketing efforts.
Install a Twitter Button for One-Page Use
You can always create a button using Twitter's resource tools. However, if you really want to take
control of your tweets it's best to learn how to build it from scratch. Twitter suggests using
JavaScript to create custom buttons and they provide all the information needed to do so.
A Twitter button requires two pieces of code: an HTML link and a script snippet.
Start by adding this script to the footer of your website. It's basically a bit of code that will look for
the HTML link on your web page and convert it into a working Twitter widget. You only need to add
the code once, regardless of how many Twitter buttons you plan to use.
scriptwindow.twttr = (function (d, s, id) (document, "script", "twitter-wjs"));/script
Next, we'll create the HTML link.
In it's simplest form, Twitter's share link will display a branded horizontal button with the total share
count. It defaults to the current url and uses the page title as the suggested tweet text.
a class="twitter-share-button" href="https://twitter.com/share"Tweet/a
The code above will create a link like this:
We want to configure the button for maximum marketing effect so we'll use a series of data
properties to customize the suggested tweet text. You can also use additional properties to configure
the size and layout of the button.
data-url: the url to be tweeted
data-via: an account name, do not include the '@' sign
data-text: suggested tweet text
Adding these data properties will create an HTML link like this:
a class="twitter-share-button" href="https://twitter.com/share" data-
url="http://www.siegemedia.com/customize-tweet-button-maximum-impact" data-via="siegemedia"
data-text="How to Customize The Tweet Button for Maximum Impact -"Tweet/a
3. The above code will result in a tweet button that features our Twitter handle, preferred text and
branded domain, like so:
Simply add the HTML link wherever you want the tweet button to appear.
Learn more about how to configure custom Twitter buttons from their documentation for developers.
Configure Install a Twitter Button for WordPress
The above tutorial shows how to build an individual Twitter button, but chances are you don't want
to build a separate button for each post on your blog. If you use a content management system like
most of the web, you probably want to build them programmatically with a template.
We'll show you how to customize a tweet button for WordPress because 1) it's the most popular CMS
and 2) it's what we use here at Siege.
Building Twitter buttons programmatically in WordPress is as simple as replacing your custom text
with template tags.
Building a Twitter Button Programmatically
Once again, start by adding this script to the footer of your website. In WordPress, you'll add it to
your Theme's footer.php file, just before the /body tag.
scriptwindow.twttr = (function (d, s, id) (document, "script", "twitter-wjs"));/script
Then, create the HTML link -- only this time let's use WordPress' template tags to grab the Post Title
and Permalink.
data-url: ?php echo get_permalink( $post-ID ); ?
data-via: username
data-text: ?php echo get_the_title(); ?
Here is the resulting code:
a class="twitter-share-button" href="https://twitter.com/share" data-url="?php echo get_permalink(
$post-ID ); ?" data-via="username" data-text="?php echo get_the_title(); ?"Tweet/a
4. Buttons created with template tags must be added to the Template Files in your Theme; they will not
work when entered directly into WordPress' Post Editor. Where you add the code will vary
depending on where you want the button to appear as well as which Theme you are using.
For example, if you want to add a tweet button at the bottom of every blog post, you would typically
add the HTML link to the single.php template file directly after ?php the_content(); ?.
Tweet Responsibly
Configuring custom tweet buttons may seem like a small detail, but it's an important piece of the
social media puzzle that can make a big long term impact on your marketing results.
Increase your following and clickthrough rate by properly optimizing your share buttons for
maximum reach using the tips above. Your CMO will thank you later.
http://www.siegemedia.com/customize-tweet-button-maximum-impact