Create a simplified page view. Remove photos, ads, or anything that distracts you from reading a web page.
- run
git clone https://github.com/greggzigler/textonly.gitin terminal - open
textonly/manifest.jsonin an editor, and customizecontent_scriptswith your target web page(s); see below for details - open a Chrome web browser tab at
chrome://extensions/or a Brave web browser tab atbrave://extensions/ - click the
Load unpackedbutton - select the
textonlyfolder - click the
Extensionsicon in the top right corner - click the Pin icon by the
TextOnlyentry
- open your target web page
- click the
TextOnlyicon in the top right corner and see the popup dialog - if text does not appear in the popup within 3 seconds, click the
Refreshbutton
Modify the content_scripts section of manifest.json. Match the target web site URLs that you want to visit; specify HTML class names and tag names to pinpoint the content that you want to see.
Here are the default settings:
"content_scripts": [
{
"js": ["/scripts/content.js"],
"matches": [
"https://example.com/*"
],
"title": {
"classes": [],
"tags": ["h1"]
},
"core": {
"classes": [],
"tags": ["div", "body"]
},
"details": {
"classes": [],
"tags": ["p"]
}
}
],Legend:
js: internal files; do not modifymatches: target websitestitle: where to find the page titlecore: where to find the body of content you want to seedetails: withincore, where to find the individual pieces of content you want to seeclasses: ordered list of class names used in website HTML you want to seetags: ordered list of tag names used in website HTML you want to see
The extension code first looks in the HTML document for matching classes elements, one class at a time, until it finds one. If none are found, it does the same for tags.
Open example.com in a web browser, and the extension popup should look like this:
Go to the wikipedia page for GitHub in the Chrome extension, open the View Source for the page, and look for HTML classes and tags for your desired content. For wikipedia you'll see that titles use the default h1 and that details use the default p. But the core content uses a class name mw-body-content. So you can edit matches and core in the manifest.json file to look like this:
"content_scripts": [
{
"js": ["/scripts/content.js"],
"matches": [
"https://*.wikipedia.org/*"
],
"title": {
"classes": [],
"tags": ["h1"]
},
"core": {
"classes": ["mw-body-content"],
"tags": []
},
"details": {
"classes": [],
"tags": ["p"]
}
}
],Save the change, return the Step 3 of Setup, visit the GitHub web page, and open the extension popup. It should look like this: