Accessing the tables feature

By Tables

The Tables feature in Mail Designer 365 offers you a practical way to summarize and organize important information for your readers within your email design.

To add a table to your email design, go to the “Contents” menu and click on the “Layout blocks” tab. Then, scroll down to the tables section:

Drag and drop the table block of your choice into your design area:

Now you can get ready to start building your table in the next step…

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text

Building your table layout

By Tables

The Tables feature offers you a lot of flexibility when it comes to configuring your table and its contents.

Configuring your table layout

To get started, you can determine how many rows and columns you want to include in your table. Don’t worry if you change your mind later on – you can adjust this at any time.

Click on the table. This will open the “Style” menu. Under “Structure”, you can increase/decrease the number of rows and columns using the arrows. You can also use the selection tools to manually select (cmd + click) a cell in your table and insert a row or column above or below.

To delete a row or column, select (cmd + click) the cells and click on the delete button in the “Structure” menu.

To activate different features in your table (e.g. headers, footers), you can check the tick boxes next to each feature:

Resizing your table

You can easily adjust the dimensions of your table by using the control panel. Click on your table and go to “Dimensions” under the “Style” menu. Next to each field (e.g. Table Width) you can enter a precise value, or manually adjust the dimensions using the arrow controls:

Click on the “Uniform” button to make all columns/rows equal in width/height.

To change the dimensions of an individual cell within your table, click on the cell and use the controls as instructed above.

Once you’re happy with the layout of your table, you can now go on to edit the style in the next step.

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text

Changing the color of your table

By Tables

Mail Designer 365 was designed for creatives. For this reason, we want to give you as much flexibility as possible when it comes to designing your tables. You can choose from a huge range of creative color options for your table.

Choosing the colors for your table

You can make your tables as bright and colorful as you want. Using colors is great for tables as it helps make the data stand out even more. To get started, click on the table and head to the “Style” menu. Here you will find the “Colors” section:

To start coloring your table, select which area you want to color from the dropdown menu:

Then, choose a color from the color wheel:

You can choose whether to alternate the row color by checking the box next to “Alternating Row Color.” Alternating helps readers to distinguish row contents from each other. As in the previous step, you can choose the alternate color from the color wheel.

Tip: You can also switch which way you alternate by using the switcher button.

To change the color of a singular cell (e.g. to highlight its importance), click on the cell and make sure “Current Cell” is selected in the dropdown menu.

More style options for your table are available in the next step…

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text

Adding borders to your table

By Tables

Another design option for your table is adding borders. To get to the borders panel, click on your table and go to “Borders” in the “Style” menu:

Under the dropdown menu, you can choose the area of your table where you want to add a border. To add a border to your entire table, select “Table Body”:

You can now choose a border style from the dropdown list. Adjust the thickness accordingly by using the arrows or by manually adding a pixel value.

If you wish, you can change the color of your border using the color wheel.

Use the control panel to apply style changes to a particular area of your table:

If you want to add a border to just one cell, click on this cell and make sure “Current Cell” is selected. Now you can adjust the border like in the previous step.

Find out how to add content to your tables in the next step…

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text

Adding content to your tables

By Tables

Just like regular Mail Designer 365 layout blocks, table blocks distinguish between raw text and images. You can choose to make your table cells image blocks, text blocks, or a combination of both.

Image block cells are characterised by the image icon. To change the format of a cell from image to text (or vice versa), click on the cell and go to “Cell Content Type.”

Here you can change the content type of a cell by clicking on the respective icons. The text and image blocks work exactly the same in tables as they do with regular layout blocks.

If you want to change the cell content type of an entire row, or the entire table, simply select this from the dropdown list:

 

How Can We Help?

A Quick Tour of Mail Designer 365
Advanced Design Techniques
Appendix: Compatibility
Appendix: Keyboard Shortcuts
Approval
Background
Blend Modes
Creative Tools
Exporting a Design to Campaign Monitor
Exporting a Design to Mailchimp
Graphics and Other Objects
HTML Export
Image Areas
Images
Layout Blocks
Optimizing your Template for Mobile
Plain Text
Preparing your Design for Sending
Preview your Design
Send via Mail Designer 365
Sharing your Designs
Tables
Teamwork
Text Styles
The Inbox View
Using Retina Images with your Design
Working with Links and Buttons
Working with Text