How To: Create a multi-select categories list in modx with a TV

Though tags are popular and you should use them, but categories are still a nice way to create organized content, so when you are building your blog on top of modx, this tutorial will help you how to create the multi-select categories list.

A visual example of what you are going to get:

You will need the following to start:

  1. modx 096 installed and working fine.
  2. Less than 5 minutes from your precious time ;)

Lets start it step by step:

Step1:

Login to your MODx manager.

Goto Resources -> Manage Resources -> Template Variables

Click on New Template Variable

Now you are on the screen that looks like the screenshot below:

see the related screenshot example

Step2:

Lets setup the TV, read below for the next steps:

Template Variable

This section contains everything to setup the TV, so fill out the fields as per the information below:

Variable Name: blogCategories

Caption: Select Categories:

Description: CTRL+Click to select multiple categories

Input Type: Listbox (Multi-Select)

Input Option Values:

Here you can define the list of categories by using the double pipe delimited syntax like: modx||xpdo||css||free modx templates

Default Value:

Want some category as a default? fill it here. i.e. free modx templates

Widget:

This option formats the TV output and is builtin. Its just amazing! ;), select the following from the drop down list:

Delimited List and use comma "," in the Delimiter.

Sort Order: (leave it blank)

Template Access

If you have seen above, "Add or edit template variables here. Template Variables must be assigned to templates in order to access them from snippets and documents." pretty self-explanatory? ... cool. Now assign it to your template (the template you are using with your blog posts)

In my case, because I am using default MODx install without sample content, so I only have "Minimal Template", so I checked it.

Category

This is the category to group the resources, nothing related to TV funcionality, you can safely ignore it if it confuse you.

Below is the screenshot with all fields filled in.

see the related screenshot example

Voila! your multi-select categories list is ready to be used in the blog post, it will appear on document editing screen. Go and try!

I'll be writing some more, be sure to subscribe to my RSS for future updates. Until next time, take care of yourself and people around you.