--- title: Coding an extension that blocks Social Media Websites... description: Social Media Blocks is a Google Chrome extension that will block social media websites like Twitter: Facebook, Instagram, LinkedIn, WhatsApp, Reddit etc. Add... canonical: https://daily.dev/posts/coding-an-extension-that-blocks-social-media-websites-with-html-css-and-js--xcmt0vxsg twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: Coding an extension that blocks Social Media Websites with HTML, CSS and JS. | daily.dev og:description: Social Media Blocks is a Google Chrome extension that will block social media websites like Twitter: Facebook, Instagram, LinkedIn, WhatsApp, Reddit etc. Add... og:url: https://daily.dev/posts/coding-an-extension-that-blocks-social-media-websites-with-html-css-and-js--xcmt0vxsg og:image: https://api.daily.dev/og/posts/xcmt0VxSG.png og:image:alt: Coding an extension that blocks Social Media Websites with HTML, CSS and JS. og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # Coding an extension that blocks Social Media Websites with HTML, CSS and JS. **[Community Picks](https://daily.dev/sources/community)** · 6 min read · 81 upvotes · 1 comments ## Summary Social Media Blocks is a Google Chrome extension that will block social media websites like Twitter: Facebook, Instagram, LinkedIn, WhatsApp, Reddit etc. Add this extension into your browser and achieve better productivity. Create the project using the CodePen playground or setup your own project on Visual Studio Code with the following file structure. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Community discussion Top comments from developers on daily.dev. **@thecoverliker** · 0 upvotes > Animated cover! yep! --- Tags: [#javascript](https://daily.dev/tags/javascript), [#css](https://daily.dev/tags/css), [#html](https://daily.dev/tags/html) [View this post on daily.dev](https://daily.dev/posts/coding-an-extension-that-blocks-social-media-websites-with-html-css-and-js--xcmt0vxsg) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"Coding an extension that blocks Social Media Websites with HTML, CSS and JS.","url":"https://daily.dev/posts/coding-an-extension-that-blocks-social-media-websites-with-html-css-and-js--xcmt0vxsg","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/coding-an-extension-that-blocks-social-media-websites-with-html-css-and-js--xcmt0vxsg"},"datePublished":"2022-07-22T18:56:59.344Z","dateModified":"2023-12-07T12:02:45.284Z","description":"Social Media Blocks is a Google Chrome extension that will block social media websites like Twitter: Facebook, Instagram, LinkedIn, WhatsApp, Reddit etc. Add...","image":"https://res.cloudinary.com/practicaldev/image/fetch/s--xcdL_-_Y--/c_imagga_scale,f_auto,fl_progressive,h_500,q_66,w_1000/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/at6khluju6hwcwfeicw9.gif","thumbnailUrl":"https://res.cloudinary.com/practicaldev/image/fetch/s--xcdL_-_Y--/c_imagga_scale,f_auto,fl_progressive,h_500,q_66,w_1000/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/at6khluju6hwcwfeicw9.gif","isAccessibleForFree":true,"articleSection":"Community Picks","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Community Picks","logo":"https://media.daily.dev/image/upload/t_logo,f_auto/v1655817725/logos/community","url":"https://daily.dev/sources/community"},"commentCount":1,"discussionUrl":"https://daily.dev/posts/coding-an-extension-that-blocks-social-media-websites-with-html-css-and-js--xcmt0vxsg","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":81},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":1}],"keywords":"javascript,css,html","timeRequired":"PT6M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Community Picks","item":"https://daily.dev/sources/community"},{"@type":"ListItem","position":3,"name":"Coding an extension that blocks Social Media Websites with HTML, CSS and JS."}]} {"@context":"https://schema.org","@type":"WebPage","@id":"https://daily.dev/posts/coding-an-extension-that-blocks-social-media-websites-with-html-css-and-js--xcmt0vxsg","comment":[{"@type":"Comment","text":"Animated cover! yep!","datePublished":"2022-07-25T11:55:02.333Z","url":"https://daily.dev/posts/xcmt0VxSG#c-KnQzy-tCL","author":{"@type":"Person","name":"TheCoverLiker","url":"https://daily.dev/thecoverliker","image":"https://media.daily.dev/image/upload/v1681623072/avatars/avatar_sDzCovimjL.jpg"}}]} ```