Navigate

Navigation JavaScript Bookmarklets

I have a JavaScript Bookmarklet that I use all of the time. It’s to navigate up in the server directory hierarchy. (forgive me. I thought I authored this post already. I’m sure of it, but maybe it was a local file or something. So I’m a bit irritated about that situation!)

What is a bookmarklet? A bookmarklet is “one line” of JavaScript code that is placed into a browser bookmark file (or, in the case of Microsoft browsers, saved as a favorite– in which case– it becomes a favelet. It’s true.

From your bookmarks menu, choose new bookmark or edit bookmark if you want to write over an existing saved location. Copy and paste the code below into the URL (address) field of the bookmark dialogue and save or close the bookmark editor. Clicking the new bookmark now should execute the JavaScript on the current page because that’s just how browsers work.

The “Go up” bookmarklet. I hope you find it quite useful. There are tons of bookmarklets, which I don’t use, but this is one I use thousands of times a day. The only down side is it encourages me to display the bookmarks toolbar at all times because I like to be able to just reach up there and click without opening a menu.

Go up

javascript:if (location.pathname == "/"); else if (location.pathname.charAt(location.pathname.length-1) == "/") location = ".."; else location = "."; void 0;

Go ./wp-admin

Use this bookmarklet to easily log in to WordPress if you don’t have an accessible login link publicly visible. I get a lot of use out of it!

Note: Once you’ve added it to your bookmarks bar (aka. favorites bar) you may find you need to click it a second time to load the user login form.

E.g. where you see the code:

// FOR ILLUSTRATION ONLY
// not to be used!
else if (window.location.pathname.charAt(window.location.pathname.length-1) != "/") window.location.assign(window.location.origin + "/wp-admin");

note that the wp-admin portion of the URL is concatenated with the origin (aka. the WordPress root directory).

javascript:const regex = '/^(.*\/)(.*\/)(.*)$/g';const url = new URL(window.location.href);var wpath = url.pathname.replace(regex, "$1");if (window.location.origin + "/" == window.location.origin + window.location.pathname) window.location.assign(window.location.origin + wpath + "./wp-admin");else if(window.location.pathname.charAt(window.location.pathname.length-1) == "/")  window.location.assign(window.location.origin + wpath + "./wp-admin"); else if(window.location.pathname.charAt(window.location.pathname.length-1) != "/") window.Location.href = window.location.origin + "/wp-admin";void 0;

Updated 2024.06.27 – tired of playing with it, but it now uses that regex on the URL obj. for pathname. I have no doubt there is better JavaScript out there. Please feel free to comment or provide feedback.

Note: If it doesn’t work for you, try URL encoding the bookmarklet code before pasting it into the bookmark editor. You can process the string with a convenient online URL encoder utility.

If you don’t like the results you get, or if you’re curious about how bookmarklets work, use the JavaScript Console in your browser to perform tests. If you use a version of the Webkit browser, like Google Chrome, or Microsoft Edge, view instructions for how to use the Devtools Console for testing JavaScript. If you use a version of the Mozilla Firefox browser, check out the instructions for the Web Console UI to test JavaScript in your Mozilla based browser.

Whatchu do


Leave a Reply

Your email address will not be published. Required fields are marked *