FragmentQR

Developed by Yonah Aviv

FragmentQR Logo

Version

Summary

FragmentQR is a QR-code generator that can additionally copy links to snippets of text on a webpage.

Introduction

FragmentQR adds a an option to the context menu to copy a link to a snippet of text on a webpage, and within the extension popup you can share that that link usinga QR code.

Getting Started

Installation

FragmentQR is available on 2 different extension stores:

Installation for Chrome

(and any other chromium browser)

Installation for Edge

Instructions

FragmentQR infographic of intructions

  1. Select some text
  2. Open context menu and click “copy link …. to selected text” to copy text fragment
    • tip: use Alt + Shift + L instead
  3. Click the extension toolbar icon to open the popup
    • tip: use Alt + Q to Open Popup
  4. Click the blue paste button the text fragment link into the popup to generate a QR code.

When someone scans that QR or just goes to the link you copied, A feature called Scroll to text fragment allows the text fragment to be detected when they load the webpage, and will scroll your selected text into view and be highlighted in yellow 🟨.

Note: Currently scanning the QR code to see the highlights will mostly only work on Android, but there may be functionality on iOS soon

Once either you or someone else scans the QR code and opens the URL, the browser will open the original webpage and scorll to the selected text which will be highlighted in yellow.


Supported Browsers

Currently, text fragments are supports in these browsers: note: these are all chromium browsers


Background

Text Fragments

Text Fragments: Part of a URL that specifies a piece of text emphasized on page load and scrolled into view, not unlike a text anchor.

“Text Fragments adds support for specifying a text snippet in the URL fragment. When navigating to a URL with such a fragment, the user agent can quickly emphasise and/or bring it to the user’s attention.”1

Syntax of Text Fragment URL

Syntax: https://foo.bar/#:~:text=yoursnippet

The text fragment can be specified in the fragment directive, which will always be after in the URL fragment of the URL, after #(there may be a word after the # but before :~:, and that would be another kind of fragment, but it’s all good). The fragment directive delimiter is the following string: :~:. You can specify text=yoursnippet after it and in chromium browsers, and some other browsers, yoursnippet will be scrolled into view and highlighted, when opened.

Example

Consider the following URL:

https://en.wikipedia.org/wiki/Probability_distribution#cite_ref-:1_3-0:~:textStart=Examples of random phenomena include the weather condition in a future date

If we take our previous url(https://foo.bar/#:~:text=yoursnippet) and map it out to this URL, we would get:

https://foo.bar/#:~:text=yoursnippet https://en.wikipedia.org/wiki/Probability_distribution...
foo.bar en/wikipedia.org
# #cite_ref-:1_3-0
yoursnippet Examples of random phenomena include the weather condition in a future date

Update on text fragments: In Chrome 87, there is a new flag in chrome://flags that adds “copy link to text” to the context menu on Android and Desktop. However in the latest version of chrome as of November 23, 2020, it does not work.

Update Dec 2020: Chrome 88(beta) by default has the copy link to text item in the context menu and it is functional. Hopefully if it get’s carried to the stable version and get more documentation and an API.

Supported Browsers + OSs

(Mentioned above already, but herea more in depth answer:) Since the QR code contains the text fragment link, the QR code and the link are the same. The yellow highlight comes from the Scroll to text fragment feature, so this will answer:

Which browsers and OSs support Scroll to text fragment or a feature similar to it?

Scroll to text fragment is a feature in Chromium-based browsers[2] . There may be similar features in other browsers.

Mobile operating systems(I need to recheck these, so they may be out of date)

  1. Android works(check browsers below)
  2. iOS doesn’t work(yet)
  3. IPadOS to be determined

All other devices(using the text fragment URL) 4. Pretty much the same browsers work on Mac, Windows, and Linux but still check to make sure whoever you send the link to is running one of the OS/browser combination below.

Let me know if you want your operating system or browser to appear in the table below.

Operating System Browser Version
Android Chrome 85, Android WebView 81, Samsung Internet latest.(could be more)
Windows Microsoft Edge 83, Chrome 80, Opera 68
Linux Microsoft Edge 83, Chrome 80, Opera 68
Mac OS X Microsoft Edge 83, Chrome 80, Opera 68
iOS N/A. Could come in early 2021.

Check current status

Remember, Fragment is also a functional QR code generator, so even if you cannot use text fragments, you can skip to step 3 of the instructions steps

Want more informations?

Check out our FAQ on the Fragment QR Wiki

If you still are in need of an answer feel free to email me with your question


Issues and Changelog

Known issues

Changelog v1.8.1

Changelog v1.8.0

Changelog v1.7.2

  1. Changed options page
  2. New icon
  3. Now available on Microsoft Edge Add-ons
  4. Updated description

Changelog v1.7.1

Changelog v1.7

  1. Fixed Issue # 5: QR now update automatically when typing in the text box
  2. Revamped options page
  3. minor fixes

Changelog v1.6

Changelog v1.5

  1. New icon and name changes to FragmentQR
  2. Paste button now works.
  3. Vast UI and functionality improvements
  4. Added support for copying text framents
  5. Added keyboard shortcuts
  6. Light theme(currently does not save between sessions)

TODO

  1. Link to text fragment(by Google. Also inspired this extension)
  2. STTF Url Generator

References

1: - Scroll-to-text-fragment(WICG)

Privacy policy

I, the developer, attest to the claim that the browser extension FragmentQR does not collect any personal identification information of users whatsoever, and that all other data is stored locally on the user’s device.

For the full privacy policy, go to the privacy policy


Developed and Designed by Yonah Aviv

Buy me a coffee

Fragment QR uses some icons from Google’s Material Design Icons

Copyright © 2021 Yonah Aviv