Web Page Annotator — Thomas McKinstry

Features

• Highlight text.
• Annotate text.
• Edit existing annotations.
• Display notes in the sidebar.
• Display notes on subsequent visits to the same page.
• Scroll to annotated text in page from sidebar.
• Remove notes.

Usage

Making Notes



The user should select the desired text and then can highlight text with the shortcut Ctrl + Alt + h or annotate text with the shortcut Ctrl + Alt + n. Alternatively, when text is selected, the user can right-click and there will be a sub-menu corresponding to the extension that will have buttons for each note type. If the user chooses to annotate text, a pop-up will appear to input the note.

The note made on annotated text can be viewed by hovering over the text, causing a pop-up to appear. Annotated text will have a text-shadow to indicate that it was annotated.



Sidebar



The sidebar automatically displays all notes on the current page.

The sidebar has two color selectors at the top, which will change the color of highlighted text, and the color of annotated text. Icons indicate which selector controls the color of each note type.

Each note has a button to delete the note. Deleting the note will not immediately remove it from the web page, but it will not display after a refresh. Another button exists to scroll to the note on the web page. Annotations have a button to edit the note, a pop-up will appear when this button is clicked to create a new annotation.



About

GPLv3 License

https://github.com/thomasmckinstry/Annotater

• Used icons from https://icons.getbootstrap.com/ for buttons as well as icon and logo designs.

Free and Open-source. No data about the user is collected.