Web Highlights Docs

Appearance

Sidebar ​

The extension sidebar is your main hub for highlights, bookmarks, and tags.

Open Sidebar ​

There are three ways to open the sidebar:

  1. Click the extension icon in the toolbar Pin extension
  2. Click the sidebar icon in the highlight popup Open sidebar from highlight popup
  3. Use the keyboard shortcut Alt + W (Windows) or Option + W (Mac)

Keyboard Shortcuts 💡

Paste chrome://extensions/shortcuts into your browser's address bar to change your shortcuts. You can also click the shortcut icon at the bottom of the sidebar.

Close Sidebar ​

There are also three ways to close the sidebar:

  1. Click the extension icon in the toolbar Pin extension
  2. Click the sidebar arrow icon Close sidebar
  3. Use the keyboard shortcut again Alt + W (Windows) or Option + W (Mac)

Customize Sidebar ​

Since everyone has different preferences—left or right side, large or compact—our sidebar is fully customizable.

Customize sidebar
  • To resize the sidebar, hover over the edge until it turns blue, then click and drag.
  • To align it left or right, use the icons at the top of the box that appears when you hover over it.
  • By default, the sidebar pushes the webpage to the side, but if you'd prefer it to float over the text, just adjust this with the icons at the bottom.

Find & Jump Between Highlights ​

When a page has many highlights, the sidebar and the page stay in sync, so you can move between them quickly.

Click a highlight on the page to find it in the sidebar ​

Click any highlight on the webpage and its matching entry lights up in the sidebar and scrolls into view—so you can instantly spot it, even in a long list.

  • Click the same highlight again to remove the focus.
  • Click a different highlight to move the focus to that one.
  • Click anywhere else on the page to clear the focus.

Click a highlight in the sidebar to jump to it on the page ​

Click any highlight in the sidebar and the page scrolls straight to it, centering the highlighted text in the viewport. It's the fastest way to get back to where a highlight lives on a long page.

Prefer a shortcut on the edge of the page? 💡

You can also jump to any highlight from the outline rail—the thin strip of colored dots on the edge of the page. The rail hides automatically while the sidebar is open.

Manual Reordering of Highlights ​

While Web Highlights attempts to automatically sort highlights in the order they appear on the page, some websites' complex layouts can make this challenging. This typically happens with:

  • Multi-column layouts
  • Dynamic content loading
  • Complex CSS positioning
  • Floating elements
  • Non-standard HTML structures

For these cases, Web Highlights provides two options to manually reorder your highlights:

Choose between drag and drop and arrow-up/arrow-down sorting to rearrange your highlights

Drag and Drop Sorting ​

You can click and drag any highlight in the sidebar to manually reorder it. Simply:

  1. Click and hold on a highlight
  2. Drag it to the desired position
  3. Release to drop it in place

Arrow-up and Arrow-down Sorting ​

You can also use the arrow-up and arrow-down keys to rearrange your highlights. Simply:

  1. Click on a highlight to select it
  2. Press the arrow-up to move it up, or the arrow-down to move it down
  3. Shift-click to move it to the top or bottom of your highlights

Shift-Click for Multiple Highlights 💡

Hold Shift while clicking to move a highlight to the top or bottom of your highlights.

Persistent Order 💡

Your manual sorting will persist after closing and reopening the sidebar or reloading the page.