rneomy/reader-view

Access Firefox's built in reader view from right click context menu

Reader View (a browser extension)

Strips away clutter like buttons, background images, and changes the page's text size, contrast, and layout for better readability

Preview

Reader View extension brings Mozilla's open-source Readability implantation to Chromium. Using this extension you can strip clutters from webpages and read them on the "Reader View" mode. The extension allows you to toggle between normal view and reader view by pressing the page-action button.

Links

• Homepage: https://webextension.org/listing/chrome-reader-view.html
• Produce Review: https://webextension.org/blog/2022/04/17/reader-view-extension.html
• Chrome: https://chrome.google.com/webstore/detail/reader-view/ecabifbgmdmgdllomnfinbmaellmclnh
• Firefox: https://addons.mozilla.org/en-US/firefox/addon/readability-based-reader-view/
• Opera: https://addons.opera.com/en/extensions/details/reader-view-2/
• Edge: https://microsoftedge.microsoft.com/addons/detail/reader-view/lpmbefndcmjoaepdpgmoonafikcalmnf

reader-view's Issues

TTS: speed control goes up to two but the alt text says it goes up to three. I like three.

[Feature request] Overlay page instead of loading a new one

In a similar fashion to most reader extensions like DOM Distiller and Reader View, show the transformed/simplified text without leaving the page to an extension one. Often you lose the original page once you reload it back, if it's updated or somewhat dynamic. Also doesn't work well with tab suspenders and the alike.

Also would solve: #6

TTS: When a period is not a full stop as in GU.cards.

Not sure if this is under your control. Default behavior is to treat a "." as the end of a sentence. But in domain names, email addresses, and many other situations, it's just meant to be read aloud as "dot". As in "gee you dot cards".

Please add TTS options to GUI

Please add TTS controlls:
◀ restart current / go to the Previous paragraph
▲/▼ Speed up/down (I know it's in options, but different articles need different speeds)
▲/▼ Volume up/down (just to be awesome ;) )

Keep up the great job, yours is the only reading view for chrome that rivals to firefox's!!!!

THANK YOU!!

cmd === 'font-increase': Could you please allow bigger fonts?

Hello
Thank you very much for this useful extension!,
could you please allow us to use bigger fonts if we use the font-increase command?

The older we get, the bigger the font :-)

Thanks a lot, kind regards,
Thomas

Add padding to reading area for Mac OS' smart zoom

Smart zoom on Mac OS enables you to zoom to the reading area. However read mode in the extension has a reading area with no padding. Therefore, when zoomed, text will have no padding to the sides of the screen. Widening reading area and adding the same amount of padding to the div element would make no visible difference, but would fix the problem with smart zoom.

Full Screen Mode

I enable the option to 'Automatically switch to the fullscreen (window mode)' in the Reader View option. So now when I switch to 'Reader View' on a website I am in full screen reading mode. Next to exit Reader View I hit the Esc key. This exits the Reader View but the browser is still on full screen mode. The behaviour should be to exit Reader View and also exit full screen mode. Thank you for this great extension. I am thoroughly enjoying it.

Add a shortcut

This addon is very good. I think it will be even better if you can add a shortcut for the reader view.

Google News redirects do not work

While links from Google redirect correctly, links from Google News do not making this extension nearly useless to me.

Custom themes: Solarized Dark and Light Theme

Dark mode has high contrast with white text on black background. It would be good to use eye friendly themes like Solarized Dark and Light. Also, if possible please support custom themes.

Clicking on link to same-page anchor does not jump to anchor id

Procedure:

• Install https://addons.mozilla.org/en-US/firefox/addon/readability-based-reader-view/ on Firefox.
• Visit http://www.open-std.org/jtc1/sc22/wg21/docs/papers/2007/n2271.html
• Enable reader view
• Click the link: ISO 14882 (1998) which jumps to an anchor id on the page.

Result:

