Odoo's Mergebot
6c63addd18
This brings a series of improvements to the mechanism in place to convert the output html of mass mailing into html that is more compliant with the main mail clients' requirements.
The biggest change is the automatic conversion of Bootstrap grids into table structures. Currently all templates in `mass_mailing` are designed with tables so they work in mailings as is. That has limitations though as it makes it less easy to edit with snippets such as those used in the website builder. This new automatic conversion from Bootstrap grid will allow us to adapt the mailing and snippet templates and be more free within `mass_mailing`.
Note: Because of the limited support of media queries in emails, this doesn't support the mixing and matching of column options (e.g., `"col-4 col-sm-6"` and `"col col-4"` aren't supported).
Other changes include:
- The conversion of Bootstrap cards to table structures
- The conversion of Bootstrap list-groups to table structures
- The conversion of snippets (.o_mail_snippet_general) and mailings
(.o_layout) into table structures
- The conversion of all rgb colors to hexadecimal
- The conversion of all "rem" sizes to "px"
- Various small corrections to the output styles
The new automatic conversion from Bootstrap grid to tables allows us to convert `mass_mailing` templates from their old table structures to Bootstrap grid (as the reverse conversion will now be applied on save).
General heuristic for the conversion of templates:
| **Table** | **Bootstrap** |
|:-------------------:|:------------------------------------------:|
| `<table>` | `<div class="container">` |
| `<thead>` | _(removed)_ |
| `<tbody>` | _(removed)_ |
| `<tfoot>` | _(removed)_ |
| `<tr>` | `<div class="row">` |
| `<th>` | `<div class="col o_col_head">` |
| `<td>` | `<div class="col">` |
| `<td width="_n_%">` | `<div class="col-_o_">` where o ~= 12n/100 |
| `cellspacing` | _(removed but always added back to table)_ |
| `cellpadding` | _(removed but always added back to table)_ |
| `border` | _(removed but always added back to table)_ |
Some styles had to be changed to account for the difference in the HTML.
Mailings were limited to 600px width by default. This removes that limit in order to give snippets control over the margins.
The following snippets (and their relevant options) were added to `mass_mailing`, mostly duplicated from the website builder:
- s_cover
- s_title
- s_text_block
- s_comparisons
- s_color_blocks_2
- s_three_columns
- s_image_text
- s_text_image
- s_picture
- s_features
- s_numbers
- s_masonry_block
- s_media_list
- s_showcase
- s_company_team
- s_call_to_action
- s_references
- s_product_list
- s_features_grid
- s_alert
- s_rating
- s_blockquote
- s_hr
- s_text_highlight
The following snippets were removed to make way for the new:
- s_mail_block_banner
- s_mail_block_title_sub
- s_mail_block_paragraph
- s_mail_block_comparison_table
- s_mail_block_two_cols
- s_mail_block_three_cols
- s_mail_block_image_text
- s_mail_block_text_image
- s_mail_block_image
- s_mail_block_footer_separator
- s_mail_block_footer_tag_line
- s_mail_block_steps
The following standalone snippet options were added, mostly duplicated from the website builder:
- Box
- layout_column
- SnippetMove
- snippet_options_text_align (via web_editor)
- snippet_options_width (via web_editor)
- snippet_options_block_align (via web_editor)
- BodyWidth (based on ContainerWidth but only for the mailing's body)
- minHeight
- so_snippet_addition
- so_content_addition
- sizing_x
- vAlignment
Styles and selectors were adapted to the specifics of `mass_mailing`.
`mass_mailing_table_item` was charged with ensuring proper cloning and removing of table elements precisely because `mass_mailing` relied so heavily on them. Since it doesn't anymore, there is no need for that option. This removes it.
Prior to this PR, it was possible to drop snippets out of the confines of the mailing's body and into its editable parent instead. This makes that impossible.
The feature to drop snippets to the nearest allowed position was broken in iframes because of a reference to a JQuery contained in a different document than the editable area. This restores the feature in all cases.
`we-button`s, `we-toggler`s and `we-select-items` with no text content don't properly take up their full height in iframes. This solves that issue by ensuring a text content at all time, albeit an invisible one. This is a bit of hacky solution perhaps but one that consistently works across browsers.
Transparency is not supported in several leading mail clients. This adds the option to completely remove transparent colors from the palette, and uses that option in `mass_mailing`.
A new, empty template to `mass_mailing` was created, in which snippets can be dropped, to start an HTML mailing from scratch.
A default background color is applied to all HTML mailings in order to emphasize the separation between the mailing itself and its body.
A series of CSS styles were added to the `<head>` of mailings in order to ensure better mail client compatibility.
task-2554899
Enterprise PR: https://github.com/odoo/enterprise/pull/21215
--
I confirm I have signed the CLA and read the PR guidelines at www.odoo.com/submit-pr
closes odoo/odoo#77724
Forward-port-of: odoo/odoo#77312 and odoo/odoo#77634 and odoo/odoo##77592
Related: odoo/enterprise#21400
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
Odoo
Odoo is a suite of web based open source business apps.
The main Odoo Apps include an Open Source CRM, Website Builder, eCommerce, Warehouse Management, Project Management, Billing & Accounting, Point of Sale, Human Resources, Marketing, Manufacturing, ...
Odoo Apps can be used as stand-alone applications, but they also integrate seamlessly so you get a full-featured Open Source ERP when you install several Apps.
Getting started with Odoo
For a standard installation please follow the Setup instructions from the documentation.
To learn the software, we recommend the Odoo eLearning, or Scale-up, the business game. Developers can start with the developer tutorials