Alex Dunae

<p>This plugin adds classes or IDs (your choice) to the <code>LI</code> tags generated by WordPress’ <code>wp_list_pages()</code> and <code>wp_nav_menu()</code> functions.</p>
<p>I found it very frustrating to style the output of these menus without having access to these attributes. This plugin allows you to style the output of <code>wp_list_pages()</code> and <code>wp_nav_menu()</code> with CSS.</p>
<p>The class name or ID is derived from the URL of the page.</p>
<p>For example,</p>
<ul>
<li><code>/about/</code> could have the class <code>about</code>. </li>
<li><code>/about/faq/</code> could have the class <code>about_faq</code>.</li>
</ul>
<p>If a page does not have a URL (e.g. your front page) the plugin will set the <code>class</code> or <code>id</code> (depending on what you selected) to <code>frontpage</code>, adding whatever prefix you requested.</p>
<p>For example,</p>
<ul>
<li><code>/</code> could have the class <code>pg_frontpage</code>. </li>
</ul>
<p>Existing classes (e.g. <code>page_item</code> or <code>current</code>) are left untouched.</p>
<h4>Sample output</h4>
<pre><code><li id="nav-a-new-page" class="first page_item page-item-4"><a href="http://example.com/a-new-page/" title="A new page">A new page</a></li>
<li id="nav-about" class="page_item page-item-2"><a href="http://example.com/about/" title="About">About</a></li>
<li id="nav-another-new-page" class="last page_item page-item-6"><a href="http://example.com/another-new-page/" title="Another new page">Another new page</a></li>
</code></pre>
<h4>Configuration</h4>
<p>Using the <code>Classy wp_list_pages</code> tab in the options panel you can choose whether you want to use IDs or classes, set the token separator and add an optional token prefix.</p>
<p>You can also specify a class to add to the first and last items in a list.</p>
<p>Pretty straight forward…</p>
<h3>Contact and Credits</h3>
<p>Written by Alex Dunae ( <a href="http://dunae.ca/" rel="nofollow ugc">dunae.ca</a> ), e-mail ‘code’ at the same domain), 2007-09.</p>


Plugin Name: Classy wp_list_pages

Adds a uniqe class or ID attribute to each LI tag generated by wp_list_pages() and wp_nav_menu() allowing them to be individually styled with CSS.

Andrei Lupu

<p>You can use this plugin to add a unique CSS class to your pages or posts.</p>
<h4>Demo</h4>
<p><a href="https://tastewp.com/" rel="nofollow ugc">TasteWP</a> has prepared a quick WordPress instance with this plugin, so you can give it a try <a href="https://demo.tastewp.com/wp-custom-body-class" rel="nofollow ugc">in this demo</a></p>
<h4>Responsiveness</h4>
<p>There’s a way to add a class to appear only on mobile devices. You can do that by simply adding <code>mobile-</code> on the front of<br />
the class. For example, if you want to have the class “car” for mobile side, you need to use “mobile-car”.</p>
<h4>Support me</h4>
<p>If you find this plugin helpful, or you just want to send me a coffee here are the ways:</p>
<ul>
<li>Use the Github Sponsor button</li>
<li><a href="https://ko-fi.com/thelup" rel="nofollow ugc">Ko-fi</a></li>
<li>Watch me coding on <a href="https://www.twitch.tv/thelup/" rel="nofollow ugc">twitch.tv/thelup</a></li>
<li>Or simply visit my site <a href="https://a.lup.dev/" rel="nofollow ugc">lup.dev</a> and make those analytics ring the bells.</li>
</ul>


Custom Body Class

A plain simple plugin which allows you to add a custom CSS class the HTML body tag.

Plugin Name: Classy wp_list_pages vs Custom Body Class