DEV Community

Cover image for How I optimized my YouTube for productivity.
JohnnieDom
JohnnieDom

Posted on

How I optimized my YouTube for productivity.

Being productive most times is just being able to avoid some distractions and focus on what needs to be done, Avoiding distractions sometimes is technically hard, but it can be avoided.

YouTube is one of my productivity tools, but sometimes it turns out to be a distraction as well, so I researched ways to prevent that. 
Each time I visit YouTube to check out something.
For example, let's say I want to check out "How to use Framer motion animation in React" on YouTube. On my initial visit to the YouTube homepage, I stumbled upon different videos. I can't help it but check out what some videos. I might end up entirely forgetting the reason I initially visited YouTube until I leave the site. I have found a way to prevent that.

Some caveats to take note of.

  • This is only for those using a desktop or laptop.

  • It doesn't work on phones.

  • This is unfortunately a temporary method.

With that said, let's move on to how to optimize your YouTube for productivity.

Install the Stylus browser extension.

Link For Firefox Users: https://addons.mozilla.org/en-US/firefox/addon/styl-us/

Firefox extension

Link For Chrome/Opera/Edge/Brave Users: https://chromewebstore.google.com/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmneclngdbkpkpeebahjckkjfobafhncgmne

Chrome/opera/Edge extension

After you're done installing the extension, open the extension by clicking the Icon I highlighted in the blue box, You will see the Stylus icon. Click on it.

Image description

After you have done that. 
Click on the Write new style at the left tab; this will take you to a new page. Where you will paste this code



/* Temporary fixes. THESE WILL NOT WORK THE NEXT TIME YOUTUBE UPDATES ITS CODE. */
ytd-watch-metadata { 
  display: none !important;
}
#meta-contents[hidden], #info-contents[hidden] { 
  display: block !important;
}

/* Permanent fixes */
/* Removes second comment section, */
#comment-teaser.ytd-watch-metadata {
display: none;
}
/* Removes border around creator's name and sub button. NOTE: This part doesn't work as of 1.1, but keeping it for now just in case. */
#owner.ytd-watch-metadata {
border: none; 
}
/* Removes border around creator's name and sub button. */
ytd-watch-metadata:not([modern-metapanel]) #owner.ytd-watch-metadata {
border: none;
}
/* Reverts the video title font. */
ytd-watch-metadata[smaller-yt-sans-light-title] h1.ytd-watch-metadata {
  font-family: "Roboto",sans-serif;
  font-weight: 400;
  font-size: 18px;
}
ytd-video-primary-info-renderer[use-yt-sans20-light] .title.ytd-video-primary-info-renderer {
  font-family: "Roboto",sans-serif;
  font-weight: 400;
  font-size: 18px;
}
/* Removes the bold letters on upload date and view count. */
.yt-formatted-string[style-target="bold"] {
  font-weight: 400;
}

#contents.ytd-rich-grid-renderer{
  display: none;
}



Enter fullscreen mode Exit fullscreen mode

Then on the top of the editor, change the drop-down, which is initially Everything, to URLs on the domain

Steps

 You will see a new input; paste this there. youtube.com and click on save at the left tab there. 
Steps

Bravo! 👏🏼 you're done.
You can now open your YouTube, and you will see something like this:

Steps

You can go ahead and search for what you exactly want without being distracted.

Thanks for reading 💖.

Top comments (0)