Bookmarklets
Introduction
Bookmarklets are bookmarks with special powers. Effectively, they let you run JavaScript in a browser, which means you can inject JavaScript into a webpage.
The first code block is the bookmarklet itself; create a new bookmark and use this code as the URL. The second code block is the unencoded naked JavaScript; this can be edited then put through the bookmarklet creator found in Useful tools.
Reload webpage on timer
Useful for stopping a webpage timing out, which may also log you out.
In the case of this bookmarklet, it reloads a fixed URL (i.e. it doesn’t reload the current URL). It has to be activated from a different tab (a “control” tab), which must be kept open. The new tab (the “refresh” tab) it will create will refresh as per the timer, so if you intend to use the target website, I prefer to open another tab (the “active” tab) and use that one, as that one won’t refresh. I pin the first two in the browser to keep them out of the way and avoid accidentally closing them.
This bookmarklet uses prompts. If you want a bookmarklet with a fixed URL and/or time, change the code below (e.g. u="https://www.google.com"
or m=5
) and recreate the bookmarklet using the bookmarklet creator in Useful tools below.
javascript:(function()%7Bu%3Dprompt(%22URL%3A%20%22)%3B%0Am%3Dprompt(%22Minutes%3A%20%22)%3B%0Aw%3Dwindow.open(u)%3B%0Ai%3DsetInterval(function()%7Bw.location.href%3Du%3B%7D%2Cm*60*1000)%3B%7D)()%3B
u=prompt("URL: ");
m=prompt("Minutes: ");
w=window.open(u);
i=setInterval(function(){w.location.href=u;},m*60*1000);
Video playback speed
Useful for videos where controls are disabled.
Speed via prompt
javascript:(function()%7Bx%3Dprompt(%27Select%20Playback%20Rate:%27)%3Bdocument.querySelector(%27video%27).playbackRate%3Dx%3B%7D)()%3B
x=prompt('Select Playback Rate:');
document.querySelector('video').playbackRate=x;
Double / 2x
javascript:(function()%7Bdocument.querySelector('video').playbackRate%3D2%7D)()
document.querySelector('video').playbackRate=2
Page title
Copy
javascript:(function()%7Bvar%20dummy%20%3D%20document.createElement(%22textarea%22)%3B%0Adocument.body.appendChild(dummy)%3B%0Adummy.value%20%3D%20document.title%3B%0Adummy.select()%3B%0Adocument.execCommand(%22copy%22)%3B%0Adocument.body.removeChild(dummy)%3B%7D)()%3B
var dummy = document.createElement("textarea");
document.body.appendChild(dummy);
dummy.value = document.title;
dummy.select();
document.execCommand("copy");
document.body.removeChild(dummy);
Rename via prompt
javascript:(function()%7Bvar%20title%3Dprompt(%22Title%3A%20%22)%3B%0Adocument.title%3Dtitle%3B%7D)()%3B
var title=prompt("Title: ");
document.title=title;
Rename to element text
In this case, I used the innerText
of the first h1
tag.
javascript:(function()%7Bdocument.title%3Ddocument.getElementsByTagName('h1')%5B0%5D.innerText%7D)()%3B
document.title=document.getElementsByTagName('h1')[0].innerText
Scroll to bottom of a page
javascript:window.scrollTo(0,document.documentElement.scrollHeight)
window.scrollTo(0,document.documentElement.scrollHeight)
Summarise YouTube videos
In a new tab
Summarize.tech
javascript:(function()%7Bwindow.open('https%3A%2F%2Fwww.summarize.tech%2Fyoutu.be%2F'%2Bwindow.location.href.split('v%3D')%5B1%5D.split('%26')%5B0%5D)%7D)()%3B
window.open('https://www.summarize.tech/youtu.be/'+window.location.href.split('v=')[1].split('&')[0])
Tammy AI
javascript:(function()%7Bwindow.open('https%3A%2F%2Ftammy.ai%2Fe%2F'%2Bwindow.location.href.split('v%3D')%5B1%5D.split('%26')%5B0%5D)%7D)()%3B
window.open('https://www.summarize.tech/youtu.be/'+window.location.href.split('v=')[1].split('&')[0])
Useful tools
Bookmarklet maker
https://caiorss.github.io/bookmarklet-maker/
Enter your JavaScript, it creates a bookmarklet you can drag-and-drop to your bookmarks.
CyberChef
https://gchq.github.io/CyberChef/
An incredibly powerful tool for a host of data manipulations. In this case, you can use it to encode or decode URLs i.e. change a space
to %20
or change {
to %7B
as you can see in the bookmarklet code above.