[css_select] Turn class and id fields into select boxes

I've written an extension with which any of the Contao core fields for class or ID can be changed into a selectbox. You can find it here: http://contao.org/extension-list/view/css_select.html

The advantage is that you can now give your customer who edits his/her website the ability to assign classnames or ids to any element by using a selectbox. Typically there are a limited amount of css classes that are used in CSS or JS, so making a fixed list would suit most cases. Leaving the field as a text type forces you to either not use the field for the customer or supply a list with case sensitive words that they can use.

[attachment=0:2jpbccv2]picture.jpg[/attachment:2jpbccv2]
This extension replaces content_cssid_select that only did this for content elements.

TODO:

• ga.n suggested to add a checkbox to CSS styles so they get auto added to "the" list. Have to figure out how this works out now I have many lists with this new extension[/*:m:2jpbccv2]

Quote:

---

Originally Posted by thyon

I don't think the CSS checkbox in styles will work. Most of the time I use multistage selectors, so then a checkbox won't work.

e.g.
.mod_article .ce_text .dark_box { }

So how to extract the class name safely...?

---

(from: viewtopic.php?f=21&t=3848&p=20232#p20208)

Well, it would be a small problem in both ways. You either want to set multistage selectors in your css, or you want to choose multiple classnames/ids for any element.

The first can indeed only be solved by some advanced code a BE module of sorts that allows to select selectors and assign labels, but that might decrease the usefulness of the checkbox....

The second could be solved by a carthesian product. But that leaves some unique problems. Right now I have the settings within tl_settings. A proper module is needed to filter out possible combinations and assign labels.

a better approach (in order to apply multiple classes) could be something like the "tags" selector of the extension Tag

Quote:

---

Originally Posted by ga.n

a better approach (in order to apply multiple classes) could be something like the "tags" selector of the extension Tag

---

Then the tags would be the label? But still, most selectors would not be suitable because most contain elements or pseudo classes.

Quote:

---

Originally Posted by thyon

A client checkbox of additional and then merge the predefined ID/CSS field and the the checkbox classes would be better solution.

---

I don't follow... Can you explain what you mean.

I like this extension. I'd love seeing it configurable differently for different users. As a site admin I sometimes have to set css classes which should not be available for other users. They also can not edit those elements. So it would be great that it could be enabled/disabled by user or user group.

To handle the issue that sometimes an editor could update an class which is not defined in the list, the select menu could add this new value dynamicially to the list only for the current element.