I upgraded my WordPress installation, and while reading the details page I saw that apparently this version allows embedding of tweets into WordPress posts with some kind of interactivity about them. I’m supposed to type the permanlink to a tweet on its own line, and then WordPress will do something magic with that link.
I don’t usually write posts from within the WordPress Editor, though. I use Windows Live Writer. I’d like to find out if this magic trick will work with with permalinks that I put on single lines from within the Live Writer editor.
I had a pretty good run on Twitter today, so I have a few tweets of my own to use for this experiment. Let’s see if it works.
https://twitter.com/BackpackingDad/status/217754648583475200
Nope.
So, it looks like I have to go into the WordPress Editor to take advantage of this feature. Let’s try it again.
https://twitter.com/BackpackingDad/status/217754648583475200
Wait a minute. That didn’t work either. Is it because I put the permalink on a line by itself in the “Visual” editor instead of the “HTML” editor? Let’s try the HTML version.
I think I owe Steve Jobs like eight thousand dollars in babysitting fees for the iPad.
— Backpacking Dad (@BackpackingDad) June 26, 2012
Oh, that’s kind of cool. You can see a nice image of the tweet, with a little “Follow” button and a link to my profile. Very nice. But it bleeds out of the side of my fake center column. Is that a default that I can change, I wonder? And I’ve noticed within my “Visual” editor that I don’t see that image, just the permalink, but it isn’t hyperlinked to the tweet. Is that why it didn’t work in the Visual version the first time? Maybe if I break that link it will work. Let’s try with another tweet.
Dear auto correct: I almost never mean to type "Judy" instead of "just", or "pig" instead pig "of". Judy get it right.
— Backpacking Dad (@BackpackingDad) June 26, 2012
Aha! Yes, if, after you paste the permalink into your Visual editor you then break the hyperlink the editor wants to do you the favour of creating for the line you pasted, then the editor will embed the tweet properly.
Now, what about that edge-bleeding? If I go into the WordPress Dashboard, and then to “Settings”–>”Media”, I get an option to change the width and height of the auto-embedded media. I changed my width to “400”. Did that fix the problem? (Note, when I pasted this link in the “Visual” editor I right-clicked the mouse and selected “Paste as plain text” so that I wouldn’t have to break the hyperlink after the fact.
There's an extra letter in the French alphabet, right after "R", that sounds exactly like a cat barfing a hairball.
— Backpacking Dad (@BackpackingDad) June 26, 2012
Yep! But hey! It’s also changed the width of my previously embedded tweets, so they look normal and I look crazy for mentioning a width bleed problem at all. Well. Trust me, there was one.
Okay, I think I’m done messing around with this now. Enjoy embedding tweets into your posts, WordPress 3.4 users.
If you like my tweets so much, why don't you marry them?
— Backpacking Dad (@BackpackingDad) June 26, 2012
P.S. Oh! I just remembered why the hell I started this post in the first place: Can I take advantage of this embedded tweets feature from within Windows Live Writer? It didn’t’ seem to work the first time, but maybe that’s also because the editor helpfully hyperlinked the permalink I posted. Let’s try a plain text version from within the Live Writer editor. (Unfortunately, there is no “paste as plain text” option when you right-click in the Live Writer editor, so the hyperlink will have to be broken manually, after pasting the text. Fingers crossed here.)
I went to the hardware store. Ladies, a hardware store is where people like you buy hammers and nail guns, and where I buy tomato stakes.
— Backpacking Dad (@BackpackingDad) June 27, 2012
Well, that was a big “Hell no!” In fact, retrieving the post to Live Writer, then republishing, confused WordPress about the status of the permalinks that worked and broke them too. Now I’m in the Visual editor again. I see that the previously working links, within here, are still plain, and even the last one I did within Live Writer is plain (though the first one, that I pasted without breaking the link, still shows up as hyperlink blue). So what gives? Will the problem fix itself as soon as I hit “Update” now that I’ve been editing once again in the WordPress editor, and it sees all these plain text links?
Yep. All back to normal now (again, you’ll just have to trust me about their having disappeared there for a bit when I posted from Live Writer, since re-posting from within the WordPress editor fixed everything, and erased all evidence.)
Okay, now I’m really done.
Er…no, first I want to change the width of these things to 450 instead of 400. They are looking stubby. There. Once again, finally again, I know you can’t tell that I did anything. But trust me, the embedded twitter boxes looked a little weird for a bit.
So, in short: Embedded tweets look great in WordPress 3.4, so long as you paste in plain text on single lines, and do it from within the WordPress editor itself (either the “Visual” or “HTML” editors will work), but the process doesn’t work when posting from Windows Live Writer. And that’s a shame. I don’t know if I’ll use this feature that much if I have to compose from within the WordPress editor. Anyway, good night!
Great tutorial!
Hint: If you are embedding someone else’s tweet and expect that they may not be happy about it, be sure to take a screen capture in case they delete it after the fact.
Most entertaining tutorial I’ve seen online yet. Also, super cool feature… Not sure it’s enough to woo me from the dark Blogger side of the fence, but cool nonetheless.