Javascript Bookmarklet Create Javascript Bookmarklet in Google Chrome

Posted on the 29 January 2017 by Pro Webguru @prowebguru

You might have seen some of the popular sites providing you an option of bookmarklet, which you can drag to your favorites bar and after clicking on that it will perform some operation like opening a new window with pre populated information or performing something on current screen.

It is easy to create javascript bookmarklets, in which you can write your custom javascript code to perform some functions.

I will show you how to create simple bookmarklet in different browsers.

On clicking of this bookmarklet, we will just display some information in alert. This is just a kind of "Hello World" bookmarklet for those who don't have idea about it. Same can be extended to implement more complex operations.

We will use following javascript code for this.

alert("Hi, How are you ?");

Let's start!

How to Create Javascript Bookmarklet in Google Chrome ?

  1. To create a bookmarklet in google chrome, make sure your favorites bar is visible on screen.
  2. Right click on favorites bar and click on "Add Page..." option.
  3. It will show following screen
  4. In the Name tab, enter the name of your bookmark.
  5. Now in URL part we will put our Javascript code prepended by "javascript:" and we will create a simple function which we will call.
  6. So now our final URL will be javascript:function test() {alert('Hi, How are you ?');} test();
  7. Click Save and we are done.

We have just created our first javascript bookmarklet in javascript.

Same method can be used to do some complex processing like creating forms for submission of information for a website, do some analysis on webpage like finding email addresses from webpage, finding urls from webpage with this simple javascript code.

Tell me if you can use it to create some kind of useful stuff for your use.

Check Javascript Function to Replace All Occurances of String