teastudio.pl

Cool Cat Ideas

Categories All In One is a powerful and flexible WordPress plugin that lets you display a customizable list of categories anywhere on your site. 
Choose your taxonomy, control the layout and style, set depth levels, and sort your content exactly how you need it – including manual drag-and-drop ordering of categories for full control over the display sequence.
For more information, check out <a href="https://teastudio.pl/product/categories-all-in-one/" rel="nofollow ugc">PLUGIN HOMEPAGE</a>.
Key Features:
<ul>
<li>Supports any category cointains ‘category’ string in name </li>
<li>Legacy widget</li>
<li>Gutenberg block</li>
<li>Shortcode <code>[categories_all_in_one ...]</code> for embedding the categories anywhere </li>
<li>Configure list style, counter brackets, sorting with drag & drop, depth and classes </li>
</ul>
Watch the demo video 
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/N_OcJBvvecU?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
Shortcode explanation:
<pre><code>[categories_all_in_one list="bullet" separator="" hide_empty="false" show_count="true" counter_brackets="round" orderby="name" order="asc" custom_class="" post="false" parent_category="" max_depth="0" block_custom_class="" taxonomy="category" exclude=""]
</code></pre>
Params: 
lang: optional language code, ‘en’ 
post: optional proper post ID, “” 
taxonomy: proper taxonomies, separated by commas 
parent_category: proper category ID, “” 
orderby: name, count 
order: asc, desc, rand 
max_depth: 0, 1…n 
hide_empty: true, false 
exclude: category ID separated by commas, “” 
include: category ID separated by commas, “” 
list: bullet, numbered, “” 
show_count: true, false 
counter_brackets: round, curly, square, angle, “” 
show_description: true, false 
description_length: 0, 1…n 
description_link: true, false 
separator: “” 
custom_class: “” 
block_custom_class: “”
Example of use: 
 [categories_all_in_one exclude=”” lang=”en” post=”false” parent_category=”” orderby=”name” order=”asc” max_depth=”0″ hide_empty=”false” list=”bullet” show_count=”true” counter_brackets=”round” show_description=”true” description_length=”100″ description_link=”true” separator=”” custom_class=”” block_custom_class=”” taxonomy=”category”]
<h4>DEMO</h4>
You can see the plugin in action on <a href="https://coolcatideas.com/blog/" rel="nofollow ugc">DEMO PAGE</a>
<h3>Translations</h3>
<ul>
<li>English (en_EN) – by Marcin Gierada</li>
<li>Polish (pl_PL) – by Marcin Gierada</li>
</ul>
<h3>Building the Plugin in Development Mode</h3>
The source code for the plugin is available at: <a href="https://gitlab.com/cool-cat-ideas/categories-all-in-one#" rel="nofollow ugc">GitLab Repository</a>. We encourage developers to contribute, fork, and improve the plugin. 
To build the plugin in development mode, follow these steps:
<h3>1. Install Dependencies</h3>
Run the following command to install npm dependencies: 
 npm install
<h3>2. Build Gutenberg Block</h3>
To build only the Gutenberg block, use: 
 npm run build-gutenberg
This will compile the block’s JavaScript and place it in the <code>js/block/</code> folder.
<h3>3. Build Full Plugin</h3>
To build the entire plugin, including the Gutenberg block and other files, use: 
 npm run build 
This will generate the plugin package in the <code>dist/</code> folder.

Categories All In One

Display customizable category list from selected taxonomies with various sorting and styling options.

Fernando Briano

Simple plugin to display categories in any post or page with a shortcode. It’s basically a shortcode API interface to the <a href="https://developer.wordpress.org/reference/functions/wp_list_categories/" rel="nofollow ugc">wp_list_categories</a> WordPress function. This means given any of the <a href="https://developer.wordpress.org/reference/functions/wp_list_categories/#parameters" rel="nofollow ugc">parameters</a> accepted by the function, you can pass it in as a shortcode parameter to the <code>categories</code> shortcode.
Usage:
<pre><code>[categories orderby=count]
</code></pre>
Will display links to all the categories and order them by number of posts in each category.
You can also list tags or any other WordPress taxonomy. You need to pass a value to the <code>taxonomy</code> parameter. For example to list tags: <code>[categories taxonomy=post_tag title_li="Tags"]</code>. 
By default, the usage shows:
<ul>
<li>No link to all categories</li>
<li>Sorts the list of Categories by the Category name in ascending order</li>
<li>Displayed in an unordered list style</li>
<li>Does not show the post count</li>
<li>Displays only Categories with posts</li>
<li>Sets the title attribute to the Category Description</li>
<li>Is not restricted to the child_of any Category</li>
<li>No feed or feed image used</li>
<li>Does not exclude any Category and includes all Categories</li>
<li>Displays the active Category with the CSS Class-Suffix ‘ current-cat’</li>
<li>Shows the Categories in hierarchical indented fashion</li>
<li>Display Category as the heading over the list</li>
<li>No SQL LIMIT is imposed (‘number’ => 0 is not shown above)</li>
<li>Displays (echos) the categories</li>
<li>No limit to depth</li>
<li>All categories.</li>
<li>The list is rendered using a new walker object of the the Walker_Category class</li>
</ul>
See <a href="https://developer.wordpress.org/reference/functions/wp_list_categories/" rel="nofollow ugc">wp_list_categories</a> for usage.
<h3>Markup and Styling of Category Lists</h3>
Taken from the <a href="https://codex.wordpress.org/Template_Tags/wp_list_categories#Markup_and_Styling_of_Category_Lists" rel="nofollow ugc">wp_list_categories official documentation</a>.
By default, wp_list_categories() generates nested unordered lists (ul) within a single list item (li) titled “Categories”.
You can remove the outermost item and list by setting the title_li parameter to an empty string. You’ll need to wrap the output in an ordered list (ol) or unordered list yourself (see the examples above). If you don’t want list output at all, set the style parameter to none.
You can style the output with these CSS selectors :
<pre><code>li.categories { ... } /* outermost list item */
li.cat-item { ... }
li.cat-item-7 { ... } /* category ID #7, etc */
li.current-cat { ... }
li.current-cat-parent { ... }
ul.children { ... }
</code></pre>
For instance, you can remove the bullet points next to each category with:
<pre><code>.cat-item {
 list-style-type: none
}
</code></pre>
<h3>Show categories list in columns</h3>
For outputting the list into columns, you can use <a href="https://www.w3.org/TR/css-multicol-1/" rel="nofollow ugc">CSS’s multicolumns</a>. Since by default the list is printed as an unordered list with the “categories” class, you can add this to your CSS:
<pre><code>.categories{
 column-count: 5;
 column-gap: 50px;
}
</code></pre>

List categories

Thanks for publishing this little plugin. I ended up taking the code and integrating it into a custom solution but the plugin is well put together and pretty powerful.
Some better docs would help make it more useful for folks.
Thanks for making this available!



Elegantly Written

Simple plugin to display categories in any post or page with a shortcode.

Categories All In One vs List categories