How to automate the layout of emails with the same type of elements: we use smart objects





Layout is one of the most time-consuming stages of preparing an email newsletter. Often in letters you need to include a large number of similar blocks, for example, images with descriptions (relevant for online stores with product cards). Such actions take a lot of time and effort.



DashaMail has a tool for automating such routine tasks. These are the smart objects of a block editor. We will tell you how they work.



What are smart objects



Typically, when typesetting a letter, its elements need to be set up every time from scratch. Even if you created a structure and copy it every time, the content in it constantly has to be updated manually: replacing pictures, description, links, etc. With a large number of objects, layout becomes time-consuming.



A smart object is a letter element that contains the blocks you need (picture, text, button, etc.), which can receive data through variables from external sources. That is, in the case of smart objects, you need to configure integration with an external site once, and then you can insert objects into letters in a couple of clicks - and they will already be made up.



For everything to work this way, you must provide a link to the desired page on an external site - for example, it can be a product in an online store. Then the system will automatically load the necessary data and apply it in the specified places of the letter.







How it works



To use a smart object, you need to create its structure with the necessary blocks - for example, one picture, two blocks of text and a button. After that, you need to configure the rules according to which the system will load data into the object. This is implemented using variables.







Rules are configured through a common mechanism for finding elements in HTML, CSS selectors and attributes. That is, if we need to make sure that the smart object contains links to the site by clicking on the Buy button and the product picture, we need to write a rule that sets the variable value for all values ​​of β€œa” (CSS selector field) into the attribute ' href '(Attribute field):



An important point: the system can work with dynamic sites based on JavaScript.







Another interesting point: you can apply a roll-over effect to smart objects (when you hover over the picture, it will change). Thus, it is possible to show, for example, any product at once from two sides, and all this right in the letter.







Smart objects support adaptive layout. The technology works flexibly: you can configure parameters like fonts and text alignment on various devices, as well as display / hide content in different environments. For example, some elements can only be shown to desktop users, while others can be shown to those who view the letter from a smartphone.







What is the use of smart objects



The most obvious use of smart object technology in email newsletters is the e-commerce industry. The companies here have many products that you can talk about directly in the letters.



This tool is also useful for content projects: in letters you can beautifully make up announcements and previews of articles. In general, smart objects can be useful to any company that needs to immediately get information about a large number of goods, services or any offers.



The time that needs to be spent on layout increases with the number of elements of the same type. Everything is logical. Accordingly, the proposed solution is most effective for letters with a large number of similar objects.



For example, as our tests showed, the full cycle of layout of the mailing list, with its testing and sending, when using a template with 12 product cards does not exceed 20 minutes. Without smart objects, manual coding of a similar letter takes at least an hour.



It is also important that since automation seriously reduces manual labor, the likelihood of errors in the layout of elements of the same type is also reduced (β€œI copied the element and forgot to replace the link on the button”). As a result, the quality of newsletters is growing, which means their effectiveness.



To keep abreast of current trends in email marketing in Russia, to receive useful life hacks and our materials - subscribe to the DashaMail Facebook page and read our blog .



All Articles