• I get 2 copies of the reader view left-side-bar, and the page jumps to the very top, instead of #cpp_standard.

If I middle-click the anchor, I instead get http://www.open-std.org/jtc1/sc22/wg21/docs/papers/2007/n2271.html in a new tab (not in reader view, and links to the top of the page rather than the anchor id).

Full CSS code for default viewer

Where are the full CSS rules for the default view? I would like to customize the font, background, text color, etc. but I don't know CSS. It would be helpful to use the existing CSS scripts and then modify. Thanks in advance!

Feature Request: Dyslexie Font

I would love to see a dyslexie font included besides currently present serif and sans-serif fonts.
https://www.dyslexiefont.com

[REQUEST] Add more languages to text to speech

First, thanks for your extension. The quality of the voices is really good.

What I need and think will spread the worthiness of the addon, is to add more languages to the text to speech, the actual 7 languages it's not many. Should be at least the most used 25 languages.

Unable to Switch to reader view: Readability.js:1019 Uncaught TypeError

• Sometime I can't switch to reader view, the console at Chrome DevTools shows the following error.
• although I can open the page in reader view in incongnito mode.

Readability.js:1019 Uncaught TypeError: Cannot read property 'tagName' of null
    at Readability._grabArticle (Readability.js:1019)
    at Readability.parse (Readability.js:1818)
    at Readability.parse (wrapper.js:41)
    at wrapper.js:78

It failed at the following code:

        var scoreThreshold = lastScore / 3;
        while (parentOfTopCandidate.tagName !== "BODY") { // failed at this line
          if (!parentOfTopCandidate.readability) {
            parentOfTopCandidate = parentOfTopCandidate.parentNode;
            continue;
          }

[Request] Open new tabs in background

So as to not disrupt my reading, my default behavior is for my browsers has always been to open links in the background when I hold down Command (Opera / Mac). I'd much prefer this default to be respected, or, if it's not possible to know/use the default, to have the ability to configure this feature.

Thank you for the fantastic plugin/extension.

improvement: PDF printing that conserves hyperlinks

Hello,

I also recall from Readable that when it prints the (more) readable page in PDF, the hyperlinks are conserved, and therefore the user can actually click on those links while reading the PDF.

Would you be able to implement this functionality? I hope it won't be too complicated, because I (and probably many other users) would find it very useful.

Thanks, and best regards.

Idea: Auto-scrolling to train reading speed

Users can select Words per minute and then the extension can auto-scroll the content. This will help those who want to train for reading speed.

Discrete instead of a continuous bar would be useful to tweak the speed of reading.

custom styling

Hi, pls tell me how can i achieve the followings

1. move the side menu to either top or bottom

2. change both background and font color

thanks

Easier way to copy original page url

• When we are reading this page in reader view, sometimes, we want to copy the URL (for various reason).
• Now we have to press Esc, chrome will reload the page, then open the page in reader view mode again.
• This looks like a waste of system resource. : )

There are different ways to implement this:

• Provide a toolbar in the right sidebar, a menu in the context menu.

A Thank You And A Request

Thank you. This exceptional. I have been looking for this exact extension since Clearly bit the dust.

I have only one question, and if it isn't possible now, a feature request:
I frequent story sites a lot that have stories running over several pages. I have noticed that at times readerview stops after xNumber of pages and will not go further. I looked and either didn't see the setting or didn't understand it is I did.

Is there a setting that allows all pages to be loaded and/or is it possible to add that feature?
Clearly had that feature "baked in">

I am in no way criticizing your work, this is a wonderful program, thank you.

HiDPI Icon in Opera

Hi, whether it is possible to improve quality of an icon in HiDPI (retina) permission?

The images are scaling incorrectly

If a page contains hi-res images the addon doesn't scale it at all. I see that the body tag have width style modificator but the img tags have no scaling styles.

Just add this style to default styling in reader mode

img {
  max-width: 90%;
  height: auto;
}

You can test this issue at page http://www.mobile-review.com/articles/2019/samsung-unpacked-2019.shtml

Make light mode more easy on the eyes by decreasing contrast

Hi and thanks for a great extension!

As a graphic designer I love extensions like yours that help make information more accesible and I have a suggestion to improve the extension further: To decrease the color contrast of the light mode, like the dark and sepia mode does.

Right now the colors in light mode is in direct contrast using 'black' text on a 'white' background.

By adjusting either one or both of these slightly would greatly decrease eyestrain for readers. The dark and sepia modes already does this by using background and text colors that have less contrast to each other.

This could be implemented by changing the background of light from white to whitesmoke or a similar light accent, and/or making the text color a dark grey compared to straight 'black'.

Hope you will test this and consider implementing. It might seem like a minor change, but it has a great impact on the reading experience, especially when reading longer texts.

All the best, Sune

Opera version 60 extension not in the url bar

With Opera version 59 the Reader extension was in the url bar, with Opera 60 it is now with other extensions. I liked the way it was before, can you do anything about it or it's an Opera v 60 limitation?

Thank you.

Ability to enlarge the font size

Could you add the ability to further enlarge the font size? I often use the extension to see better but I can not enlarge the size much more...
Thanks!

Two examples of broken output

Wrong formatting (ignores font settings, no word wrap):
Link 1

Size of inline vector graphics (svg):
Link 2

doesn't show code blocks

Hi, I am using reader view at the moment and it is great - thanks!

However, it doesn't include [code][/code] blocks from some sites, such as the following:
https://www.techyourchance.com/liskov-substitution-principle/

I'd be grateful if this could occur - it would be really helpful. Thanks.

Feature Request: blur top and bottom

I like to see text I've already read or that is upcoming and have the area I am actively reading in the center of my screen (vertically). I switch between screens often though and often lose my place when I'm reading.

I would like to have a feature where the top and bottom of the window is blurred or washes out as it moves away from the center to the top or bottom of the window. This way I can scroll the text such that the area I am actively reading is inside the non-blurred area and is easy to find when my attention returns from another screen.

Invalid DOM traversal with CustomElements

Hi,

Your chrome reader view addon causes a bug on https://guided.adobe.com due to my use of CustomElement for web components with https://github.com/mikeal/gza which one of my coworkers bumped into.

Somewhere you have a hard coded DOM path that needs to become aware of Shadow DOM.

Engadget

Hi. Thank you for creating good extension. I have problem using Reader View.
Engadget articles are not displayed correctly. Some paragraph is truncated. Is this a bug? https://engadget.com/2018/06/08/essential-second-module-headphone-jack/

Allow setting background and forefront color

It is nice to have this "only-read" view, but I would like to be able to setup the background color. Sometimes I can prefer it to be white, while others it would be great to have a darker one (black or else) with lighter font.

Is that possible?

Let me know if I can collaborate in this, please.

Idea: Train listening speed

Users can opt to train listening speed (by selecting words per minute). The extension can read at that speed and the background of the particular word being read could flash grey.

This will help those who want to train for listening speed.

Discrete instead of a continuous bar would be useful to tweak the speed of speaking.

Keep page URL in address bar

When in reader-view mode, the address bar (at least in Opera) is blank. The URL is in the domain link on top of the page, but it would be better to keep/add it to the browser address bar also.

Thanks,
Jan Jansky

Unable to override font-size with CSS

Used sample code from https://add0n.com/chrome-reader-view.html
Added the italic, font-size, and font-family attributes. When switching between dark, sepia, and white, I see the red text and font style italic, but the size and font family are not changed. It doesn't appear possible to override the -+ buttons on the Aa tab.
body[data-mode=dark] {
color: red !important;
font-family: "Times New Roman", Times, serif;
font-size: xx-large;
font-style: italic;

Created by mistake

Mistake

Style correction

To work properly with images and for ergonomic reading of the end of the text, the following needs to be added as custom CSS.

img {
  display: block;
  max-width: 100%;
  width: auto;
  height: auto;
}
body {
  padding-bottom: 5em;
}

I would suggest to add this (or some variant of) to the codebase.

Just to note, I am using the Opera version, where the extension got a recent update. This codebase seems to be old(er) though?

Thanks for a working reader-view extension,
Jan Jansky

[request][new-feature] Add text to speech

It would be great if we could use a text to speech feature in the left corner items in reader mode.

Options to do automatic full screen mode in reader view

In chrome extension, I request you to provide option if the user wants the reader view in full screen.

This supports the philosophy behind to avoid clutter and be able to focus.

Allow resizing of images in reader view

Hello,

Maybe it wasn't Readable, but I recall one add-on that allowed scaling the images to a smaller or larger size in the Reader View. I hope you can also implement this. Thank you very much.

Make context menu entry optional

I try to keep a clean context menu. For me the context menu entry is redundant as I use the toolbar button. It'd be great if it was optional.

TTS halting in Chrome version

It seems with the 0.2.5 update while the TTS is reading it gets stuck and stops sometimes. With 0.2.4 I could manually press the 'Next' button on the voice control bar (upper-right) and it would always continue reading. But with 0.2.5 the TTS gets stuck more often and pressing 'Next' won't do anything which means the TTS completely fails. Luckily I was able to revert to 0.2.4 after finding it on a Chrome crx archive site but I thought this latest issue should be brought to attention.

Design Flaw: While using touchpad to scroll the text moves sideways also

Using touchpad is a more fluid way to scroll the page. When I try to do it, then because my motion of finger is not precisely straight the text also shifts sideways, which is undesirable.

Please fix this issue, as to make the functionality more useful.

Feature request: support code formatting in reader view

For example: http://docs.guzzlephp.org/en/stable/, https://github.com/sima-land/api-php-client/blob/master/doc/client.md.

Just idea, we may preserve styles of block with highlight class (or add setting to set css selectors of blocks, where we must preserve site styles). Or simply, preserve spaces and set monospace font in pre blocks.

[Request] Adding voice selector for TTS

What about adding choices voices for TTS like this example:

https://github.com/ken107/read-aloud/blob/44a6e5cf781c60189b8f7831d07132be89112a58/docs/js/readaloud.js#L311

This will let you choose any language, not only English. Btw, Thanks for implementing the TTS

urls in Dark mode barely readable.

urls/links in dark mode are almost unreadable. Plz change it to another color or add option to choose one. It is not the same as in the firefox addon. Thanks
Screenshot:
https://i.imgur.com/s0LsjYK.png

Mozilla version:
https://i.imgur.com/0f6njiI.png

Custom CSS pre{white-space: pre-line;} breaks indented code blocks

The default "Custom CSS" sets pre tags to white-space: pre-line.

reader-view/WebExtension/firefox/common.js

Lines 220 to 222 in 1f85176

	pre {
	white-space: pre-line;
	}

This causes <pre> code to lose indentation, and instead all lines start at the left margin.

I think you should remove that part of the custom CSS (or change to pre-wrap? https://developer.mozilla.org/en-US/docs/Web/CSS/white-space )

"Missing host permission for the tab" on PDF files

I tried to use the addon on a PDF file opened inside Firefox, but I get that error.

I want to use in order to enable the Text to Speech to read the PDF file.

Can you fix it?

Maintain a list of websites that should always be opened in Reader View by default

• Example: I want to open any link from Washington Post by default in Reader View, because they don't let us read with Ad-blocker On. And if Adblocker is off, the advertisements fills up the entire page.

• Task: It will be good if user can have a list of website that should always open in reader view, even if the link is hyperlinked from some other page.

AMOLED Dark Mode

Would it be possible to add an option to allow Dark Mode to use true black for devices with AMOLED screens?