How add a class to select element tag in Contact Form 7?
-
Hi there. I’m a big fan of Contact Form 7 and I always come to a point where I need to make a few extended customization to my forms. This time, I’m quite frustrated trying to add different classes to a select element <option> tag with no avail.
For e.g:
First, I need to create a select element with id=”cd-dropdown” and class=”cd-select”, until here, this can be easily achieved with the CF7 shortcode generator as bellow.
[select* select-profissao id:cd-dropdown class:cd-select "Professional" "Nurse" "Lawyer"]
Contact Form 7 aforementioned shortcode generates the html select element to something like this:
<select id="cd-dropdown" class="cd-select"> <option value="-1" selected>Professional</option> <option value="1">Nurse</option> <option value="2">Lawyer</option> </select>
However, I’d like to be able to add a different class to each of the <option> tag, as the example below:
<select id="cd-dropdown" class="cd-select"> <option value="" selected>Professional</option> <option value="" class="fa-nurse">Nurse</option> <option value="" class="fa-lawyer">Lawyer</option> </select>
Is it even possible to achieve that by using the CF7 shortcode generator? Are there any workarounds in order to achieve that maybe by making a few changes to plugin’s core files?
Thanks in advance. I’d really appreciate any help regarding this issue.
- The topic ‘How add a class to select element tag in Contact Form 7?’ is closed to new replies.