This article explains how to use the Rows tab in the drag and drop editor to create and edit rows.

Emma’s drag and drop* editor is governed by the three main functions found under the tabs for Content, Rows, and Settings. While working on a campaign draft, the editor tools are located in the panel on the right. When you click on the Rows tab, you’ll see the different column arrangements that are available for each row in your campaign.

	In This Article
	Rows Overview Adding Rows Arranging Rows Adding, Removing, and Resizing Columns Changing Row Styles and Settings Row Background Color Content Area Background Color Row Background Image Borders Layout / Mobile Behavior Cards Style Columns Structure Additional Resources

Rows Overview

In the drag and drop* editor, campaigns are made up of rows, which have their own properties. Each row contains between 1 and 6 columns, which can be adjusted while creating a campaign. You can make an entire campaign out of one row or you can use several rows. If you use multiple rows, your rows can have different numbers of columns. There are many ways to combine rows and columns to customize your campaign.

Rows can be added, removed, copied, and moved. You can also adjust their settings at any time, so you're not locked in to an arrangement.

☑	Tip
	Teams and Corporate parent accounts can use the saved rows tool in the Brand Manager to save and reuse rows.

Adding Rows

To add a row to your campaign, follow these steps:

1. Navigate to your Campaigns tab.
2. Open a saved drag and drop draft or click on the Create new campaign button to create a new campaign from scratch.
3. Click on the Rows tab in the right panel.
4. Scroll through the list of row options. Each option in the list has a different arrangement of columns. Find one that you like and drag it over to your mailing.
5. As you drag the row over to your campaign, you will see a blue highlight appear labeled "Drag it here". This highlight indicates where the row will appear in the campaign when you drop it and will follow your cursor as you move it.
6. Once you release the row, it will appear in the place you designated.

Arranging Rows

When rearranging rows in your mailing, you can add or move them above or below existing rows on the page, but not inside an existing row. If you want to place multiple blocks side-by-side, you'll need to be working in a row with multiple columns. You can also adjust the number of columns in a row, which we will discuss below.

To rearrange existing rows, follow these steps:

1. Click on the row to reveal the blue toolbar options.
2. Click on the four-way arrow icon on the left and drag the row to another location in your mailing.
3. The blue highlight labeled "Drag it here" will appear to indicate where the row will drop.
4. Once you've chosen a new spot for the row, release it and it will snap into place.

To delete a row, click on the trash can icon in the blue toolbar. To duplicate a row, click on the icon with the two squares on it, next to the trash can icon.

Adding, Removing, and Resizing Columns

To add a column to a row, follow these steps:

1. Click on the row to open the Row Properties panel on the right.
2. Scroll down to the "Columns structure" section.
3. To add another column, click on Add new.

Deleting a Column

1. Click on the row to open the Row Properties panel on the right.
2. Scroll down to the "Columns structure" section.
3. Click on the desired column and select Delete.

Resizing a Column

1. Click on the row to open the Row Properties panel on the right.
2. Scroll down to the "Columns structure" section.
3. Click on the dots between the desired column and its neighbor.
4. Drag the dots from side to side until the two columns reach the desired size ratio.

Changing Row Styles and Settings

In the drag and drop* editor, most row settings are controlled by the Row Properties panel on the right. When you click on an existing row, the Row Properties panel will automatically open.

☑	Tip
	When clicking on a row to open the Row Properties panel, it's easy to accidentally click on a content block and open the Content Properties panel instead. To avoid this, try clicking in the blank space to the far left or right of a row when selecting the row itself.

Row Background Color

The first setting in the Row Properties panel is the background color for the row. Changing the background color here will overwrite what is in your Settings tab.

Click on the color swatch to bring up the controls. You’ll see the theme colors as swatch options. If you’d like to choose another color, use the slider to select a color to start from. You can also place your cursor inside the color block and click to select a color. Finally, if desired, you can place your cursor in the field with the hex code and type your own hex code in manually.

Content Area Background Color

