Setting up a ‘tweet this post’ link on websites

A “tweet this post” link on your blog posts lets people click a link which will bring up a new ‘Share a link with your followers’ window (example below). It contains an editable ready-to-send tweet and the link to your post, and in my example it takes people to THIS post.

Screen Shot 2016-08-19 at 23.16.03.png

Obviously you’d need to adapt the underlying text (instructions below) to make it relevant for your blog posts. This is just one way for people to share your content of course – another obvious option is the ‘share buttons’ which let people create their own tweet or Facebook post etc from scratch.

If you’re on a WordPress dot com website (not tried it on a dot org page) you should be able to just add /?share=twitter to the end of the address of the page you’re on to bring up the ‘tweet this post’ dialog box.

How it’s done
I’m sure there are many ways of generating a ‘tweet this post’ tweet but here’s one method that works fine.

The underlying link needs three things

  • a link to ‘twitter dot com / intent/tweet’ which triggers the opening of a new tweet box – https://twitter.com/intent/tweet?text= by itself it just opens an empty box
  • text that someone might post as the text of the tweet (but of course they can edit it and write their own). To make it work properly it’s helpful to include %20 between each word – Setting%20up%20a%20%27tweet%20this%20post%27%20link%20on%20websites  – see Note on the %20 encoding below
  • the target link that you want to include in the tweet, ie the link to the blog post you want people to share – &url=https://howtodotechystuff.wordpress.com/2016/08/19/setting-up-a-tweet-this-post-link-on-websites/

The underlying code for the link above is (picture shown for clarity) –

Screen Shot 2016-08-19 at 22.55.37
and as actual copy-pastable-editable text (the first part will probably have gone blue as most browsers will read it as an active link) –

https://twitter.com/intent/tweet?text=Setting%20up%20a%20%27tweet%20this%20post%27%20link%20on%20websites&url=https://howtodotechystuff.wordpress.com/2016/08/19/setting-up-a-tweet-this-post-link-on-websites/

Keep the first green bit the same, use something similar to the title of your post as the text (in purple) and add* the %20 between each word and add your post’s link at the end (second green bit) with &url= before.

Note on the %20 encoding
* you don’t have to do this manually. Write the text as normal with the ‘intent’ bit before it and the target URL at the end, as shown in coloured text above. Copy this text into a new browser window and press enter. You’ll see a ‘new tweet’ window open. Re-copy the address in the browser bar and when you paste it into your post you’ll probably see that it’s automatically had the %20s added in for you.

%20 is the code for a space, %27 is the code for a single apostrophe ‘, a full list of these codes can be found here (look for ASCII Encoding Reference on the page).

Troubleshooting
Note that it may be easier to set this up if you’ve already published your blog post as you can easily find what its web address (URL) is from the address bar. If you’re creating a new post you might not know what its address will be, depending on your system, but on WordPress dot com which I use for this blog, you get a ‘slug’ option which is the bit that’s stuck at the end of your main homepage address, so I know in advance what the URL will be for this post, it’s below.

Main address: https://howtodotechystuff.wordpress.com <- this is constant
Post address: /setting-up-a-tweet-this-post-link-on-websites/

There’ll be some daft advert below over which I’ve no control because I’ve not paid WordPress to use this blog so it sticks adverts on stuff. The adverts I’ve seen have been pretty awful to be honest but I’ve no idea what they’ve added to this post. Hope it’s not too dodgy 🙂

 

 

 

Advertisements