My new app AfsaneDB (Beta) is now in PlayStore!

Those who love reading classic literature can now enjoy literary masterpieces in this beautifully designed app.

Saturday, 3 October 2020

Magic of Browser Bookmarks - Automate Simple Tasks using JavaScript


Automation using Bookmarklet

As I promised in #LearnedToday, I'm going to show you how much you can achieve with this little bookmark feature in the browsers.

Ever wondered how to easily remove citations from a Wikipedia page? 

What are bookmarks?

The bookmarks in the browsers are to save the links to the pages you wish to visit again, or you just find them useful and save them for later. 

Instead of creating a text file "Imp Links" and saving all the links there (I've done it a lot), you could use the browser's bookmark feature.

The shortcut to bookmark a webpage in most browsers is ctrl+b.

What more can they do?

To sum up, they can run JavaScript on a page. So instead of opening the browser console to do run a couple lines of code, you could create a bookmark and click that instead.

Example?

Whenever I needed to copy something from Wikipedia, I usually had to deal with the references/citations they have. You must've seen those, with squared brackets around numbers, something like this [1] or with a disclaimer like [citation needed], etc. I needed to remove all those. 

Initially, I used to do it in MS Word manually, by Find and Replace. I don't remember that now, doesn't matter anyway. 

Finally, I came to know about these browser bookmarklets, and then a simple regex was enough to do the work for me.

Now I have a simple bookmark. I go to any Wikipedia page, select the text I need, and click the bookmark. Viola! Citations are removed.

How to create a bookmarklet?

Got to Bookmarks Manager

1. Click three vertical dots in the upper right corner > Bookmark > Bookmark Manager

Or chrome shortcut: ctrl+shift+o

Or type in the address bar: chrome://bookmarks/

2. Click three vertical dots in the upper right corner of Bookmark manager (Shows tooltip: Organize) 

3. Add new bookmark

4. It will show a popup with two fields: Name and URL. 

5. Give any appropriate name, and in the URL bar, paste the JavaScript code you want to execute.

6. Click Save. 


You have your bookmarklet ready. 

Show/Hide Bookmarks bar with ctrl+shift+b. Clicking on the name of your bookmark will run the underlying code. 

Any easier way to do this?

If you don't want to go through all those steps, there's a simple tool called Bookmarkleter. Paste your JS code, it will generate a link that you can drag and drop to the bookmarks bar. 

For example, drag and drop the following link to your bookmarks bar. This will allow you to change fonts on any website. 

Which bookmarklets am I using?

  1. Citation Remover: Removes citations from a Wikipedia page. Drag&drop this link to the bookmarks bar: Citation Remover
  2. Set Font: If a website is using bad font, use this. As I use Urdu a lot, and Urdu without Nastaleeq font looks ugly. So I apply any font to the page available in my system. Payami Nastaleeq is the default one for me.
  3. Calci: A tiny calculator which returns results of simple arithmetic operations.
  4. StyleStripper: Strips all CSS styles from a webpage. Helpful if I don't want to load an entire page I want to copy something from. Also works on most of the sites which disable copying using JavaScript. Click StyleStripper and you can copy the text. 

Misc. bookmarklets I created

QuoraSkip: Skip Quora-enforced 'login' popup by removing added elements and blur overlay.

To those who requested, don't complain now. (Abuzar :D) I have shared it finally. More such tips will follow. Keep visiting! And I know you will. :wink:

Rab Raakha!

Shakeeb Ahmad Maharashtra, India

Shakeeb Ahmad is a blogger, poet, enthusiast programmer, student of comparative religion and psychology, public speaker, singer and Vedic Maths expert. He loves playing with the numbers and invented a shortcut method to square the numbers at the age of 16. In sports, football is root to his happiness. He lives it.

3 comments:

  1. Great piece of information 😍thank you so much for sharing 😇 keep it up 😎

    ReplyDelete
    Replies
    1. You're welcome! And thank you for your kind words. Keep visiting

      Delete
  2. Positive site, where did u come up with the information on this posting?I have read a few of the articles on your website now, and I really like your style. Thanks a million and please keep up the effective work. kolpac.com

    ReplyDelete