Add URL Slugs to body Class
This plug-in takes the URL, chops it into pieces, and adds each “piece” as an additional
class to the body
tag.
Meaning, if your page’s URL is:
http://www.example.com/2012/02/24/wordpress-plugin-add-url-slugs-as-body-classes/
Your page’s body
tag would have at least these classes:
2012 02 24 wordpress-plugin-add-url-slugs-as-body-classess
It gets much stronger when you start thinking about Categories or nested Pages:
http://www.example.com/category/wordpress/
which would add:
category wordpress
while:
http://www.example.com/movies/star-trek/wrath-of-khan/
would add:
movies star-trek wrath-of-khan
This allows you to very easily add custom CSS and/or JS to these pages based on these new CSS classes.
Please let me know if you have any questions/suggestions/thoughts,
Atg
http://aarontgrogg.com/
[email protected]
/wp-content/plugins/
)body
tag so you can easily add custom CSS and/or JS to Posts orbody
tag.Say you created a Post that could be found at the following URL:
http://www.example.com/2012/02/24/wordpress-plugin-add-url-slugs-as-body-classes/
That page’s body
tag would have at least these classes:
2012 02 24 wordpress-plugin-add-url-slugs-as-body-classess
It gets much stronger when you start thinking about Categories or nested Pages, because a Category page like:
http://www.example.com/category/wordpress/
get these additional CSS classes:
category wordpress
This would allow you to add custom CSS and/or JS to all Category pages, or even just the WordPress Category page!
Or a nested Page that could be found at this URL:
http://www.example.com/movies/star-trek/wrath-of-khan/
would get these additional CSS classes:
movies star-trek wrath-of-khan
So you could add custom CSS just for your Movies pages, other custom CSS for just the Star Trek Movies pages,
and still more custom CSS for just the Wrath of Khan Star Trek Movie page.
2015-05-15:
* Tested & verified in WP 4.2.2, and added a few FAQs
2013-01-11:
* Tested & verified in WP 3.5
2012-02-24:
Well, this is the first version, so… here it is!