Ever wondered what an acronym means in an article? They’re not easy to look up in a dictionary since a 2- or 3-letter acronym could mean different things in different contexts. But, given some context, it’s an easy question for an AI chatbot. To implement this popular ChatGPT use case, we’ll create a clickable browser bookmark that connects to the ChatGPT API.
About this ChatGPT Use Case
The goal is to be able to highlight an acronym on a web page, then click on a button on your browser, and have the acronym replaced, in a red font, with its meaning. It’s not realistic to think that a user would go to chat.openai.com every time they wanted to ask a question about an acronym. Instead, we’ll use the ChatGPT API to programmatically capture the context around a highlighted word, and instantly pass that to ChatGPT, along with a prompt asking what the meaning of the word is. To do this, we:
- Set up a bookmark to a random website
- Assign the bookmark to not load the random website, but rather, to execute some JavaScript code
- The JavaScript code detects the highlighted acronym on the page and sends a question to ChatGPT asking what the highlighted acronym means
- To pay for OpenAI’s processor time, you will set up an account with a service called “Eden AI” to get a free $10 credit to use OpenAI’s API
Quick Video Overview
A longer video, with the EdenAI registration process, can be found here on our Youtube channel.
Step 1: Bookmark a Random Website
This bookmark will eventually become the button you press to figure out an acronym. First, start by bookmarking a normal website — we recommend https://isitchristmas.com for its simplicity. Depending on your browser, you can bookmark a site by:
- dragging its URL onto the bar below the URL
- click on a star or flag next to the URL to add it to “favorites” (same as bookmarks)
Ultimately, you should end up with a button your browser that, when you click on it, instantly loads a specific URL.
Step 2: Edit the Bookmark to Execute JavaScript Code
Beyond putting a URL in the address bar, did you know that you can put a snippet of JavaScript in the address bar and the browser will execute it? This means that you can likewise click on a bookmark and have the browser execute a bit of code. To arrange this change the URL in your bookmark from, for example, “https://isitchristmas.com” to “javascript:alert(2+2)”.
First, right-click or option-click on the bookmark icon and select “Edit…”:
Next, change the current bookmark to a fun label like “huh?” and instead of the URL, type in the JavaScript snippet, “javascript:alert(2+2)”:
After you update your bookmark, you should be able to click on it and see the JavaScript code calculate the result of 2 + 2. This is called a “bookmarklet” and should pop up this alert when clicked:
It works! Now that we can execute JavaScript with the click of a button, we just replace our simple arithmetic JavaScript with a chunk of code to call the OpenAI API and ask what a particular acronym means.
Step 3: Get a Free API Key from Eden AI
To use OpenAI’s ChatGPT API, you need an “API Key” — a secret code that tells OpenAI who is using their service. API keys are similar to the keycodes employees use when they take turns using the office photocopier — the keycode allocates a certain amount of billing to each person, which gets charged on a company credit card at the end of the month. OpenAI does give you a certain number of free credits for use for a limited amount of time, but unfortunately they still require you to input a credit card to get one of their API keys, so they can start billing you when the free credits expire. There is, however, an alternative, which still gives you access to OpenAI’s API, but doesn’t require you to type in a credit card number to start. This service is Eden AI (https://www.edenai.co), and it serves as a sort of proxy where you can access different APIs from different companies with a single Eden AI API key.
Eden AI offers a free trial with $1 in credit if you create an account with a gmail/yahoo email address, and $10 if you create an account using a business email address. To get the definition of an acronym, it only costs a few cents of processing power, so using the Eden AI key should work for a while.
To get the Eden AI API key, register on their website, preferably using a business account. From there, you’ll see your new API key and current balance on the home page of their dashboard after you log in:
Copy the Eden AI API key and save it in a text file.
Step 4: Incorporate your New API Key into this JavaScript
Now that you have an API key that works with OpenAI’s API, we can incorporate it into some JavaScript that identifies a highlighted word on a web page, finds the context surrounding it, and sends a prompt to ChatGPT to figure out the acronym based on the context.
Step 1: Simply paste your (quite long) new EdenAI API key into the green text box below. When it is pasted, it will automatically replace the placeholder “xxxxx” API key in the orange text box further below. Alternatively, if you want to follow best practices for security — and avoid pasting your API keys into someone else’s website — copy the big code chunk from the orange input box below and paste it into an external text file, then replace the “xxxxx” API key in the code with your actual Eden API key.
Step 2: Once you’ve pasted your key into the green box, click on the “Copy” icon at the bottom of this input box:
At this point you should have the entire code — with your Eden API key integrated into it — copied into your clipboard.
Step 5: Update your Bookmarklet with your Custom Code
While your newly updated code is still in your clipboard, right-click on your bookmark to edit it. Paste over the “javascript:alert(2+2)” with your long one-liner:
Step 6: Test It
No go to a web page that has a lot of acronyms, highlight one of them, click your bookmarklet, and watch as it replaces the acronym with its fully-spelled out definition:
Notes on this ChatGPT Use Case
For advanced users: there is another number you can tweak, a variable called “contextLength.” This determines how many characters on either side of the highlighted acronym get sent to the API as context to help it identify the acronym. You can increase this number to get more accurate results, but that costs more in computing fees.
If the bookmarklet stops working, it’s possible that:
- you’re on a website that forbids sending data to external services (e.g., Twitter)
- your free credit from Eden AI has expired
- Eden AI has changed something about the way code should communicate with their servers (unlikely)
Want to learn more about AI chatbots? Consider taking our instructor-led ChatGPT training courses or Midjourney classes.
This is great!