Home sidebar

Read without the side column

Related links, ads, and sign-up boxes can crowd the side of an article. This shortcut tries to hide that column so you can focus on the main content.

On a computer, drag the button below to your bookmarks bar. Then open the page you want and use the bookmark.

Turn the sidebar off

On a phone or without a bookmarks bar? See the other ways to use this shortcut below.

How it works and when to use it

How can I use this shortcut on my phone?

On a phone, you can try saving the code as a bookmark address. Copy the code below first.

iPhone (Safari): bookmark any page, touch and hold the bookmark, choose Edit, and replace its address with the copied code.

Android (Chrome): bookmark a page. Open Bookmarks, tap the three dots beside it, choose Edit, and replace its address with the copied code.

Then open the page you want to change and use the bookmark. If it does not run from the bookmarks menu, type the bookmark's name in the address bar and select its suggestion.

Bookmark address

javascript:void(function(){var nodes=document.querySelectorAll("aside,[role='complementary']");for(var i=0;i<nodes.length;i++)nodes[i].style.setProperty("display","none","important");var all=document.body.getElementsByTagName("*");for(var j=0;j<all.length;j++){var el=all[j];if(el.tagName==="BODY"||el.tagName==="HTML"||el.tagName==="MAIN")continue;var name=((el.id||"")+" "+(typeof el.className==="string"?el.className:"")).toLowerCase();if(name.indexOf("sidebar")!==-1||name.indexOf("side-bar")!==-1)el.style.setProperty("display","none","important");}}())

Support varies by browser and version. Some websites also block this kind of shortcut.

Another iPhone option: the Shortcuts app

In Shortcuts, create a shortcut with the Run JavaScript on Webpage action and paste the code below. Show it in the Share Sheet for Safari webpages. If prompted, allow running scripts in Shortcuts settings. Then open the page in Safari, tap Share, and choose your shortcut.

Code for the Shortcuts app

void(function(){var nodes=document.querySelectorAll("aside,[role='complementary']");for(var i=0;i<nodes.length;i++)nodes[i].style.setProperty("display","none","important");var all=document.body.getElementsByTagName("*");for(var j=0;j<all.length;j++){var el=all[j];if(el.tagName==="BODY"||el.tagName==="HTML"||el.tagName==="MAIN")continue;var name=((el.id||"")+" "+(typeof el.className==="string"?el.className:"")).toLowerCase();if(name.indexOf("sidebar")!==-1||name.indexOf("side-bar")!==-1)el.style.setProperty("display","none","important");}}());completion();

How can I use the console on a computer?

Open the page you want to change. In Chrome, press Ctrl + Shift + J (Windows/Linux) or ⌘ + Option + J (Mac), paste the code below into the console, and press Enter.

Console code

void(function(){var nodes=document.querySelectorAll("aside,[role='complementary']");for(var i=0;i<nodes.length;i++)nodes[i].style.setProperty("display","none","important");var all=document.body.getElementsByTagName("*");for(var j=0;j<all.length;j++){var el=all[j];if(el.tagName==="BODY"||el.tagName==="HTML"||el.tagName==="MAIN")continue;var name=((el.id||"")+" "+(typeof el.className==="string"?el.className:"")).toLowerCase();if(name.indexOf("sidebar")!==-1||name.indexOf("side-bar")!==-1)el.style.setProperty("display","none","important");}}())

The effect applies to the open page. Check what any code does before running it in the console; your browser may show a security warning.

The button hides aside, the complementary region, and the block whose name says sidebar. The core marked as main is not included.

How does it identify a sidebar?

The side column often brings more articles, an ad, an internal search, and a newsletter box. It competes with the text.

The button hides aside, what the page marks as complementary, and the element with sidebar in its name. Main stays.

It does not delete that column on the site. On your screen, it stays hidden until you reload.

Just the content

Use it when the side takes a wide band and you want that width for the text.

A column under another name, without aside and without the word sidebar, can remain.

The layout afterward

Hiding the column can leave a gap, if the page reserved that space in a rigid grid. The text still remains.

Header and comments are other tools. This one looks at the side.