Amir Helzer

<h4>Update</h4>
<p><strong>Our new plugin, <a href="http://wpml.org" rel="nofollow ugc">WPML</a>, includes the functionality of <em>CMS Navigation</em> and is recommended for new designs.</strong></p>
<p>It features much cleaner and simpler HTML and customization via the admin screen.</p>
<p>Additionally, we recommend you checkout our new CMS enabling plugins <strong>Types</strong> and <strong>Views</strong>.</p>
<ul>
<li><a href="http://wp-types.com/home/types-manage-post-types-taxonomy-and-custom-fields/" rel="nofollow ugc">Types – The Custom Types and Custom Fields Plugin</a> – manages custom content type, including post types, taxonomy and custom fields.</li>
<li><a href="http://wp-types.com/" rel="nofollow ugc">Views – The Custom Content Display Plugin</a> – displays custom content types in whatever way you choose.</li>
</ul>
<p>With Types and Fields, you can achieve the functionality of this plugin yourself and customize it in whatever way you like.</p>
<h4>Legacy Stuff</h4>
<p>Do you want to use WordPress to create a full website, with easy navigation and menus?<br />
This plugin will let you add essential navigation functions to your template, including:</p>
<ul>
<li>Top navigation bar, listing the top-level pages and their children (as drop-down items).</li>
<li>Breadcrumbs trail navigation that shows the path to the current page all the way from the home page.</li>
<li>Left navigation that shows where the visitor is next to the page’s parent and nearby pages.</li>
</ul>
<p>No configuration is required. To use, add the calls that create each navigation element to your template.<br />
These calls can be added to any WP template</p>
<p>There are three template functions that can be used for displaying the navigation sections</p>
<h4>Drop down top menu</h4>
<p>Function:<br />
    cms_navigation_menu_nav($order=’menu_order’, $show_cat_menu=false, $catmenu_title=’News’)</p>
<p>This will display the top navigation – the top level pages with their sub pages as drop down elements.<br />
Additionally – if specified – the menu will include the top level post categories at the end.</p>
<p>Normally, this function is added to your header.php file, so that it applies to the entire website.</p>
<p>Examples:</p>
<ul>
<li><code><?php cms_navigation_menu_nav() ?></code> – include without the categories menu.</li>
<li><code><?php cms_navigation_menu_nav('post_title') ?></code> – sort items by title.</li>
<li><code><?php cms_navigation_menu_nav('menu_order',true,'News') ?></code> – sort items according to the ‘order’ field.</li>
</ul>
<h4>Breadcrumbs trail navigation</h4>
<p>Function:<br />
    cms_navigation_breadcrumb()</p>
<p>This will display a path from the current page all the way to the home page.<br />
It’s useful for visitors who land in your website to know where they are and be able to navigate to relevant pages.</p>
<p><strong>For posts</strong></p>
<pre><code>Home >> CATEGORY-NAME >> Post title
</code></pre>
<p><strong>For pages</strong></p>
<pre><code>Home >> Parent pages... >> Page title
</code></pre>
<p>All the items back to the home page will be clickable.</p>
<p>You can add this function to single.php and page.php so that it will produce trail navigation for every page or post.</p>
<h4>Sidebar navigation</h4>
<p>Function:<br />
    cms_navigation_page_navigation($order=’menu_order’)</p>
<p>This will display the sidebar navigation for pages.<br />
It will show a tree created the page parents and it’s ‘brother’ pages (other children to the same parent).</p>
<p>This function should be added to page.php, as it provides local navigation between pages.</p>
<h4>Live example using this plugin</h4>
<p><a href="http://www.baripedia.com" title="Tourist resource site for the city of Bariloche" rel="nofollow ugc">Baripedia</a> is using this plugin (and other CMS related plugins we’ve written).</p>
<h3>Version History</h3>
<ul>
<li>Version 0.1
<ul>
<li>First public release.</li>
</ul>
</li>
<li>Version 0.2
<ul>
<li>Removed some of unneeded formatting.</li>
<li>Added option to set the tag around sidebar navigation heading.</li>
</ul>
</li>
<li>Version 1.2
<ul>
<li>Handles setting static pages for homepage and blog page.</li>
</ul>
</li>
<li>Version 1.2.1
<ul>
<li>Added static home page to top navigation</li>
</ul>
</li>
<li>Version 1.3
<ul>
<li>Works with IE6 as well as other browsers (didn’t support IE6 before)</li>
<li>Removed the gradient and simplified the CSS for customizing the menus</li>
<li>The top menu HTML has changed. If the encapsulating DIV has a background, you may need to change or remove it.</li>
</ul>
</li>
<li>Version 1.4
<ul>
<li>Added feature to exclude pages from the top navigation.</li>
<li>Added GUI for controlling page settings (instead of editing custom fields).</li>
</ul>
</li>
<li>Version 1.4.2
<ul>
<li>Added migration instruction to <a href="https://wordpress.org/extend/plugins/sitepress-multilingual-cms/stats/" title="WPML Multilingual CMS" rel="ugc">WPML</a></li>
</ul>
</li>
</ul>


CMS Navigation

Out-of-the-box support for full CMS navigation in your WordPress site including drop down menus, breadcrumbs trail and sidebar navigation.

Edi Amin

<p>Struggling with adding multiple CSS classes to your WordPress blocks? CSS Class Manager simplifies the process with autocomplete suggestions and a dedicated manager for adding, editing, and organizing your classes. Boost your block styling efficiency!</p>
<p>There are two main motivations behind creating this plugins:<br />
<strong>Limitation of Block Style</strong> – When applying a block style, only one CSS class can be added to a block. Unfortunately, the block editor lacks the ability to select multiple block styles. To address this, users must resort to the Additional CSS Class(es) inspector control to apply multiple classes. CSS Class Manager provides a powerful manager and an autocomplete inspector control, enabling users to easily add and apply CSS classes to their blocks.<br />
<strong>Poor UX of the Addional CSS Class(es) control</strong> – The default control for adding class names is a simple text input. This can be cumbersome, especially when applying CSS classes frequently. With the custom inspector control provided by CSS Class Manager, users can effortlessly add their class names, enhancing the user experience.</p>
<h3>Features</h3>
<ul>
<li><strong>Advanced Autocomplete Control:</strong> Streamline block styling with autocomplete functionality for CSS classes.</li>
<li><strong>Effortless Class Management:</strong> Easily add, edit, or remove CSS classes directly within the manager interface.</li>
<li><strong>Body and Post Classes:</strong> Add custom class names to post body and post containers using body_class and post_class filters directly from the post editor.</li>
<li><strong>Inline CSS Classes:</strong> Add custom class names to any selected text inside paragraph, heading and other blocks that support Rich Text.</li>
<li><strong>Theme.json Integration:</strong> Automatically include global class names generated from theme.json settings in your class suggestions.</li>
<li><strong>Show the control in its own panel:</strong> User specific settings to show the Addional CSS Class(es) control in its own panel.</li>
<li><strong>Import and Export:</strong> Seamlessly transfer custom CSS class names to ensure consistency across projects.</li>
</ul>
<h3>Getting Started</h3>
<ol>
<li>Activate the plugin within your WordPress setup.</li>
<li>The advanced control will replace the default “Additional CSS Class(es)” and can be found in the “Advance” block settings section.</li>
<li>Adding and selecting classes in the autocomplete field is similar to the tags and categories fields.</li>
<li>To add body or post classes, look for the “Body Classes” and “Post Classes” controls in the Post tab of the post editor (requires custom-fields support). <a href="https://github.com/ediamin/css-class-manager/wiki/Known-Issues#body-classes-preview-in-block-editor" rel="nofollow ugc">See the limitations</a></li>
<li>To add inline classes to the selected text, use the block format tool control in the text formatting tools options (available in blocks that support Rich Text).</li>
<li>To edit and manage class names, click the “Open Class Manager” link or select “CSS Class Manager” from the More Menu.</li>
<li>Import/Export can be done from the manager modal.</li>
<li>Theme.json generated classes are automatically included and can be disabled from the Preferences in the manager modal.</li>
<li>Use <code>css_class_manager_filtered_class_names</code> filter to add class names with PHP files.</li>
</ol>


CSS Class Manager – An advanced autocomplete additional css class control for your blocks


For years I used the Editors Kit plugin for the sole purpose of the CSS Class Management. However, though the years that plugin became a disaster, with lots of garbage added to it.



Thankfully I found this little gem. The only thing that I want to add as a Wishlist, that the Editors Kit has is to export the custom CSS classes in php as well, so we can simply include that code in our plugins/themes, so we don't have to import/export the json files with each site installation.



Nevertheless, this is one of my must use plugins for every site, since I have dozens of custom CSS classes to deal with.



I can not express enough my gratitude, YOU ROCK !!!


I really REALLY appreciate this.

Advanced autocomplete CSS class control for blocks with inline styling, body/post classes, and powerful management tools.

CMS Navigation vs CSS Class Manager – An advanced autocomplete additional css class control for your blocks