Learn to Code via Tutorials on Repl.it!

← Back to all posts
What are Bookmarklets?
candies (241)

Bookmarklets [WIKIPEDIA]

Bookmarklets are unobtrusive JavaScripts stored as the URL of a bookmark in a web browser or as a hyperlink on a web page. Bookmarklets are usually JavaScript programs. Regardless of whether bookmarklet utilities are stored as bookmarks or hyperlinks, they add one-click functions to a browser or web page.

Summerize

Bookmarklets could help with many things, it allows you to create functions and use them any time and anywhere.

How do I start?

These are the steps of creating a bookmarklet:
1. You always need a javascript code, so you can make a function.
2. Own or Know a bookmarklet-ifier because it transfers regular javascript codes into the bookmarklet format. here are some suggested systems: mrcoles.com & Bookmarkletifier Extension
3. Go to Bookmark Manager
4. Create a new bookmark and input the code into the URL Bar

Creations from @TempleOfCode

Caculator: javascript:eval('function calc(){_o=prompt(_t,_z);if(_o!=\'\'&&_o!=null&&_o.toUpperCase()==_o.toLowerCase())_z=eval(_o);}');_t='Temple Calculator - Input the expression to be calculated:';_z='';calc();while(_o!=''&&_o!=null&&_o.toUpperCase()==_o.toLowerCase())calc()

Google Serp Scraper: https://codepen.io/Booktemplet/pen/GRrXpRN | I Wanted it to be a codepen because the code is too long

Community Creations

@LoopysPlaylist has created a Wayback Machine Bookmarklet

I don't know why i made this :shrug:
Source | Public Script: javascript:(function(){%20window.open('http://web.archive.org/web/*/'+location.host)})();

Comments
hotnewtop
xxpertHacker (930)

:/

  1. You always need a javascript code, so you can make a function.

You don't need to make a single function in order to make a bookmarklet.

  1. Own or Know a bookmarklet-ifier because it transfers regular javascript codes into the bookmarklet format.

JavaScript bookmarklets are plain JavaScript, there is no difference. Those sites are probably minifiers, and poor minifiers at that.

candies (241)

@xxpertHacker ok, so. you can make a bookmarklet with no code? two, if you put a regular javascript code into the url bar (bookmark manager) it would work?

please don't make comments providing false things.

xxpertHacker (930)

@TempleOfCode functions are code, but the opposite is not true, code is not functions.

javascript: alert("Hi");

No functions were declared, but one was called, and even then, alert is likely implemented in most browsers using a heavy amount of C++, compared to JS.

Secondly, yup, pretty much. All you need to do to execute the following code:

alert("Hi");

as a bookmarklet, is just add the "javascript" URL protocol, like so:

javascript: alert("Hi");

and we're done, the JavaScript code itself remains unchanged, it is still syntactically JavaScript.

What makes you think that declaring functions are required, and that javascript has a separate syntax for bookmarklets? Please, tell me.


And just to further defend my first point, I legitimately have a bookmarklet that is dedicated towards halting slow tabs that are taking up my CPU, I call the bookmarklet "kill," and its contents are as follows:

javascript: for (;;);

No functions whatsoever, and the JS will run in every ES runtime, to date.

candies (241)

@xxpertHacker it wont work if you put regular js scripts into bookmarks, unless the codes are basic

xxpertHacker (930)

@TempleOfCode What distinguishes basic and non-basic scripts? Who decides whether the script is basic or not?

And most importantly, where did you hear this!? You've been deceived or lied to.

candies (241)

@xxpertHacker I got everything from a page source i cant find (which im trying to find just working on my repl)

but if you use: javascript:(function(){%20window.open('http://web.archive.org/web/*/'+location.host)})(); without the %20 it wouldnt work. thats because it requires spaces but bookmarklets wont function. i guess.

EpicGamer007 (1736)

@TempleOfCode your 'normal' javascript and 'bookmarklet' javascript are the same. there is no difference

candies (241)

@EpicGamer007 what im meaning is if you input regular scripts like window.open("https://example.com") it wont work because youre needed to add %20 to the front of ""

xxpertHacker (930)

@TempleOfCode The browser should normalize the URL for you though, so if you type the normal JS, it'll encode it for you, meaning that it is merely encoded, but not syntactically altered.

It has been publicly said by TC39 members that they would rather that JavaScript scripts are all syntactically the same, and wouldn't support creating separate syntaxes.

And btw, the space is unnecessary, and can be removed.

candies (241)

@xxpertHacker thank you. source is bad.