Skip to content

Bookmarklet Maker

Site: Bookmarklet Maker

GitHub Repo: caiorss/bookmarklet-maker: Tool to create bookmarklet/ javascript apps to automate the web browser.

Contents

Overview

Bookmarklet maker is a small web app to create bookmarklet or small executable Javascript apps to perform browser automation tasks.

You can run this app by accessing the hyperlink:

If you don’t know what is a bookmarklet, see:

Tool (iframe)

Examples

Get Metadata

Get Current Page Title

<title>Page Title</title>

document.title

Get Author

<meta content="author M.r dummy" name="author">

Array.from(document.getElementsByTagName("meta"))
    .find(function(e){return e.name == "author"})
    .content

Get Description

<meta content="A description of the page." name="description">

Array.from(document.getElementsByTagName("meta"))
    .find(function(e){return e.name == "description"})
    .content

Get Keywords

<meta content="keyword1 keyword2 keyword2" name="keywords">

Array.from(document.getElementsByTagName("meta"))
    .find(function(e){return e.name == "keywords"})
    .content

Get Current Date

var d = new Date() ; (d.getYear() + 1900).toString() + "-" + d.getMonth().toString() + "-" + d.getDay().toString()

"2016-9-4"
  • Function getDate():
function getDate(){
    var d = new Date();
    return (d.getYear() + 1900).toString() + "-" +
        d.getMonth().toString() + "-" + d.getDay().toString() ;
}

>> getDate()
"2017-3-5"

URL

Get Current Page URL

document.URL

Redirect Current Page

window.location.href = "http://www.httpbin.org/get"

Open URL in a New Tab

window.open("http://www.yandex.com")

URL Manipulation

URL Manipulation is useful to send the current URL to some web service or Web App such as Google Drive or Web Archive.

  • Open some page that doesn’t exist anymore in Web Archive:
var baseUrl = "https://web.archive.org/web/*/"
var urlmod  = document.URL
window.location.href = baseUrl + urlmod
  • Open a file in Google Drive.

Example URL: https://drive.google.com/viewerng/viewer?url=lampwww.epfl.ch/~hmiller/scala2014/proceedings/p51-prokopec.pdf

var baseUrl = "http://lampwww.epfl.ch/~hmiller/scala2014/proceedings/p51-prokopec.pdf"
var urlmod = "https://drive.google.com/viewerng/viewer?url=" + baseUrl
window.open(urlmod)

Open current page (PDF document in Google Drive).

window.open("https://drive.google.com/viewerng/viewer?url=" + document.URL);

Open a prompt showing Google Drive URL to current document. Useful to create short URL in services like tiny URL and view document in Tablets or Smartphones.

prompt("Google driver URL:", "https://drive.google.com/viewerng/viewer?url=" + document.URL);

Miscellaneous

Display Alert Box (Messagebox)

alert("My message");

Display a Prompt

  • The prompt function is useful to read user input and allow user to copy some data.
prompt("Window title", "Content")

Display string in console

console.log(object); console.log(“My message”);

Style

Recipes

Generate org-mode Bibliographical Reference

function getDate(){
    var d = new Date()
    return (d.getYear() + 1900).toString() + "-" +
        d.getMonth().toString() + "-" + d.getDay().toString() ;
};

var text = '*' + document.title + '*' + " Accessed at " + getDate() +
    ". Available at <" + document.URL + "> " ;

prompt("Type Ctrl+A and Ctrl+C to copy the markdown", text);

It will generate a reference like this:

Change the Page Width for Better Readability

This will set the page width to the width of an A4 ISO paper sheet that makes easier to read long texts in the browser.

document.querySelector("body").style.setProperty("width", "800px")

Invert Page Color for Enhancing Reading at Night

document.querySelector("body").style.setProperty("color", "white")
document.querySelector("body").style.setProperty("background", "black")

Change Page Background Color

document.querySelector("body").style.setProperty("background", "white")

See Also

Backlinks:

list from [[Bookmarklet Maker]] AND -"Changelog"