I have meant to write this for years and just never gotten around to it. I just swap the URLs, think “I should make a bookmarklet” and then do whatever it is I was doing originally.
Wayback -
takes me to this page in the Internet Archive’s Wayback Machine.
add bookmark with tags -
because I haven’t gotten away from Pinboard yet
Mastodon instance changer, which I have saved as “mstdn🔁”.
if I’m reading something on a remote instance, it lets me take it back to my home instance, so I can interact with it: favorite, boost, or report it.
there are extensions for this, but that feels too invasive and powerful.
View Source, on iPad / iOS -
hmm, can’t find this online.
The one I use the most is probably opendir_image.js. It collects all links to image, audio and video files on the current page and displays the files in a nice grid view.
I use bookmarklets a ton every day. I also use a lot of browser extensions but for simpler things for myself, bookmarklets are an easier and faster way to achieve similar goals.
The ones I use the most are Copy as Markdown and Copy as HTML: both of them copy the current page’s title and URL in either markdown links or html anchor tags. I use them to grab interesting stuff into my notes or to my website and save a lot of formatting time when they come in a right format. If some text is selected on a page, the markdown version will add that as a blockquote on top of the link. I have shared them in my blog.
Then I have a few that modify websites by adding functionality, like one for the local hockey league that I also shared in aforementioned blog post.
At work I use one for adding better video controls to HTML5 video (e.g. skip 10 msec backwards/forwards). It’s based on https://stackoverflow.com/a/66464235 .
Also occasionally using a self-built bookmarklet for adding a histogram and color controls to the images on a website. The controls are nice to quickly make an image brighter, to see if the dark pixels contain more details than visible to a human eye. This bookmarklet has become quite extensive though: I now have to start a local webserver from which most of the JS code is loaded. This approach also makes it easier to edit the code.
At least the second bookmarklet is quite intrusive though; so it does not work well on all pages.
Redirect custom bookmarklet (to invidious, nitter, scribe.rip etc., but those stopped working, so it’s mostly just a generic archive.ph redirect)
Prompt for new font (Sometimes used playfully, but does see some fair usage whenever people think everyone has a Retina display for their Didones. Or, heck, whenever I end up substack-rolled, with their horrible s p e c t r a l)
at least on firefox, setting keyword enables launch the ’let from the address bar. So Ctrl-L ob takes me from firefox into emacs with my capture template (were I ever to remember I can do that)
I have a couple but they are tied to my own computer and server. Just ways of quickly automating things I do often. My own blog has a quirky micropub API homebrew implementation, so lots of “reblog”, “quote text from this page”, and other actions are just bookmarklets that either call my own server or some locally running app on my computer.
password generator in case the browser built-in doesn’t work or I need the password outside of the browser
(function () {
"use strict";
const MAXLEN = 50; /* tweak this */
const MINLEN = 20;
function genString() {
let u8array = new Uint8Array(MAXLEN);
window.crypto.getRandomValues(u8array); /* Firefox only :/ */
let array = Array.from(u8array); /* turn into non-typed array */
array = array.map(function (val) {
/* map back into ascii range: */
if (val < 0x7F) {
/* it *is* already in ascii range */
return val;
} /* unset MSB if value not in 7bit ascii range */
return val & 0x7F;
}).filter(function (x) {
/* strip non-printables: if we transform into desirable range we have a propability bias, so I suppose we better skip this character */
return x > 0x41 && x < 127;
});
return String.fromCharCode.apply(String, array);
}
let password = genString();;
while (password.length < MINLEN) {
password += genString();
}
if (document.activeElement.nodeName === "INPUT") {
document.activeElement.value = password;
} else {
prompt("", password);
}
})();
I have one that converts header elements (e.g. h1, h2, etc) to anchor links (if they don’t already support it). Useful for linking to specific sections of a page (usually blog posts in my case), which subsequently helps with preserving reading progress and finding them later via browser history.
Needs a lot of reworking though now that I write this out. Can do a better job of handling some edge cases and being more generally useful!
One disadvantage of the decentralised fediverse is that I can’t be logged in to every different server, so I use a bookmarklet to open the current post or profile on my home, mtl.rocks.
javascript:(function(){var today=new Date();var year=today.getFullYear();var month=today.getMonth()+1;var day=today.getDate();var element1=document.getElementsByClassName("marginbottom05")[0].innerText;var element2=document.getElementsByClassName("marginbottom0")[0].innerText;var url=window.location.href;var formUrl='https://docs.google.com/forms/d/e/THIS IS THE ID FOR YOUR FORM/viewform?entry.1394767016=%27+encodeURIComponent(element1)+%27&entry_1823497776=%27+encodeURIComponent(element2)+%27&entry_1559489288=%27+encodeURIComponent(url)+%27&entry.1300142439_year=%27+encodeURIComponent(year)+%27&entry.1300142439_month=%27+encodeURIComponent(month)+%27&entry.1300142439_day=%27+encodeURIComponent(day);window.location.href=formUrl;})();
pushcx | 1 year, 2 months ago
I have a couple site-specific versions of a bookmarklet for toggling between a page on prod and dev:
javascript:(function(){var u=window.location.href;var n=u.startsWith('https://lobste.rs/')?'http://localhost:3000/':'https://lobste.rs/';window.location.href=n+u.split('/').slice(3).join('/')})();danlamanna | 1 year, 2 months ago
I’m stealing this. I’ve been lazily using https://github.com/guillaumebriday/switch-to-localhost for years, but it doesn’t switch back to prod.
carlana | 1 year, 2 months ago
I have meant to write this for years and just never gotten around to it. I just swap the URLs, think “I should make a bookmarklet” and then do whatever it is I was doing originally.
pronoiac | 1 year, 2 months ago
Bookmarklets I use:
ThinkChaos | 1 year, 2 months ago
Here’s the view source one: https://apple.stackexchange.com/a/417701
rebane2001 | 1 year, 2 months ago
Ooh the Mastodon one is really nice, links to other instances has always added so much friction to using Mastodon for me
sny | 1 year, 2 months ago
The one I use the most is probably opendir_image.js. It collects all links to image, audio and video files on the current page and displays the files in a nice grid view.
juhis | 1 year, 2 months ago
I use bookmarklets a ton every day. I also use a lot of browser extensions but for simpler things for myself, bookmarklets are an easier and faster way to achieve similar goals.
The ones I use the most are Copy as Markdown and Copy as HTML: both of them copy the current page’s title and URL in either markdown links or html anchor tags. I use them to grab interesting stuff into my notes or to my website and save a lot of formatting time when they come in a right format. If some text is selected on a page, the markdown version will add that as a blockquote on top of the link. I have shared them in my blog.
Then I have a few that modify websites by adding functionality, like one for the local hockey league that I also shared in aforementioned blog post.
I also like to automate things like filling forms while developing since that gets boring quite fast.
[OP] Hodei | 1 year, 2 months ago
Both of those are super useful! Added to my list.
jmiven | 1 year, 2 months ago
yawaramin shared some bookmarklets a few months ago. I have to use the anchors toggle way too often :-)
bhoot | 1 year, 2 months ago
javascript:void(document.location='https://wave.webaim.org/report#/'+escape(document.location))javascript:void(document.location='https://validator.nu/?doc='+escape(document.location)+'&showoutline=yes')javascript:void(document.location='https://www.websitecarbon.com/website/'+escape(document.location.host))oger | 1 year, 2 months ago
At work I use one for adding better video controls to HTML5 video (e.g. skip 10 msec backwards/forwards). It’s based on https://stackoverflow.com/a/66464235 .
Also occasionally using a self-built bookmarklet for adding a histogram and color controls to the images on a website. The controls are nice to quickly make an image brighter, to see if the dark pixels contain more details than visible to a human eye. This bookmarklet has become quite extensive though: I now have to start a local webserver from which most of the JS code is loaded. This approach also makes it easier to edit the code.
At least the second bookmarklet is quite intrusive though; so it does not work well on all pages.
mhd | 1 year, 2 months ago
I have five that I currently use a lot:
briankung | 1 year, 2 months ago
briankung | 1 year, 2 months ago
Here’s one for opening the archive.is version of a page:
javascript:void(window.location = `https://archive.is/${window.location.href.split('?')[0]}`)xo | 1 year, 2 months ago
To force PiP mode for videos on macOS in Safari, where the native video controls aren’t available:
javascript:document.querySelector(%22video%22).webkitSetPresentationMode(%22picture-in-picture%22);wwfn | 1 year, 2 months ago
I have these but haven’t made a good habit to use them
ob)at least on firefox, setting keyword enables launch the ’let from the address bar. So
Ctrl-L obtakes me from firefox into emacs with my capture template (were I ever to remember I can do that)carlana | 1 year, 2 months ago
My most used one is jump to Wikipedia. The next most used is a work specific one for going to the right page in the admin.
rebane2001 | 1 year, 2 months ago
Could you elaborate on the jump to Wikipedia one?
SoapDog | 1 year, 2 months ago
I have a couple but they are tied to my own computer and server. Just ways of quickly automating things I do often. My own blog has a quirky micropub API homebrew implementation, so lots of “reblog”, “quote text from this page”, and other actions are just bookmarklets that either call my own server or some locally running app on my computer.
freddyb | 1 year, 2 months ago
password generator in case the browser built-in doesn’t work or I need the password outside of the browser
adamshaylor | 1 year, 2 months ago
45–75 for responsive typography testing and stats.js for performance monitoring.
andrewchou | 1 year, 2 months ago
I have one that converts header elements (e.g. h1, h2, etc) to anchor links (if they don’t already support it). Useful for linking to specific sections of a page (usually blog posts in my case), which subsequently helps with preserving reading progress and finding them later via browser history.
Needs a lot of reworking though now that I write this out. Can do a better job of handling some edge cases and being more generally useful!
danso | 1 year, 2 months ago
One disadvantage of the decentralised fediverse is that I can’t be logged in to every different server, so I use a bookmarklet to open the current post or profile on my home, mtl.rocks.
j11g | 1 year, 2 months ago
I have 5:
j11g | 1 year, 2 months ago
Most of these form fillers work like this:
javascript:(function(){var today=new Date();var year=today.getFullYear();var month=today.getMonth()+1;var day=today.getDate();var element1=document.getElementsByClassName("marginbottom05")[0].innerText;var element2=document.getElementsByClassName("marginbottom0")[0].innerText;var url=window.location.href;var formUrl='https://docs.google.com/forms/d/e/THIS IS THE ID FOR YOUR FORM/viewform?entry.1394767016=%27+encodeURIComponent(element1)+%27&entry_1823497776=%27+encodeURIComponent(element2)+%27&entry_1559489288=%27+encodeURIComponent(url)+%27&entry.1300142439_year=%27+encodeURIComponent(year)+%27&entry.1300142439_month=%27+encodeURIComponent(month)+%27&entry.1300142439_day=%27+encodeURIComponent(day);window.location.href=formUrl;})();