Front-end developer here playing with fire. I'm developing a site that as a specific UI element that I want to reuse throughout the site. Specifically it's a button that has different "configuration" options. You can change the colors, add an icon, etc. It's currently all controlled via CSS classes. You can think of the element as something akin to a Button within Twitter Bootstrap.

I'd like to build a custom fieldtype so that users within the CMS can add in these UI elements throughout the site and change the options such as color, size, name, link, etc. I'd like to be able to place this type inside of Matrix blocks. So doing this within an existing Matrix isn't really feasible.

I'm kind of thinking of it as a mini-matrix or an advanced table element. If someone can point me in the right direction that'd be great. Thanks!

The concept I'm currently struggling with is how to create the fieldtype and have it save the data from the different form elements within my fieldtype to the database.

3 Answers 3


You have (at least) two options here:

  1. Create a matrix block with the fields you need. That way, the user kan add one or more blocks of the type 'button' (for instance) to the page. Within button, you could have a plain text field for the link and name, a color field for the color, a number field for size, etc.

  2. Create your own fieldtype (http://buildwithcraft.com/docs/plugins/field-types, not as easy as first option). That way you have optimal control over the way your user inputs values.

I would go with option 1.

  • 1
    A Matrix block won't work currently as this is an element that I envision being able to be put into Matrix blocks. The question is geared more towards how to do option 2. I'll edit my question to be more clear.
    – Ian
    Jul 16, 2014 at 22:05

Paul's suggestion should work fine based on your description. Another way to improve this would be to set the max blocks to 1 in your field settings, and to also use a different tab along the lines of 'theme' in your field layout. This will help separate the content and styles in the CMS, and prevent the client from adding multiple blocks of classes that will override each other.


It turns out I ended up needing to utilize a Model with the fieldtype. I'm changing my approach to this and won't be needing this custom fieldtype. But you can see what I ended up coming up with via this gist. I'm not sure this is the totally correct way to handle this, but I got it working how I imagined.

If anyone is super interested this is how I went about figuring it out. I picked apart the SmartMap plugin to learn more about models and how to output them within templates.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.