Skip to main content
added 404 characters in body
Source Link
Marek Musielak
  • 24.2k
  • 3
  • 31
  • 64
  • create a new folder under /sitecore/system/Settings/Forms/Meta Data/CSS Class Options and call it Form

  • add new items for every color you want to use for the background colors under Form folder using /sitecore/templates/System/Forms/Meta Data/CSS Class Option template and for the value field use e.g. form-blue-background, 'form-grey-background`, etc.: enter image description here

  • select /sitecore/system/Settings/Forms/Field Types/Form item and in Css Class Autocomplete Options field select /sitecore/system/Settings/Forms/Meta Data/CSS Class Options/Form folder created earlier: enter image description here

  • now when your content authors start typing first name of the CSS class in CSS Class field of Styling section in Forms Editor, there will be auto-suggested option for all the available styles that you define:

enter image description here

Remember to add proper styling in your CSS files for all the background options.


EDIT

In Sitecore 9.2 there is no option for CSS Class Options metadata, but your content authors can still add any CSS class to the Styling section in Form Editor: enter image description here

There is no way to add auto-suggestion for the classes so you need to inform them about all the possible options for form backgrounds.

  • create a new folder under /sitecore/system/Settings/Forms/Meta Data/CSS Class Options and call it Form

  • add new items for every color you want to use for the background colors under Form folder using /sitecore/templates/System/Forms/Meta Data/CSS Class Option template and for the value field use e.g. form-blue-background, 'form-grey-background`, etc.: enter image description here

  • select /sitecore/system/Settings/Forms/Field Types/Form item and in Css Class Autocomplete Options field select /sitecore/system/Settings/Forms/Meta Data/CSS Class Options/Form folder created earlier: enter image description here

  • now when your content authors start typing first name of the CSS class in CSS Class field of Styling section in Forms Editor, there will be auto-suggested option for all the available styles that you define:

enter image description here

Remember to add proper styling in your CSS files for all the background options.

  • create a new folder under /sitecore/system/Settings/Forms/Meta Data/CSS Class Options and call it Form

  • add new items for every color you want to use for the background colors under Form folder using /sitecore/templates/System/Forms/Meta Data/CSS Class Option template and for the value field use e.g. form-blue-background, 'form-grey-background`, etc.: enter image description here

  • select /sitecore/system/Settings/Forms/Field Types/Form item and in Css Class Autocomplete Options field select /sitecore/system/Settings/Forms/Meta Data/CSS Class Options/Form folder created earlier: enter image description here

  • now when your content authors start typing first name of the CSS class in CSS Class field of Styling section in Forms Editor, there will be auto-suggested option for all the available styles that you define:

enter image description here

Remember to add proper styling in your CSS files for all the background options.


EDIT

In Sitecore 9.2 there is no option for CSS Class Options metadata, but your content authors can still add any CSS class to the Styling section in Form Editor: enter image description here

There is no way to add auto-suggestion for the classes so you need to inform them about all the possible options for form backgrounds.

Source Link
Marek Musielak
  • 24.2k
  • 3
  • 31
  • 64

  • create a new folder under /sitecore/system/Settings/Forms/Meta Data/CSS Class Options and call it Form

  • add new items for every color you want to use for the background colors under Form folder using /sitecore/templates/System/Forms/Meta Data/CSS Class Option template and for the value field use e.g. form-blue-background, 'form-grey-background`, etc.: enter image description here

  • select /sitecore/system/Settings/Forms/Field Types/Form item and in Css Class Autocomplete Options field select /sitecore/system/Settings/Forms/Meta Data/CSS Class Options/Form folder created earlier: enter image description here

  • now when your content authors start typing first name of the CSS class in CSS Class field of Styling section in Forms Editor, there will be auto-suggested option for all the available styles that you define:

enter image description here

Remember to add proper styling in your CSS files for all the background options.