Title: CSS Option Types
Last modified: August 20, 2016

---

# CSS Option Types

 *  [grs](https://wordpress.org/support/users/grs/)
 * (@grs)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/css-option-types/)
 * I am using the option tree css option type with a colour picker and everything
   is working. However I might be missing something incredibly simple. Is there 
   a way to add to the dynamic.css without using the CSS option type, or is there
   a way to set a default value on the CSS option type then hide it from an end 
   user?
    I would prefer that a client/end user would not have to deal with setting
   up CSS let alone having to worry about using option IDs from other option types.
 * [http://wordpress.org/extend/plugins/option-tree/](http://wordpress.org/extend/plugins/option-tree/)

Viewing 5 replies - 1 through 5 (of 5 total)

 *  [htvu](https://wordpress.org/support/users/htvu/)
 * (@htvu)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/css-option-types/#post-3313678)
 * If you need set static CSS just add to your style.css. The power of CSS option
   type is combine with other options to generate dynamic CSS. If you just want 
   to prevent user edit any fields you can use CSS to hide that fields.
 *  Thread Starter [grs](https://wordpress.org/support/users/grs/)
 * (@grs)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/css-option-types/#post-3313680)
 * Just to clarify, I am using a colour picker to change a feature colour on the
   site.
    I think by saying default value I may have given the wrong impression.
   What I mean was pre-populate the CSS option type with something like: ` #header,#
   footer{ {{colour_picker}} }  Then hide it so that CSS can’t be edited by an end
   user. It’s a nice feature to have the CSS option type accept IDs, but for the
   general public adding CSS is too complex. Let alone introducing uncommon CSS 
   syntax and trying to find the IDs of other option types. I would rather set it
   all up then have them only worry about using colour pickers. I can achieve what
   I want by using ot_get_option and adding styles in the page header, but this 
   bypasses dynamic.css altogether and in my opinion is pretty messy.
 *  [htvu](https://wordpress.org/support/users/htvu/)
 * (@htvu)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/css-option-types/#post-3313681)
 * Version 2.0.12 added IDs (base on your field id) to wrapper tag of fields so 
   you can easy to hide specific field. In case if you are using old version of 
   OT and made some changes in OT source (so you can’t update to new version of 
   OT) you can use jQuery to hide fields.
 *  Thread Starter [grs](https://wordpress.org/support/users/grs/)
 * (@grs)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/css-option-types/#post-3313796)
 * Thanks for the suggestions, but it didn’t work out in my case. I ended up creating
   a function to output the options to a new css file.
    I would just like to add
   that the IDs are handy for styling elements but not for hiding them. The wrapper
   and label are left in place and only the element is hidden.
 *  [htvu](https://wordpress.org/support/users/htvu/)
 * (@htvu)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/css-option-types/#post-3313801)
 * Maybe you did not get my idea. Following example is my idea:
    – create a CSS 
   option type with ID “**my_dynamic_css**“ – create a ColorPicker option type with
   ID “**my_color**“ – in option page, set “my_dynamic_css”‘s value: **a {color:{{
   my_color}};}** – save changes From now, when you (or your user) change ColorPicker(
   with ID: my_color) OT will re-generate dynamic.css file with new color.
 * But you still worry about CSS option type (with ID: my_dynamic_color) that your
   user can make mistake when modify theme settings (ex: delete “a {color:{{my_color}};}”
   line) ? OK, do following:
    – Open ot-admin.css (in [OT folder]/assets/css/), 
   append this: **#setting_my_dynamic_css {display:none;}** – Boom! general users
   will not see and can not make mistake with your CSS field.
 * Is it clear ?
 * p/s: Above idea will work with OT version 2.0.10+. If you use OT version 2.0.9
   or older you must make a small patch to give fields wrapper an ID (in this case
   you can ask me if you have trouble)

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘CSS Option Types’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/option-tree_363534.svg)
 * [OptionTree](https://wordpress.org/plugins/option-tree/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/option-tree/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/option-tree/)
 * [Active Topics](https://wordpress.org/support/plugin/option-tree/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/option-tree/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/option-tree/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [dynamic CSS](https://wordpress.org/support/topic-tag/dynamic-css/)

 * 5 replies
 * 2 participants
 * Last reply from: [htvu](https://wordpress.org/support/users/htvu/)
 * Last activity: [13 years, 4 months ago](https://wordpress.org/support/topic/css-option-types/#post-3313801)
 * Status: not resolved