Working with menus inside the template editor

Trying to create a flexible menu for the campaign you are working on?

Look no further! We've just introduced a MENU content block that makes it easier than ever to create a text-based navigation menu for your message.

No longer will you have to worry about column constraints, text size, or making sure your padding is just right. Your menu will look perfect on all devices and in all email platforms. You will also be able to create a mobile-optimized menu without duplicating your content. So how does it work? 

Adding a menu

Begin by dragging and dropping a menu content block onto the editor stage. An empty menu block will populate on the editor with a placeholder image.

ezgif.com-video-to-gif__3_.gif

 

Once you have your menu content block, you'll find some settings in the editor sidebar. Some of these options are familiar, while others are specific to this type of content. Let's start by clicking on Add new item.

ezgif-2-4161479b1b4c.gif

Once you begin adding items to your menu, you'll have a couple of options.
Text is what you'll see written in your menu, and you can set the text hyperlink through the URL field.
The text you input into the Title field will populate if you hover over that option on the editor stage.

image.png

You can use different types of URLs in your message, including email, SMS, and click-to-call. For traditional URLs, you can also set the link to open in the same window or in a new tab. 

You can also re-order your menu items by clicking on the icon in the upper left-hand corner of your item settings and dragging it elsewhere.ezgif.com-video-to-gif__4_.gif

Designing your menu

Once your menu items are ready to go, you can use the settings in the editor sidebar to customize your menu. You'll find text options here, and you can even change your menu layout from horizontal to vertical by selecting your preferred option from the dropdown. 

blobid0.png

If your menu uses a horizontal layout, you'll also be able to insert a text character that can be used to divide your menu items. The color of your Separator character will match the text color you set above.

blobid1.png

You can use the items padding option to apply padding to the individual menu items. 

In the block options below, you'll also be able to apply padding that applies to the menu as a content block.

blobid2.png

 

Mobile menus

The mobile menus option allows you to generate a mobile-optimized menu for your message without duplicating any content and using the hide on mobile/desktop option.  

Start by using the toggle button to turn on your Mobile menu. This will expand some new options under content properties.

mceclip0.png

With a mobile menu, an icon will replace the menu content on a mobile device, which creates an expandable and retractable menu. By default, the mobile menu will always render vertically, and any separators that you're using will be disregarded. 

You can use icon size to change how large your menu button will be. You can also choose from a normal (square) or rounded menu button via the icon type dropdown.

The foreground color will apply to the icon details, as well as the text color once your menu icon is expanded. The background color will populate only as the background color of your icon. The background color of your expanded menu will match what you have set as your content background color. 

ezgif.com-video-to-gif__5_.gif

 

To learn more about other features inside the Remarkety template editor contact support@remarkety.com 

 

 

Was this article helpful?
0 out of 0 found this helpful

Comments

0 comments

Please sign in to leave a comment.