Marketo now fully supports responsive landing pages, we call the new style a "Guided Landing Page". A Guided Landing Page is one that is capable of dynamically resizing itself for different window sizes and devices. If you’ve used the Marketo interface to set up an Email Template and an Email, the basic concept of setting up a responsive template and landing page will feel pretty familiar.
First you have to define a template that contains the editable areas of the landing page, once that is completed you use that template to build the landing page. Unlike the Email editor however, constructing and altering a responsive landing page template will require a minor amount of HTML knowledge.
If you are not comfortable in HTML and do not have an HTML developer available to assist you, Marketo’s services team can help! You can reach them at firstname.lastname@example.org
To get started, first visit our Template Library for Guided Landing Page Templates located here:
Select the template you’d like to use, right click the link and select “Save Link As” to download the HTML code.
Once the template is saved locally on your computer, go to where it’s saved and open it in the text editor of your choice. What you’ll see is a whole bunch of HTML:
In your text editor, use CTRL-A to select all and CTRL-C to copy it to the clip-board. (On a Mac this is Command-A and Command-C) then log on to your Marketo instance.
In your Marketo instance, go to the Design Studio and select “New Landing Page Template”
In the New Landing Page Template window, assign your template a folder and a name, then make sure the editing mode is “Guided”. The “Free-form” mode is for the non-responsive templates that we had before. Click “Create”!
Now we’re ready to replace the sample template code with the code you downloaded from the Template Library.
CTRL-A (Command-A on a Mac) will select the starter code and CTRL-V (Command-V) will paste the template code right over the top of the existing code. The template will save itself automatically when finished.
Now that the template is ready to go, we’re ready to see it in action!
Using a Marketo Guided Landing Page Template:
Now that we have a template created, we’re ready to start using it. Close the template tab where the code is and go back to the Design Studio.
Select the template you just created and approve it.
Once the template is approved, you can use it to create a landing page. In the new landing page window, assign a folder and a name and select the template you just created. Click “Create”!
You can always identify which templates are responsive and which are not by looking for a little window icon on the right hand side. If the window icon is present then that template was created using the new Guided editor and is fully responsive. If the window is not present, then that template was created using the old editor and it’s NOT responsive. You cannot automatically convert an old non-responsive template to a new one.
Congratulations! Your new responsive template is ready to use!
Please see our documentation here on how to edit a Guided Landing Page: