Marketo Office Hours
MOH Marketo Assets - Landing Pages, Emails, and Forms – Best practices and trends!
235 views
Landing Pages
00:49 Glass effect on form
01:07 Elevator" form
01:33 LP is a mirror of the web site
01:45 Sticky banner
01:54 Automatically format normal images into the right shapes
02:42 Advanced carousels on LP
03:13 LP in Hebrew
03:33 Calendars for Events
04:40 Advanced carousels 2 on LP
05:15 3D Effects applied automatically on images
05:51 Sliding or pop-up forms
07:38 Cookie manager on LP
Empty cookies on demand or automatically
Deposit Marketo cookie only after explicit acceptance
09:25 Limit the number of places for events
10:18 Recover and fill UTMs after bounce
11:48 Hide all or part of an LP by password
12:39 Block a video after 30 seconds
13:51 Custom pop-up (Web perso like)
15:00 Reorganization of dynamic modules
Forms
16:10 Different ways to integrate forms and advanced layout
18:00 Controls on fields (e.g. email domains for competitors)
21:00 Advanced data transmission to the Data Layer
21:40 Multi-step form & Pre-filling
23:00 Progressive Profiling adapted to the customer journey
28:43 Auto-filling (Company for example) and Cleaning / filling of data
29:45 Advanced fields controls
30:27 Shortcut to sales
31:33 Preference Center
Hide / Show Data
Personal data, companies, consents and preferences
Right to be forgotten, to information, pause
28:25 Global preference center with map
Emails
35:10 Respect the constraints of the different email clients
36:22 Insert beautiful photos
37:29 Customize emails with Marketo tokens, segmentations, and dynamic behavioral banners
View transcript
Hi, I'm Sylvain Davril from Merlin/Leonard. Today in this Marketo Office Hours we will focus on what are the best landing pages, forms, and emails that you can produce in order to help your visitors convert on your website. My objective here is to give you some ideas of what is possible in Marketo, and you will see everything is possible in Marketo. So maybe you can step up your game for next year. We start now. So let's start first with some examples of landing pages. Here I'm on the website of this customer, Coffreo. It's a nice website with some design elements. We created this landing page exactly mirroring the website with the design elements and with this form which has a glass effect. It's a bit transparent, you see? That perfectly matches the website. That was the business needs here. And obviously, all the fonts and colours are exactly the ones we have on the website. Here on Kaspersky, we have this website here. So the demand here was to again mimic the website. And this is this kind of landing pages we have. The first demand here was this sticky banner. You see that it stays on top when we move down the page. The second demand was to be able to help marketing import the images and to render the images with those hexagons. We import normal images and they're automatically re-dimensioned thanks to this, if we go to this landing page here. This is a normal image that has been imported with either a square or rectangle format. And thanks to a little app we created, it's automatically changed to the form of the hexagon here. You see some other examples. Again we have this carousel where we import those images and they automatically stick within this little form here. So marketing doesn't have to go to Photoshop and spend some time creating advanced images, just drag and drop your normal images and Marketo will do the rest. So this is a nice effect. Just for you to know, we can create landing pages in Hebrew or in Arabic, where the reading will be from the right to the left. That was one of the demands. Here it's always the same template but for the events this time. They wanted a nice effect for the calendar, for the events, with the picture of the person who will talk during the event. That's a parameter that you can activate or deactivate. Here again, some carousels with zoom effects and the special picture with the hexagon. Here it's a simple page with a video. Here again is the agenda but without the pictures this time. And the pictures here are within the halo. And on this one, the demand was to have a special carousel. So like this one where the demand was to either put a video, an image, a text, or a mix of the three, and I want to be able to change that within Marketo. So that's the most flexible way we thought about that. Give marketing the power to change and put whatever they want in the carousel. This one requires quite a bit of JavaScript in the landing page to work. Here again another demand. We don't want to go into Photoshop to create this image. We want to import flat images and we want you to render the 3D effect dynamically into Marketo, which is something we can do. So import a normal flat image and you will have the 3D effect automatically. That's also nice. Another example at CrossKnowledge here. We have this window hub where we have all the windows. Here we are on the website and if I click on either of those links, I will arrive on these pages with a very nice touch, full of colour. That's a graphic charter I love. These are pages where we can register on the webinar with the speaker. And if I click on Register, I will have this sliding form here that will arrive on the right. We could have a pop-up form, we could have a sliding form. We could also have the form which is sliding and the page also which would be sliding. That would also be a nice touch. On the form here, some functionality, we will see the form in more depth just after. We can empty the cookies on the page here. That's very useful if you receive an email from a colleague inviting you to do this webinar, thanks to the Marketo pre-filled, you will have all the personal information of your colleague here in the form when you arrive. And if you click here, you will automatically empty the form because we will remove the Marketo cookies on your device. Another functionality that is often asked for is this ability, with just one button, to activate all the buttons or deactivate all the buttons. And then we can fine-tune here. We also have this cookies banner. We can manage cookies banners on Marketo LP. When you arrive for the first time in the CrossKnowledge Universe on the Marketo LP, you can activate, deactivate, or give acceptance for the cookies for the LP and the website. If you go to the website after that, you will not be asked anymore. We can also, for instance on a Marketo LP, activate the Marketo cookies only if we have acceptance on the cookies. Otherwise, we will not deposit the Marketo cookies. We could also automatically empty the cookies on the device. That would be useful, for instance, on a preference centre if the person asked for these rights to be forgotten. Obviously, we will remove the data into Marketo on the CRM in the back-end side. But on the front-end side, we could then push the person to a specific landing page, "a thank you landing page", that will automatically remove the cookies of the person on the device. So that we are perfectly aligned with the GDPR. Other functionalities that are useful, for instance, we could have a countdown timer here. The choice of those pages was not to have the countdown timer, but properties like that which could be managed, for instance, with the tokens. And also a nice functionality is, for instance, the ability to limit the number of available seats to your webinar or event. That would be done into Marketo in the tokens. You would indicate in one of your tokens the available seats in your event, for instance, 50. And, for instance, the number of overbooking seats you allow for this event, maybe 20. Each time a person arrives, when he submits or directly when he arrives on the page, we will dynamically say to the person: "Seats are open" or "Seats are closed" or "You are overbooked, and we will come back to you later". That would also be a nice touch. The last functionality here is the UTM capture and redirection. For instance, let's imagine that on this page, which is a portal, you have done some promotion on Google Ads, LinkedIn Ads, an email campaign, or whatever. You arrive on this page here thanks to this UTM, with a question mark, not a slash. You know that if I click here, I will lose this UTM. You see here, I have lost the UTM. So what we have done on my website, for instance, if I arrive on this page with this UTM source linking ads and I click here on a link, I will go to the desired URL. But the UTM source that I've arrived with will be captured and will be added to the destination URL. So I will not lose the UTM even if I bounce. If there were a form on this page, Marketo could capture the UTM source thanks to the UTM. That's also something that's great for pages that are portals, that you promote and you don't want to lose the UTM. Another functionality that might come in handy. We could, for instance, hide all or part of the LP through a password. That would be especially useful, for instance, in the healthcare area where you don't want your data to be public and you want only a selected number of people to be able to access the landing page. Or if you announce a very important service/product and you want to select a happy few to have the pre-announcement, for instance, journalists, shareholders, or VIP customers, you will send them the password and they will be able to access your landing page. Whereas the other person will only see either a blank or another message. If you use video and you use YouTube on your web page, you know that there's no connection between YouTube and Marketo. But you may want to select only known visitors to view your video. So what we could do is for the persons who are not known from Marketo, so anonymous persons, we could trigger a form appearing after, for instance, 10, 15, or 30 seconds once the video is launched. That way we are sure that only the persons who have submitted a form and are known could go through the entirety of the video. Obviously, on the form, we could put some controls on the email domains or company names so that, for instance, competitors cannot see your video. That could be done. And if the person refused to submit the form, therefore the video could just disappear and you will not be able to access the video. So that could be one way to do it. You know this module called web Personalisation, where Marketo gives you the possibility to add pop-up on your web page: pop-up, popping on the right, on the left, on the bottom, for instance, or pop-up when your mouse exits the page, that could also be done through JavaScript on any Marketo landing page. You don't necessarily need the web personalisation to do that, just for you to know. We talked about that, but we could have sticky banners. So, for instance, this banner here, it's not sticky. So that's when I move down, the banner disappears. But we could have this sticky banner just like my website, I think. Not on this one, but on this one, yes. On this one we have a sticky banner. So this banner here stays on top while we moved down the page. So that's something that can be added, especially useful if you have your call to action on the banner. And the last functionality that could be useful on the landing page would be the ability to reorder dynamically some modules. You know that the modules on the landing page are not like the modules on the email. You cannot duplicate and move the modules. So you have to really think about your landing page when you design the template. And this could lead to add more modules, more identical modules in different order so that you are prepared for any situation. One way to do that, to avoid this addition of modules, will be to add this reorder dynamically functionality here, where you have all your modules and you just indicated the order of modules here so that you just need one module and indicate the order. So it leads to a lighter template, which is great with Marketo. Now let's talk about form, for instance, I'm on this Murex website here. We have this Marketo form here. And the first functionality that was asked was to be able to embed the Marketo form through an A-frame here. It was in order to be able to perfectly embed the look and feel of the form without impacting the website. So we can embed your Marketo form either natively with the JavaScript given by Marketo and add the CSS to the web page. The look and feel of the form is exactly what you want. We can embed it through an A-frame just like we did here. We could also, and we will see that after that on my website, create a WordPress or a Drupal plugin so that you have a short code on your website to integrate directly wherever you want your Marketo form. Or we could add some scripts behind your native custom form on your website, which would not be a Marketo form. So that's when your native form is filled out, we mimic this behaviour in Marketo and we insert or update the person that has just filled oud the form into Marketo and we add some data into the activity. Different ways to integrate forms on the website, first of all. So here on this website I started to fill out. So you see the look and feel of the form is exactly the one on the website. We have some animation here in the fields with this red line appearing. We have some advance control on this email field. The customer wants to exclude, for instance, a number of competitors through email domain. So we have embedded that at the form level. You know that Marketo just has delivered a new functionality in order to exclude some email domains, but this functionality is all or nothing. So we just have one rule and we activate that on all the forms. We could exclude some of the form, but we cannot have, for instance, two set of rules, or to fine tune just one form, when all the others are on the general rule. So here, we can either put the exclusions and the rules at the form level. So it will be especially useful if you use global forms, so the rule embedded on all the pages using this form. We could embed the rule into a landing page template so that all the landing pages done on this template will embed this specific exclusion rule, whether it's competitor, it's generic email, email address or personal email address. Or we could also embed the rule within a token so that only a group of programs would be impacted. So, you know, you can put your token into the folders and you can decide at which level of the hierarchy in the folders you want to put the folders. So that's very useful to find the exact perimeter of programs you want this rule to be applied to. So as you see, plenty of possibilities to manage the exclusion here. Then we have basically, the native Marketo functionality to display with a condition. Some field, so nothing fancy here. We have another form on this page, for instance, the "Contact us" here, with the slider arriving on the right. And this page is disappearing a little. So here we have different look and feel of this form depending on this first field that we choose. Yeah, you see, the field is changing, depending on which topic I choose. So again, the control on the email. The second functionality that this customer asked was to transmit some advanced data into the data layer. So I don't remember whether it's for Google Analytics, Matomo or AT Internet, but some of the answers of the form will be pushed to the data layer so that they can find that into their Google Analytics, Matomo or whatever, and be able to analyse the customer journey better. So this is something we can do. Another functionality that is not so often used, which is the multi-step form. So here is an example. I have this form with a first page with only email and you see here this functionality where the label shrinks, but stays in the field. So, nice effect. Then we arrive on page two where I can go on and you see here the second functionality, which is the control of the fields. So if I enter something that doesn't match the rules, the line will not be green, but would be red. Obviously, I can come back if I want. And this is it. And here we finish with a small preference centre with some consent. And again with this global button. So that we are perfectly aligned with the GDPR. And we could also have a smart exit here, we'll see that just after with my next form. So the next example is on my website, on this Marketo Office Hours page. If I want to subscribe here, as I am known by Marketo, Marketo already knows all the information about me, so it doesn't show any field and I can subscribe directly. Why is that? Because I've got my cookies on my device and I'm recognised. So first of all, we can implement the pre-fill functionality just as it existed some time ago in Marketo, based on the cookies. So no more the email token, but based on the cookies, so, here when I arrive, Marketo detects I've got cookies, gets my information through the cookies, recognises me and then adapt the form dynamically. So here I'm the end of my customer journey and I don't have any feeds anymore. I could say: "Okay, empty the cookies", that's what we will do just after that because I want to start over. But I could review more all the information I have previously entered. And by the way, this is something we could force every six months. For instance, we could force any person with other information completely filled out to review the form so that we are sure that the data stays fresh. Let's remove everything and refresh. And we will start over. So the first thing is that I am currently at the first touch of my customer journey. So I've decided that for the first touch I will ask these four fields on the person and these two fields on the company and the Opt-in, the specific consent for the marketing automation. And this is something I have decided. So this is a bit like the progressive profiling, you know, into Marketo. But first, we are implementing that on the web page, not on the Marketo LP, and second, we got rid of the constraints to have only the number of empty field as a variable. Here we decide for each touch exactly what should be the field that would be displayed. So that's why here I've got four areas, here I've got two and you will see on the next step it will be different. So let's subscribe here. Another functionality, we have a dedicated a thank you message directly embedded in the form. And here we have decided to have two buttons, but we could dynamically adapt the CTA, the text depending on the answer that has been provided. Now, on my second touch, if I come back in this form or on a similar page with the same kind of form, and all my web page of the same kind of form. So for instance, a gated content, or a webinar registration. This is my second touch here, I've decided that the second set of field I will ask for the person would be the preferred language. So it's previewed by Marketo with French. And for the company that would be that number of employees plus the department. Let's subscribe again. On the third touch of my customer journey, here I've got two new fields, so that would be the city plus the phone number. And for the company, which would be the marketing automation solution, plus the CRM solution. So you see different number of fields per touch, not a problem. And on the fourth touch, just exactly as we see at the beginning, and perfectly known. So here, no more fields are asked, I can subscribe directly. What's very interesting in this case is that we developed here in the back end, in Wordpress, specific plugin where I just have to enter a short code for the Marketo form to appear. And this short code looks a bit like the Marketo Java Script you get when you create a form, but some properties have been added, for instance, the text of the button, the title of the form, and the focus area. And the focus area here will define exactly which consent will appear on the form. I've just one form that will adapt, depending on the page I put a form on. Whether it's an event, a Marketo Office Hours, a gated content, the newsletter subscription, the form will have a different look and feel based on the focus area. So that I'm autonomous when I want to develop a new page, I don't have to go through my devs. It's very convenient for me. Some other functionalities on the form that we could do, for instance, we could type the beginning of the company name. Here would appear a pick list value of all the available companies in your internal database or an external database you're connected to. Therefore you could pick up exactly the right name for the company you're looking for, and reconcile directly into the database, into your CRM for instance, this company which is the one existing in your server. That would allow better data quality right at the beginning of the customer journey. And why not convert this person automatically? That would be a lead into Marketo directly into a contact into your CRM if the company matches exactly. That's something we could do. There are some other fields. For instance, in France, we have the SIRET which is the fiscal number for the company. But it's the same with, for instance, a MasterCard or Visa card number. We have an algorithm that would recognise if the value entered is right or not. So we could implement those kinds of algorithms behind the form. If you have to enter a Visa card number or MasterCard number, if the number entered is correct, without having to submit directly when you enter the field. Something we could do would be also to, for instance, adapt more dynamically the form to the customer journey. If we detect, for instance, that a person has come to your website 10 times in two days and had quite a high score in a very short time, we could change this form to propose directly to contact the sales. And why not put the picture directly of the sales, the name, the email and phone number? Or directly to embed a plugin like Kindly or Xeno, that would allow to directly pick up a meeting slot with the sales without having to call. That would be even better. And because we detect that this person may have an urgent need, we could switch the form completely and propose directly a contact. That's something we could do. The last type of form we usually find in the preference centre in order to be aligned with GDPR. This is a page you can have on the Marketo landing page, or just like we did on-screen on our website. And usually what we find in this preference centre is the Unsubscribe. GDPR says that we must have an easy way to unsubscribe to everything. So this is done through this section here. Personal information with the ability, for instance, to change your email. Company information, then some interests. That's very useful to trigger a training program, for instance. And the subscriptions or the consents that you have for various objectives. So here I have events, thought leadership, newsletters, training and seminars, and the Marketo Office Hours. We also added here a pause and the possibility to manage the right to be informed and the right to be forgotten. So what we could do to do that a bit better would be, for instance, to hide the section, to have a way to shrink the section. Maybe just to display the first and the second one and the other would be shrunk. It could be enlarged on demand thanks to a little arrow here. That could be interesting. But you see here the preference centre is aligned with my website's look and feel, so that's great. For international accounts who have multiple servers all over the world, this is a bit trickier because usually you have concerns per country. So for instance, you can subscribe to the newsletter or to the events in Thailand. You want to also read the newsletter in the US, and you want to have the promotion from Spain. So every country has got its own set of preferences. One way to do that would be to have a first field with the country. And then based on the country you would have the consent of the country you're in. But that's not really easy if, for instance, you want to subscribe to a newsletter of a country you're not in. So what we could do here to tackle this kind of issue would be to have first a map at the top of the preference centre. You choose the area where you want to be able to manage your preferences. And thanks to this map, the preferences of those countries will be displayed. And here at the bottom - so we've not done that here yet because it's an ongoing project - we could have only the preferences of those countries. The rest will be hidden. But you will still have your personal information and, for instance, the company information. So that would be one way to do that. I think it's in the pipeline. Last but not least, the email in Marketo. The difference between the landing page and the form for the email, we have one major constraint. This is that we have different email clients that will not render the email exactly the same way for all of them. Let's talk about Outlook here, which has a very peculiar way to render the email. This puts a heavy constraint on the creativity we can have in the email. That's why very often for the email, we will find the same block throughout all the customers. Obviously the email has to perfectly align with your guidelines, with your charter, with the fonts, the colour, complexion, whatever. But on what kind of block you can have, it's very often the same throughout all the emails. What could make an email beautiful is very often a nice picture. If you have the chance to sell products like this customer who promotes high-end watches, you can have a very nice picture of the watch. Here on this email we try to have an email that will look a bit like a landing page with this multi-language possibility for the email. Here for this email the customer wanted a more loyalty-program-oriented email that will help the installeur to understand the loyalty processes. That's something we can also do. But you see, very often we have the same kind of blocks for all the customers. The direction we must go forward from now on is to personalise more the email. So obviously you can already personalise your email thanks to the Marketo token. We all know that, no problem. We can personalise the email thanks to the segmentation. You can have the same email looking differently for different kinds of customers, geographies, industries, whatever. But, you know, segmentations are really useful for demographic and firmographic differentiation. But not so much for behaviours. We could do that, but it's a bit tricky to do. Here we are talking more about, for instance, having a promotional banner that will appear without any new developments in all your emails. For instance, for the end of the year, you want to do a special promotion with 10% discounts for any order passed before the end of the year. You want to roll that out in two days'time because you just had the idea. You don't have the time to review all your emails and to do it back at the beginning of the year. So what you could do is to implement in your templates a banner that will only display when you fill out some tokens at the top of the folder hierarchy. So you could have a token for the text, a token for the CTA text, a token for the picture. You add as many tokens and you will use those tokens within this banner that will only display if the tokens are filled out. So it's very easy for you. You enter the tokens, the banner appears for your promotion. You empty the tokens, the banner disappears. So no problem to make it appear, make it disappear. That could be the promotional banner. We could have, for instance, a banner that appears on all your emails if a person has a score above a certain threshold, for instance, 50. Here we would have this banner display, for instance, the picture of the sales, the name, the phone number and the possibility to book a meeting directly with him. And if the person is already a customer or does not have the score above the threshold, the banner would not appear. We could have, for instance, we did that back in the days when GDPR was first enforced in May 2018. For any person who has not visited the preference centre, we could have this banner displaying: "Please indicate your preferences so that we can personalise the content we will send to you". And if the person has already visited the preferences centre program, we will not display the banner. This could be done with some script within the email, within the forms, or within the LP. We can do that on all the assets. But that's definitely the direction we must all take in the emails and the forms and the LP. This is the end of this Marketo Office Hours on the Marketo Assets. I hope you will have plenty of ideas to step up your game in Marketo. The real challenge here is not what the ideas are that we could give you, tt is what you really want to do because there's absolutely no limit in Marketo. When you have an idea, usually we can make it. If you have any needs, don't hesitate to contact me: sylvain.davril@merlinleonard.com or take directly a meeting with me on my website. See you soon.