This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
| en:otml [2023/03/17 17:37] – [Config Tags] fw | en:otml [2025/10/30 16:24] (current) – [Preheader] fw | ||
|---|---|---|---|
| Line 46: | Line 46: | ||
| + | |||
| + | ==== Editable Title ==== | ||
| + | |||
| + | If you want the user to be able to edit the title of the mail, add the attribute '' | ||
| + | |||
| + | === Example === | ||
| + | |||
| + | <code html> | ||
| + | < | ||
| + | < | ||
| + | < | ||
| + | <title editable=" | ||
| + | </ | ||
| + | < | ||
| + | <div> | ||
| + | <a href=" | ||
| + | Please click here if you can't read this E-Mail. | ||
| + | </a> | ||
| + | </ | ||
| + | ... | ||
| + | </ | ||
| Line 173: | Line 194: | ||
| < | < | ||
| </ | </ | ||
| - | |||
| Line 503: | Line 523: | ||
| ^ Attribute | ^ Attribute | ||
| | name | Yes | string | | name | Yes | string | ||
| - | | refreshmode | Yes | string | + | | refreshmode | Yes | string |
| Line 510: | Line 530: | ||
| ^ Value ^ Description | ^ Value ^ Description | ||
| | build | Refresh data source on build of the e-mail. | | build | Refresh data source on build of the e-mail. | ||
| - | | refresh | + | | delivery |
| Line 766: | Line 786: | ||
| ==== Automatic transformation from CSS to inline CSS ==== | ==== Automatic transformation from CSS to inline CSS ==== | ||
| - | CSS from '' | + | CSS from a <style> |
| - | Also, the CSS inlining only works on HTML elements with one selector. | + | For more details on the matter refer to the **cssinline** and **cssinlinetype** options in [[en:otml#config_tags]] |
| - | + | ||
| - | + | ||
| - | === Example === | + | |
| - | + | ||
| - | <code html> | + | |
| - | < | + | |
| - | < | + | |
| - | /******************* | + | |
| - | * Working examples * | + | |
| - | *******************/ | + | |
| - | + | ||
| - | .foo { | + | |
| - | font-size: | + | |
| - | line-height: | + | |
| - | } | + | |
| - | + | ||
| - | .bar { | + | |
| - | background-color: #fff; | + | |
| - | } | + | |
| - | + | ||
| - | img { | + | |
| - | border: 0; | + | |
| - | } | + | |
| - | + | ||
| - | + | ||
| - | / | + | |
| - | * Non-working examples * | + | |
| - | ************************/ | + | |
| - | + | ||
| - | .baz, .boz { | + | |
| - | font-size: | + | |
| - | } | + | |
| - | + | ||
| - | table td { | + | |
| - | background-color: | + | |
| - | } | + | |
| - | </ | + | |
| - | </ | + | |
| - | < | + | |
| - | / | + | |
| - | * Working examples * | + | |
| - | *******************/ | + | |
| - | < | + | |
| - | < | + | |
| - | <td class=" | + | |
| - | < | + | |
| - | </ | + | |
| - | </ | + | |
| - | < | + | |
| - | <img alt="" | + | |
| - | </ | + | |
| - | </ | + | |
| - | + | ||
| - | + | ||
| - | / | + | |
| - | * Non-working examples * | + | |
| - | ************************/ | + | |
| - | < | + | |
| - | < | + | |
| - | <td class=" | + | |
| - | Lorem ipsum dolor sit amet | + | |
| - | </ | + | |
| - | </ | + | |
| - | </ | + | |
| - | </ | + | |
| - | </ | + | |
| ==== User editable CSS ==== | ==== User editable CSS ==== | ||
| Line 942: | Line 895: | ||
| ^ Attribute | ^ Attribute | ||
| | cssinline | | cssinline | ||
| - | | cssinlinetype | string | + | | cssinlinetype | string |
| | storage | | storage | ||
| | ignoreerror | | ignoreerror | ||
| Line 961: | Line 914: | ||
| ^ Value ^ Description | ^ Value ^ Description | ||
| - | | legacy | + | | default |
| - | | ng | Use the new CSS inliner. | + | | ng | Use the new, improved |
| The **default** CSS Inliner can only transform CSS for single, non-comma-separated selectors. | The **default** CSS Inliner can only transform CSS for single, non-comma-separated selectors. | ||
| - | The **ng** CSS Inliner does not underlie those restrictions and can inline CSS blocks with comma-separated selectors. | + | The **ng** |
| == Examples for the default CSS Inliner == | == Examples for the default CSS Inliner == | ||