You can add ad-hoc HTML tables in Webflow's CMS Rich Text content by using Embed Components in the CMS or by leveraging a third-party table generator that converts tables into a format Webflow supports. Below are several approaches:
1. Use Rich Text with Pre-Styled Tables
- Webflow does not support native tables directly in CMS Rich Text fields.
- Instead, you can create and style tables manually using Grid or Flexbox and then insert them into your CMS Template pages.
2. Use an Embed Component Inside a Rich Text Block
- Add a Rich Text Block to your CMS page.
- Inside the Webflow Designer, allow custom code embeds inside Rich Text by selecting the block and enabling "Custom Code".
- In the CMS Rich Text field, insert an Embed Component and paste the following:
```html Header 1 | Header 2 |
Data 1 | Data 2 |
\`\`\` - This allows you to store and edit custom tables inside the CMS, though it requires basic HTML knowledge.
3. Use a No-Code Table Generator + Rich Text
- Use a table generator such as tablesgenerator.com or Google Docs to create a styled table.
- Copy the generated table HTML and insert it in an Embed Block using method #2.
- Clients won't need to write HTML but will need to update the table outside Webflow before copying it in.
4. Use Third-Party Table Plugins
- Consider using TablePress + Webflow or similar tools that store tables externally but embed them on Webflow via iframe.
- This is useful if the client frequently updates tables and wants a more dynamic approach.
Summary
To add HTML tables in CMS Rich Text, either (1) use Embed Components with manual HTML tables, (2) generate HTML tables using an external tool, or (3) leverage third-party plugins for more dynamic management. Each method has trade-offs depending on client editing ease vs. styling flexibility.