Electronic mail Message Patterns are a very good strategy to view messages despatched via your Divi Contact Forms. You will have complete keep watch over over the format design and content material, so that you get the precise data you need in the best way you need it. On this put up, we’ll see the way to create a Message Trend to your Divi Touch Shape Module and give an explanation for the way to use it.

What’s a Message Trend?

The Message Trend is a template for the e-mail message. It specifies how the message seems and what data it comprises while you obtain it in electronic mail. It may come with textual content that you simply specify and the content material of any of the fields within the shape. The Message Trend isn’t required, however it’s useful. Merely depart it clean for the default trend.

Why Use a Message Trend?

Using a message trend is a good way to streamline your workflow. You’ll have the precise data you need within the format you need.

The place to To find the Electronic mail Message Trend

To seek out the e-mail Message Trend box, open the Touch shape Module by means of clicking the darkish grey equipment icon that looks on hover. For this situation, I’m the usage of the Touch web page from the free Home Baker Layout Pack that’s to be had inside Divi.

Subsequent, scroll all the way down to the phase classified Electronic mail. Right here, you’ll to find two fields. The primary is Electronic mail Deal with. That is the cope with of the message that shall be despatched. The second one box is named Message Trend. Input your trend into this box.

When a message is distributed to the e-mail cope with that you simply’ve imputed into the Electronic mail Deal with box, it in most cases comprises most effective the content material within the Message box. As an example, I’ll ship this message:

The result’s an electronic mail with who it’s from, as customary, however the frame of the content material most effective displays the message itself.

The right way to Create a Message Trend

We will regulate the content material of the e-mail by means of making a Message Trend. You’ll be able to upload textual content and specify the fields you need to incorporate. To incorporate a box, upload two p.c symbols to all sides of the sphere’s ID. As an example, to incorporate the sphere with the ID-name, use %%call%%. We’ll see the way to to find the Box ID within the subsequent phase.

You’ll be able to create a template with textual content, areas, and the shape content material. Upload your textual content across the box names and come with areas for the fields. As an example, I’m %%call%% and my message is %%message%%.

After I upload this Message Trend to the instance from above, we get a special electronic mail. This trend comprises textual content, box IDs, and further areas.

Here’s the message from %%call%%, electronic mail %%electronic mail%%.

Message: %%message%%

The result’s an electronic mail with additional info and a format that makes extra sense. It’s the similar data that was once submitted within the shape within the phase above, however now it displays extra of the ideas and puts it in a format that’s simple to learn, which is the format I created with the Message Trend.

The right way to Upload New Fields

Each and every box within the Touch Shape Module is a submodule with its personal settings. To create a brand new box, move to the Touch Shape Module’s content material tab and click on Upload New Box underneath all of the shape’s submodules.

Textual content

Underneath Textual content, input the Box ID and the Name. The Box ID is the label you’ll use to create the Message Trend. This can be a distinctive ID and will have to most effective use English characters without a particular characters or areas. The Name box can be utilized to outline the content material. It doesn’t need to be a singular identify or fit the Box ID, however it’s best if it’s distinctive to enable you to perceive.

Subsequent, scroll all the way down to choices and choose the Box Sort. Select any settings you need for the sphere. Click on the inexperienced take a look at on the backside or go back arrow on the most sensible to go back to the common Touch Shape Module settings.

After all, upload the brand new box to the Message Trend with any textual content you need to incorporate. Shut the module and save your settings.

The right way to Check the Message Trend

After all, take a look at your Message Trend to make sure it really works how you need. Merely fill out the shape your self and move to the e-mail cope with you used for the e-mail box to view the Message Trend.

You’ll obtain the message to your electronic mail inbox so you’ll know should you just like the design or now not.

Making a Smartly-Designed Message Trend

The Message Trend will have to be built in some way that you simply get probably the most out of it. That is to your use, so design it the best way you want to peer it.

You’ll want to use whitespace to make the e-mail more straightforward to learn and use. The Message Trend comprises all areas that you simply upload to the trend. You’ll be able to use areas to create the precise format you need.

Eating place Reservation Message Trend Instance

Let’s see an instance of a Message Trend for a cafe reservation. For this situation, I’m the usage of the touchdown web page from the free Poke Restaurant Layout Pack that’s to be had inside Divi. I’ll substitute the reservation button with a brand new Touch Shape Module. We’ll stay the shape easy for this situation.

Right here’s how the format seems earlier than including the Touch Shape Module.

Trade the Name Textual content

First, edit the Name Textual content to turn “Make a Reservation.” Spotlight the portion of textual content you don’t need and click on the Delete key.

Delete Row

Subsequent, delete the Row with the buttons. We’ll use the way of the left button, however we don’t want those buttons.

Upload a Touch Shape Module

Subsequent, upload a Touch Shape Module underneath the telephone quantity Textual content Module.

Upload New Fields

Now, take away the Message Box and upload a brand new Box by means of clicking Upload New Box.

Trade the Box ID to Telephone, the Name to Telephone Quantity, and use Enter Box because the Sort. For Allowed Symbols, choose Numbers Handiest. Shut the submodule.

• Box ID: Telephone
• Name: Telephone Quantity
• Sort: Enter Box
• Allowed Symbols: Numbers Handiest

Upload some other Box, trade the Box ID to Visitors, the Name to Collection of Visitors, and use Enter Box because the Sort. For Allowed Symbols, choose Numbers Handiest. Shut the submodule.

• Box ID: Visitors
• Name: Collection of Visitors
• Sort: Enter Box
• Allowed Symbols: Numbers Handiest

Upload some other Box and alter the Box ID to Day, the Name to Day of Talk over with, and use Choose Dropdown because the Sort. Input the call of on a daily basis for the choices. Shut the submodule.

• Box ID: Day
• Name: Day of Talk over with
• Sort: Choose Dropdown
• Choices: upload days

Upload some other Box and alter the Box ID to Time and the Name to Time of Talk over with. Choose Radio Buttons for the Sort. For the Choices, upload the imaginable occasions. Shut the submodule.

• Box ID: Time
• Name: Time of Talk over with
• Sort: Radio Buttons
• Choices: imaginable occasions

Textual content

Now, we’ll regulate the shape. Underneath Textual content within the Content material tab, trade the Post Button textual content to E-book a Desk.

• Post Button: E-book a Desk

Electronic mail

Subsequent, scroll all the way down to Electronic mail and input the cope with the place you need to obtain the e-mail within the Electronic mail Deal with box. Additionally, create the Message Trend. I’ll create a trend that gives the call first, skip a line, after which display the day, time, and collection of visitors. After this, it’s going to skip a line, display a heading for the touch data after which listing the ideas.

The Message Trend looks as if this (whole with areas):

Reservation for %%call%%

 

Day: %%day%%

Time: %%time%%

Collection of Visitors: %%visitors%%

 

Touch Knowledge

%%electronic mail%%

%%telephone%%

Junk mail Coverage

Scroll all the way down to Junk mail Coverage and disable it.

• Use Elementary Captcha: No

Fields

Now, let’s taste the module. First, move to Fields within the Design tab. Trade the Background colour to rgba(255,255,255,0) and the Textual content Colour to black.

• Background Colour: rgba(255,255,255,0)
• Textual content Colour: #000000

For the Fields Padding, upload 13px for the Best and Backside and 30px to the Left and Proper. Trade the Font to Darker Gruesome and set the Weight to Medium.

• Fields Padding: 13px Best and Backside, 30px Left and Proper
• Font: Darker Gruesome
• Weight: Medium

Trade the Dimension to 24px for desktops, 18px for pills, and 14px for telephones. Set the Line Top to at least one.4em.

• Dimension: 24px desktop, 18px pill, 14px telephone
• Line Top: 1.4em

Button

Subsequent, scroll all the way down to Button and choose Allow Customized Types for Button. Trade the Textual content Dimension to 17px, the Textual content Colour to black, and the Background to #f6c85d.

• Allow Customized Types for Button
• Textual content Dimension: 17px
• Textual content Colour: #000000
• Background: #f6c85d

Set the Border Colour to #f6c85d and the Button Letter Spacing to 0.16em. Trade the Font to Darker Gruesome, the Weight to Extremely Daring, and the Taste to TT.

• Border Colour: #f6c85d
• Button Letter Spacing: 0.16em
• Font: Darker Gruesome
• Weight: Extremely Daring
• Taste: TT

Trade the Button Padding to 12px for the Best and Backside and 20px for the Left and Proper.

• Button Padding: 12px Best and Backside, 20px Left and Proper

Sizing

Subsequent, scroll all the way down to Sizing, trade the Width to 60%, and set the Module Alignment to Heart.

• Width: 60%
• Module Alignment: Heart

Border

After all, scroll all the way down to Border. Upload 5px to the Rounded Corners, 2px to the Border Width, and make the Border black. Shut the module, save your settings, and take a look at your shape.

• Inputs Rounded Corners: 5px
• Border Width: 2px
• Colour: #000000

Message Trend Effects

Right here’s how our message seems within the shape and within the electronic mail that I won.

Message within the Shape

Message within the Electronic mail

Finishing Ideas

That’s our take a look at the way to create a message trend to your Divi Touch Shape Module. Developing Message Patterns is straightforward to do with Divi’s Touch Shape Module, they usually’re nice for organizing the ideas throughout the emails themselves. Following a couple of easy steps is all you want to create your individual electronic mail Message Patterns.

We wish to listen from you. Have you ever created a message trend to your Divi Touch Shape Module? Tell us about your revel in within the feedback.

The put up How to Create a Message Pattern in Your Divi Contact Form Module seemed first on Elegant Themes Blog.

WordPress Maintenance Plans | WordPress Hosting

read more