How To Convert a Bookmarklet Into an Arc Boost

Arc Browser Homepage

I have been using Arc as my primary browser for a few months now. I like pretty much everything about it.

My one major complaint would be that bookmarklets no longer work. This isn’t a huge deal, and maybe they will come up with a way to support them, but bookmarks in general aren’t supported in the same way as other browsers when “everything is a tab”. There are some bookmarklets that I’ve used heavily over the years and they are a big part of interacting web services. It’s nice to use them sometimes rather than install a separate browser extension for every possible service you use.

There is one particular bookmarklet that I used the most. When clicked, it would redirect you to the wp-admin area of the current site to login, if it’s a WordPress site. As my day to day work for the past decade has involved the development of many WordPress sites, this is a useful feature for me.

Arc has a cool feature called Boosts, which are an easy way to add user styles and scripts (like the classic Greasemonkey/Stylish extensions). With Boosts, they have created a simpler UI to build your own Chromium extensions, which is what they are behind the scenes. So I set about to convert my bookmarklet into a Boost.

Here’s the original bookmarklet code. It’s pretty simple:

javascript:(function()%7Bvar%20wpadmin%3D%27http://%27%2Blocation.hostname%2B%27/wp-admin%27%3Bwindow.location%3Dwpadmin%3B%7D)()%3B

I created a new custom Boost, and in the content.js file, I added this:

document
  .body
  .addEventListener("keydown", function(event) {
    // Å = option + shift + A
    if (event.key === "Å") {
      redirectToAdmin();
    }
});

function redirectToAdmin() {
  var wpAdmin = location.protocol + '//' + location.hostname + '/wp-admin';
  window.location.replace(wpAdmin);
}

While I would prefer to click an icon to do this, Arc’s extension menu is hidden by default and only shows on hover, which is nice, but not great for this. I also couldn’t get it to work by clicking on the extension itself. I think I have a solve for that, which involves editing the manifest.json, but that goes beyond the simple spirit of Boosts, and I’d just be creating a Chrome extension. So I’ll leave that for a later time.

While I hope Arc adds a way to support bookmarklets in some form, this was a fun exercise to rebuild the functionality using the new Boosts feature. Have you created an Arc Boost? Are there bookmarklets you would miss if you were using Arc?