• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Delete unused css

Explorer ,
Aug 01, 2020 Aug 01, 2020

Copy link to clipboard

Copied

Good morning, I have a website consisting of a few hundred pages and during the construction I created styles that I didn't use. I would like to know if there is a way to check which styles or selectors are not used (external stylesheet)? Thanks Augusto

 

Moving to Dreamweaver based on user history https://community.adobe.com/t5/user/viewprofilepage/user-id/6433414

TOPICS
How to

Views

2.1K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Aug 01, 2020 Aug 01, 2020

Copy link to clipboard

Copied

And what Adobe program are you asking about?
You have posted in the forum for getting help Using this particular forum system.

Need to know the name of the actual Adobe program you are using so your post can be moved to that forum.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 01, 2020 Aug 01, 2020

Copy link to clipboard

Copied

Dust-Me Selectors is a browser add-on for Firefox and Opera that scans your web page to find unused CSS selectors.

http://www.brothercake.com/dustmeselectors/

 

JitBit is an online tool that crawls your site (up to 200 pages deep).

https://www.jitbit.com/unusedcss/

 

PurifyCSS is an online tool that removes unused CSS and provides you with new minified stylesheets.

https://purifycss.online/

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Aug 01, 2020 Aug 01, 2020

Copy link to clipboard

Copied

Thanks for the reply.

I apologize for not having specified that the program I use is Dreamweaver.

August

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 03, 2020 Aug 03, 2020

Copy link to clipboard

Copied

DW doesn't currently have a tool for cleaning out unused CSS.

Your best option will be one of the tools Nancy points to.

One thing to note, at least some of the tools can't read javascripts that are being used to change styles in the page. If you have javascripts handling styles in your site, make sure you don't remove those styles if they come up as "unused" in the tools.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 03, 2020 Aug 03, 2020

Copy link to clipboard

Copied

Good point!  Always test BEFORE you commit to removing styles. 

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Aug 03, 2020 Aug 03, 2020

Copy link to clipboard

Copied

LATEST

You can do this with PurceCSS and node, it creates new cleaned copies of your stylesheets and doesn't touch your existing css files

//Install the latest versionof Node

// Install purgecss with node using the following command:

 

npm install purgecss

 

/Open a command prompt form inside your project folder (in windows hold down shift + right click and select powershell from within your project folder)
// In this example command you scan all css files in 'stylesheets' directory and check against all php/html files  in root and all js files in scripts folder - cleaned css files are saved to 'cssout' directory:

 

purgecss --css stylesheets/*.css --content *.php,*.html, scripts/*.js' --output cssout

 

For the record I don't think any of theses kind of tools are 100% perfect...

Paul-M - Community Expert

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines