This shows you the differences between two versions of the page.
Both sides previous revision Previous revision | |||
en:template:rich_text_field [2017/09/06 10:13] Nicolas Ronvel [Rich Text fields] |
en:template:rich_text_field [2017/09/14 11:32] (current) Nicolas Ronvel [Snippets] |
||
---|---|---|---|
Line 31: | Line 31: | ||
The ''value'' is the string that will be inserted in the Rich Text Field when the button is clicked. It can be HTML value, such as ''<em>This is Italic text</em> <strong>This is bold text</strong> This is standard text''. | The ''value'' is the string that will be inserted in the Rich Text Field when the button is clicked. It can be HTML value, such as ''<em>This is Italic text</em> <strong>This is bold text</strong> This is standard text''. | ||
+ | |||
+ | ===== Colors ====== | ||
+ | |||
+ | Since completion of [[https://github.com/Gulix/geckos/issues/194|Issue #194]], the Rich Text Field can have text in different colors. You can let the user choose any RGB color for his text, or limit the experience to a pre-defined list of colors. | ||
+ | |||
+ | To add text color to a Rich Text Field, follow this code : | ||
+ | |||
+ | <code javascript> | ||
+ | "fields": [ | ||
+ | { | ||
+ | "name": "details", | ||
+ | "label": "Détails", | ||
+ | "type": "richtext", | ||
+ | "colored": true, | ||
+ | "colors": [ "red", "#FF5566", "rgb(127, 18, 255)" ] | ||
+ | } | ||
+ | ] | ||
+ | </code> | ||
+ | |||
+ | To activate the display of the color button, you just have to add the property ''colored'' with a ''true'' value. The user will be then able to set any color to the text. | ||
+ | |||
+ | If you want to limit the available colors, you need to add the ''colors'' array, with a list of string that matches the colors you want. You can add any HTML colors in the format you want, like in the example. See the [[http://bgrins.github.io/TinyColor/|TinyColor demo]] to try out the various formats. | ||
===== Using the variables ===== | ===== Using the variables ===== | ||