Tagged: compliance, debugging, Development
-
AuthorPosts
-
September 25, 2022 at 2:22 pm #1366262
Hi,
how do i find in your theme CSS classes and ID which are not in use?
Or better: How do i find pages which have certain classes/IDs?Example:
My website has 500 pages
In 5 of them i might have given a class called “something”.
How do i find these 5 pages?regards
evaSeptember 26, 2022 at 8:55 am #1366300Hey evas49,
Thank you for the inquiry.
You may need to manually do a database search for these classes in the wp_posts > post_content.
// https://codex.wordpress.org/Database_Description#Table:_wp_posts
Best regards,
IsmaelSeptember 26, 2022 at 12:12 pm #1366334That would be a valid way if i would know which classes or IDs i look for.
But what if want to know IF there are any unused classes or IDs but i dont know their names?
kind regards
evaSeptember 27, 2022 at 9:25 am #1366483Hi,
You can try the Coverage tab in Chrome Devtools but this will return all css that are not active or css rules that are only used when a specific setting is enabled and it will only capture unused code in the current page.
If you ran the tool in the home page of the default Enfold demo for example, the code below will be captured as unused if the Enfold > General Layout > Stretched Or Boxed Layout settings is set to Stretched Layout.
html.html_boxed { background: #ffffff center center repeat scroll; }
Please check the link below for more info.
// https://developer.chrome.com/docs/devtools/coverage/
You can also try WPRocket > Activate Remove Unused CSS. Make sure to create a site backup or a restore point before enabling it.
// https://www.wpbeginner.com/wp-tutorials/how-to-remove-unused-css-in-wordpress-the-right-way/
Best regards,
IsmaelSeptember 28, 2022 at 4:57 pm #1366750Its not about the code, Ismael.
Its aboout classes or IDs i might have given in the ALB but never usedSeptember 29, 2022 at 8:36 am #1366840Hi,
It is not possible to track those attributes at the moment. You might have to look for them manually in the builder.
Best regards,
IsmaelSeptember 29, 2022 at 6:20 pm #1366968That is an interesting idea. It would be really cool, if there are some way to catalog all css, js, frameworks, etc. within a site. I have not used Rocket, but it sounds like it has part of what you are seeking, but I can definitely see merit in either a tool to discover all css/js references within a site, or more of a site repository that was almost like a cvs.
From a tech support angle, I can see huge benefits, but also for compliance and development as well.
I know that many larger plugins have tools to pull all of the plugins, themes, etc. on an active site, but to take it one step further could prove incredibly useful.
@Ismael, what are the toolsets you are using to get information like this when trying to isolate issues/incompatibilities? Is there something already out there? -
AuthorPosts
- The topic ‘How to find unused CSS’ is closed to new replies.