Output unique categories of entries

Question

I have a page where I'm outputting news entries. And these all are assigned to categories. And based on these, I have a jQuery plugin that sorts the entries visible based on the categories.

So my markup basically looks like this:

<ul id="news_categories">
    <li><a class="filter" data-filter="mix-all">All</a></li>
    {exp:channel:entries channel="News" dynamic="no" show_empty="no"}
        {categories}
            <li><a class="filter" data-filter="{category_name}">{category_name}</a></li>
        {/categories}
    {/exp:channel:entries}
</ul>

Now, this outputs the categories, but I only want unique ones. Right now, this outputs the following:

• All
• Photo
• Courses
• Arrangements
• Photo
• School
• Arrangements
• School

You probably get the idea. How can I output only unique categories?

Answer 1

You should be using the {exp:channel:categories} tag instead since you're only grabbing the category names. View the user guide.

<ul id="news_categories">
    <li><a class="filter" data-filter="mix-all">All</a></li>
    {exp:channel:categories channel="News" show_empty="no" style="linear"}
        <li><a class="filter" data-filter="{category_name}">{category_name}</a></li>
    {/exp:channel:categories}
</ul>