Skip to main content

Email Buttons with Different Links in Mail Designer 365

You are here:

Email buttons with different links

Email buttons with different links let recipients choose the action that matches their intent—for example, opening separate product pages, social profiles, event registrations, or support resources. In Mail Designer 365, the important rule is that one image area can have one destination link. To create several independently clickable graphic buttons, place each button in its own image area.

This guide shows how to choose the correct layout block, assign a unique URL to every button, and test the finished email so each call to action opens the expected page.

Email buttons with different links require separate image areas

Remember, one image area only allows you to add one link. Even though you can have different graphic elements within one image area, the entire image area will only link to a single destination. When you send your email templates, an image area with different elements will be rendered as a single image. This is why  you can only add one link within one image area.

Multiple image areas

In order to add different buttons with different links, you need to use a layout blocks with multiple image areas. Within Mail Designer 365, you have multiple choices of different layout blocks with multiple image areas.

Layout block choices with multiple image areas

You can choose which layout you want. Within each image area, you can add a single link. Therefore, you have the freedom to add a button with a unique link within each image area. The different image areas will be rendered as their own individual images.

Adding buttons with different links

In this example, we are using a layout block with 4 image areas:

Four-area layout block for independent email buttons

Four separate image areas in Mail Designer 365

Then, we are adding a unique icon as buttons within each image area:

Unique button icons placed in separate image areas

Afterwards, we are adding a different link within each image area. For the Facebook icon, we will add a link to the Facebook page:

Assigning the Facebook button destination link

On the second image area, we will add a Pinterest icon. Then, we will add a link to the Pinterest page:

Assigning the Pinterest button destination link

For the third image area, we will place a Twitter icon. Then, we will add a link to the Twitter page:

Assigning the Twitter button destination link

On the fourth image area, we will add the Instagram icon. Afterwards, we will add a link to the Instagram, page:

Assigning the Instagram button destination link

 

When the email template is rendered, the four different image areas will become four different images with their individual links.

Correct vs. Incorrect:

Correct setup with four linked image areas

Correct because: 4 different icons in 4 different image areas. You can add 1 link per 1 image area. Therefore, you can add 4 different links total.

 

 

Incorrect setup with four icons in one image area

Incorrect because: 4 different icons in 1 image area. You can only add 1 link per 1 image area. Therefore, 4 icons will only lead to 1 landing page.

 

 

Plan and test multiple button destinations

Before building the row, list each button label and its final destination URL. Clear labels help recipients understand the result of a click, while distinct destinations make campaign reporting easier to interpret. Use a layout block with enough separate image areas for the number of graphic buttons you need. If the row contains four social icons, for example, choose a block with four individual areas rather than placing every icon inside one large image area.

After adding the graphics, select the first image area and assign its URL. Repeat the process for every remaining area. Check that secure HTTPS links are complete and that no destination was copied to the wrong button. When appropriate, use descriptive link titles and keep the visual treatment consistent across the set.

Accessibility and mobile checks

Add meaningful alt text to each button image so its purpose remains understandable if images are blocked. Avoid relying on the icon alone when the action may be ambiguous. In the mobile version, confirm that every button remains large enough to tap and that spacing prevents accidental clicks on the neighboring destination.

  • Preview the desktop and mobile layouts.
  • Click every button in preview or in a test email.
  • Confirm that each destination loads without an error or redirect surprise.
  • Check that button order matches the surrounding copy.
  • Send the test to at least one real inbox before the campaign launch.

If you need one graphic to contain several clickable regions, separate it into individual image areas instead. You can also review the guide to multiple links on an image background for related layout choices. This structure ensures that email buttons with different links remain independently clickable after the design is rendered for sending.

Privacy Settings / Datenschutz-Einstellungen