This is the background color for the main section of your campaign, where the content is located. While you cannot edit the background color for each content block, you can edit the background color for an entire row and for columns within that row. This means that if you have multiple content blocks within a row or column, they will have the same background colors.

Click on the color swatch to bring up the controls. You’ll see the theme colors as swatch options. If you’d like to choose another color, use the slider to select a color to start from. You can also place your cursor inside the color block and click to select a color. Finally, if desired, you can place your cursor in the field with the hex code and type your own hex code in manually.

Row Background Image

Click on the toggle to enable a row background image and open the background image settings. To select an image from your image library, click on the Choose image button.

Beneath the Choose Image button, you can click on either Content area or Row, depending on whether you want the image to be behind just the content or the entire row.

There is also a "Fit to background" toggle, which will expand the image to fill the entire background, regardless of the image's actual size. When the "Fit to background" toggle is off, there are checkboxes labeled "Repeat" and "Center". The "Repeat" checkbox will create a tile effect so that multiple copies of your image appear and fill in the background area. The "Center" checkbox will center your image.

Borders

Here, you can choose if you'd like to have a border around the row. There are options to choose the style, size, and color of the border. You can also click on the "More options" toggle to choose border settings for each side of the row individually.

Beneath the border settings, you can choose to round the corners of your content area. Use the plus and minus signs to adjust the corners to your liking. You can also click on the "More options" toggle to round each corner individually.

Layout / Mobile Behavior

This section allows you to adjust the padding for a single row's content. Use the plus and minus signs to increase or decrease the amount of padding around the content area or click on the "More options" toggle to adjust each side of the content area individually. This setting only applies to one row at a time.

✎	Note
	Some versions of Outlook may not respect padding settings as expected, potentially affecting the layout's appearance.

 

This section is also where you can turn mobile stacking on and off. Emma typically leaves mobile stacking on by default, but you can turn it off here, if desired. When mobile stacking is on, you can also change the mobile stacking order. Finally, you can choose whether you'd like to hide this row on desktop or mobile.

For more information about mobile stacking, please refer to our How to Turn Mobile Stacking On or Off article.

Cards Style

This section allows you to create space between columns and round the corners of columns within a row. This creates a card-like appearance, enhancing visual hierarchy and making your content blocks stand out.

To change the space between columns, click on the plus or minus sign next to the "Spacing" heading. To adjust the corners of the columns, click on the plus or minus sign under the "Cards rounded corners" heading or click on the "More options" toggle to adjust each corner individually.

⚠	Warning
	Rounded corners may not render correctly in Outlook inboxes, defaulting to square corners.

Columns Structure

This section allows you to add, remove, and resize columns, as described above in the "Adding, Removing, and Resizing Columns" section.

In addition to adding, removing, and resizing columns, you can use this section to adjust the settings for specific columns in the row. To change a column's settings, click on that column in the Columns Structure section. By default, the leftmost column, or Column 1, will be selected when you open the Row Properties panel.

To adjust the column background color, click on the color swatch to bring up the controls. You’ll see the theme colors as swatch options. If you’d like to choose another color, use the slider to select a color to start from. You can also place your cursor inside the color block and click to select a color. Finally, if desired, you can place your cursor in the field with the hex code and type your own hex code in manually.

To adjust the column padding, use the plus and minus signs or click on the "More options" toggle to adjust the padding for each side of the column individually.

You can also choose if you'd like to have a border around the column. There are options to choose the style, size, and color of the border. You can also click on the "More options" toggle to choose border settings for each side of the column individually.

Additional Resources

• Drag and Drop Editor: Frequently Asked Questions
• Drag and Drop Editor: Content Tab
• Drag and Drop Editor: Resource Hub
• Drag and Drop Editor: Settings Tab
• Quick How-To Videos on Using the New Drag and Drop Editor

---

*In April 2022, Emma's legacy editor was replaced with a new drag and drop editor. Accounts that existed prior to this change still have access to the legacy editor through their previously saved templates and campaigns, however new, from-scratch campaigns can only be created in the new drag and drop editor. Accounts that were created after this change only have access to the new drag and drop editor. Please refer to our new editor FAQ article for more information.