How To Use Chrome Instant Search to Test Twitter Status Updates & Use Reserved Characters via Web Intents

wrong_tweet

Back in May, I wrote a post on “How to Pre-Populate Twitter Status Update the NEW Way via Links & Web Intents“. Essentially, Twitter updated the method for creating a link to “tweet” using their new Web Intents platform. Many developers (e.g., of WordPress plugins) and other designers are updating their code to support this new (and better) way of creating a link that tweets out some content.

In my post, I only provided a few ways on how to do this, but recently I got a question from someone who was using the new method but having issues using the ampersand (“&”) in their content. When they were putting it in (even using the HTML code of “&” or just alone as an &), the tweet was cutting off right at the “&”.

I found the solution and in the process, discovered a really cool way to test it all out using Google Chrome.

So, first how to craft a properly formed Web Intents tweet, then the Chrome trick used to test it out.

Using Reserved Characters in your Tweets

First, you should probably take a look at my post on how to create the Twitter status using Web Intents. The problem is, with some “reserved characters” like #, @ and &, this may not work exactly the way that you want. A reader of mine wanted to tweet out something like “M&M” in their tweet, but the tweet was stopping at the & and not putting in the rest of the tweet.

So, say that you wanted to tweet out the phrase: “Wow! @HighTechDad’s favorite candy is plain M&M’s! Yum!” (true, by the way).

You would think that you could craft it like (INCORRECT WAY):

http://twitter.com/intent/tweet?text=Wow!+@HighTechDad's+favorite+candy+is+plain+M&M's!+Yum!

But this is what is shown:

wrong_tweet

Note how the tweet loses the “&M’s! Yum!

So, what you need to do is actually use a Percent-encoded reserved character. (You can take a look at this Wikipedia article for more information.) Here is a quick reference chart (note it is an image); a text chart is on that Wikipedia page:

reserved_characters

So, using a percent-encoded character on the M&M tweet example above would look like this:

http://twitter.com/intent/tweet?text=Wow!+%40HighTechDad's+favorite+candy+is+plain+M%26M's!+Yum!

And this produces the CORRECT results:

right_tweet

Go ahead, test it out HERE!

Note, I also used a percent-encoded character for the “@” sign as well in the example above.

How To Use Chrome Instant Search to Test

So the latest version of Google’s Chrome browser has an option to turn on Instant Search, which is a pretty cool feature in itself. Basically, when you start typing a URL into the browser’s URL bar, the site starts pre-loading as you are typing. The best thing to do is to actually test it out to understand how it works. But first, you need to enable it within Chrome’s Preferences. Below is a screenshot of the Mac version (I’m using version 13.0.782.32) and it can be found under the Basics preference page:

Chrome_instant_search

On Windows, you go under the Chrome Options section and the setting looks the same as on the Mac’s.

Once you have that enabled, the fun begins. Take the Twitter URL that you crafted using the percent-encoded characters and simply paste it into the URL field in Chrome (note, you may have to log into Twitter to see your tweet). You can hit enter to bring up the page/tweet and then simply start tweaking the URL to change your message.

Using this method, you can see the character count update based on how you tweak the Twitter URL as well as test how special characters are behaving. While this is not a super huge revolutionary breakthrough, it does provide you with a quick way to test how your properly (or improperly) encoded Web Intents Twitter Status URL works (or not).

Please let me know if this works for you or if you have questions about the process.

HTD says: Be sure to test and retest your code before you publish it!

2 Responses

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Other articles of interest

Global Product Review Disclosure

Disclosure: This is a global disclosure for product review articles on HighTechDad. It does not apply to Automobile reviews and there are other exceptions. Therefore, it may or may not be applicable to this particular article. I may have a material connection because I may have received a sample of a product for consideration in preparing to review the product and write this or other content. I was/am not expected to return the item after my review period. All opinions within this and other articles are my own and are typically not subject to the editorial review from any 3rd party. Also, some of the links in the post above may be “affiliate” or “advertising” links. These may be automatically created or placed by me manually. This means if you click on the link and purchase the item (sometimes but not necessarily the product or service being reviewed), I will receive a small affiliate or advertising commission. More information can be found on my About page.

About HighTechDad

Michael Sheehan (“HighTechDad”) is an avid technologist, writer, journalist, content marketer, blogger, tech influencer, social media pundit, loving husband and father of 3 beautiful girls living in the San Francisco Bay Area. This site covers technology, consumer electronics, Parent Tech, SmartHomes, cloud computing, gadgets, software, hardware, parenting “hacks,” and other tips & tricks.

Recent Articles

Explore Categories