How to Undo YouTube’s Terrible New Layout

How to Undo YouTube’s Terrible New Layout


YouTube, haven’t you ever heard the expression, “If it ain’t broke, don’t fix it?” Why, of all things to change on your platform, did you go messing with your site’s UI? The video player is now squished into the top-left corner with a bloated suggested videos feed below it, while the description and comments are scrunched into the right third of the page. It’s giving “graphic design is my passion.”

No one is happy about the change, but YouTube doesn’t seem to care. Unlike other types of changes the site rolls out, the new layout appears mostly permanent. There’s no option to revert to the old look, or to opt-out of experimental designs. If you open YouTube and see the new UI, that’s the one you’re stuck with. (That said, one Redditor claims their layout reverted on its own after four weeks.)

While YouTube seems content to make the change a fixture for more and more users, those users aren’t going down without a fight. The internet, of course, doesn’t like to be told what to do, and finds a way around these forced changes.

In a post on r/YouTube last month, Redditor Chaski1212 shared a workaround: Chaski1212 wrote a block of code that reverts all of YouTube changes back to the old UI, and it seems to actually work. While I don’t have the new layout on any of my Google Accounts yet, plenty of Redditors have shared that the code brings back the old layout on their accounts, so it appears like this is a solid solution for now.

How to bring back the old YouTube layout

First, you’ll need to install uBlock Origin in your browser. This is an extension that can block a host of different elements on webpages while you browse (namely, ads). However, you can set filters in uBlock Origin for advanced adjustments. This is where Chaski1212’s code comes into play.

Once you have uBlock Origin installed in your browser (it works with Chrome, Firefox, Microsoft Edge, and Opera), open the extension and click the three gears to open the dashboard. Here, click My Filters, and paste the following:

! Youtube New UI Fix
youtube.com###related #thumbnail.ytd-rich-grid-media:style(margin-right: 8px!important;height: 94px!important;width: 168px!important;min-width: 168px!important;)
youtube.com###related #avatar-link.ytd-rich-grid-media, #related #attached-survey.ytd-rich-grid-media, #related .ytd-rich-shelf-renderer .button-container.ytd-rich-shelf-renderer:style(display:none!important;)
youtube.com###related #dismissible.ytd-rich-grid-media:style(display:flex;flex-direction:row!important;)
youtube.com###related #details.ytd-rich-grid-media:style(width: 100%!important;min-width: 0!important;)
youtube.com###related #contents ytd-rich-item-renderer:style(margin:0!important;margin-top:8px!important;)
youtube.com###related ytd-rich-grid-row #contents.ytd-rich-grid-row,#related h3.ytd-rich-grid-media,#related ytd-rich-section-renderer #content,#related #rich-shelf-header.ytd-rich-shelf-renderer:style(margin:0!important;)
youtube.com###related ytd-rich-item-renderer.ytd-rich-grid-row,#content.ytd-rich-item-renderer:style(width:100%!important;)
youtube.com###related #video-title.ytd-rich-grid-media:style(font-size:1.4rem!important;)
youtube.com###related .ytd-channel-name a,#related #metadata-line.ytd-video-meta-block span:style(font-size:12px!important;)
youtube.com###related ytd-rich-grid-renderer #contents:style(padding-top:0px!important;)
youtube.com###related .ytd-rich-shelf-renderer ytd-rich-item-renderer.ytd-rich-shelf-renderer:style(width:130px!important;min-width: 130px!important;)
youtube.com###related #contents.ytd-rich-shelf-renderer:style(display: flex !important;flex-direction: row !important;gap: 8px !important;flex-wrap: nowrap!important;max-width: 400px!important;overflow-x: scroll!important;overflow-y: hidden!important)
youtube.com###related .ytd-rich-shelf-renderer .yt-core-image:style(object-fit: cover!important;)
youtube.com###related ytd-rich-section-renderer #contents:style(margin-left:0!important)
youtube.com###related #contents ytd-rich-section-renderer ytd-rich-item-renderer:style(margin-top:0px!important;)
youtube.com###related .ytd-rich-shelf-renderer ytd-rich-item-renderer.ytd-rich-shelf-renderer[hidden=""]:style(display:block!important;)
youtube.com###related #dismissible.ytd-rich-shelf-renderer:style(margin:0!important; border-color: transparent!important)
youtube.com###title yt-formatted-string.ytd-watch-metadata:style(font-size:20px!important; font-weight: 700!important; line-height:28px!important)
youtube.com##+js(set, yt.config_.EXPERIMENT_FLAGS.kevlar_watch_grid, false)
youtube.com##+js(set, yt.config_.EXPERIMENT_FLAGS.small_avatars_for_comments, false)
youtube.com##+js(set, yt.config_.EXPERIMENT_FLAGS.kevlar_watch_comments_panel_button, false)
youtube.com##+js(set, yt.config_.EXPERIMENT_FLAGS.web_rounded_thumbnails, false)
youtube.com##+js(set, yt.config_.EXPERIMENT_FLAGS.web_watch_rounded_player_large, false)
youtube.com##+js(set, yt.config_.EXPERIMENT_FLAGS.kevlar_watch_max_player_width, 1280)

This jumble of code should tell uBlock Origin to fix just about everything wrong with your YouTube player. If I ever see my YouTube UI change, I’ll be instantly reaching for this code. Let’s just hope YouTube doesn’t find a way around this hack—or, better yet, gives up on this redesign altogether.



by Life Hacker