Website Pages

Add a table to a rich text module

Last updated: November 20, 2019

Applies to:

Marketing Hub  Professional, Enterprise
Legacy Marketing Hub Basic
HubSpot CMS

Tables can be useful for organizing lists, displaying calendars, or to add a caption under an image. Learn how to add a table to a rich text module on a HubSpot page, blog post, email, or knowledge base article.

Please note: tables aren't supported in the drag and drop email editor.

Add or remove a table

  • Click any rich text module to open the content editor.
  • In the rich text toolbar, click the Insert dropdown menu and hover over Table
  • Select the number of columns and rows for your table on the grid, then click to insert the table into your content.
  • To expand your table's height or width, click and drag the blue corners.
  • Add content to any cell within the table. Images will resize to fit within the cell you've selected. 
  • To adjust the size of a row or column, click and drag the edge.
  • To delete a table from your content, click the table and select Remove.

insert-table

Edit your table

You can modify properties your entire table, or edit specific cell(s) by highlighting them with your cursor. To edit your table:

  • Click the table and select Edit.
  • On the Format tab, you can:
    • Insert a new row or column within a cell. 
    • Delete a row or column selected in your table.
    • Merge two or more cells selected in your table.
    • Split cells that were previously merged.
  • Click the Style tab to edit your table's colors, borders, and spacing. To access all the styling options available for your table, click Advanced.
    1. Click the corresponding color bubble to select a color for the following:
      • Table border: the border around the edge of the entire table.
      • Cell border: the border around the edge of the selected cells.
      • Cell background: the background color of the selected cells.
    2. Cell padding: adjust the spacing around each cell.
    3. Border weight: adjust the width of the table border.
    4. Horizontal alignment: adjust the horizontal alignment of text or content within a selected cell.
    5. Vertical alignment: adjust the vertical alignment of text or content within a selected cell.
    6. Cell width: set an exact width for the selected cells.
    7. Cell height: set an exact height for the selected cells.
    8. Border style: select a style for your table's border (dots, dashes, etc.).
    9. Style: edit the source code for styles applied to your table.

Please note: updating code in the Style field requires a basic understanding of HTML.

table-style

  • Click the Properties tab to edit the table's position on your page.
    • Table width: enter a specific width for your table.
    • Table height: enter a specific width for your table.
    • Table layout: select how your table aligns with other content in your rich text module. 
    • Caption: to add a text field above your table, click to switch the Caption toggle on. Click your mouse in the text field that appears above the table, then type in your caption.

Copy and paste a table from a spreadsheet

You can also copy and paste a table from a spreadsheet into the editor. However, with this method it's possible that extra space might appear within the table rows and columns. To remove that space, review the source code of the editor and ensure that your table's cellpadding and cellspacing attributes are set to 0. 

source-code-cellspacing

/cos-pages-editor/how-can-i-add-a-table-to-my-hubspot-content?hs_ungate__cos_renderer_combine_all_css_disable=true&hsSkipCache=true