Landing Page Composer Features Overview
Drag-and-Drop Content Blocks
This functionality lets you design pages fast, rearrange the layout and elements on the fly, and see the edits as they are made. Simply drag your desired block into a section or click an existing block to edit its properties.
The Landing Page Composer is set up to automatically adapt to the visitor’s screen, no matter which device they are using, without compromising functionality or aesthetics. No additional coding is required.
Additionally, the page will adjust appropriately depending on the orientation of the visitor’s tablet or phone.
You can independently edit the mobile version of your landing page from the desktop version. Simply hide any desktop elements that you don’t want to appear in the mobile version and add a new mobile-friendly element, if necessary.
Buttons on your landing page are key if you are looking to have your visitors interact with your content in anyway. If you are driving traffic to your page you need a strong, clear call-to-action and a button that stands out enough for your prospects to be drawn to it.
The icon block allows you to include many of Font Awesome’s icons in landing pages. Simply type the name of an icon in the search bar to see if it is available and then select its color using the picker. You may also set the overall size of the icon and adjust the alignment.
Using Social Share, you are able to provide your recipients links to promote your marketing content on your behalf directly in your landing page.
Share networks include: Facebook, Twitter, and LinkedIn. You have complete control over styling options, which include the abilities to select different icon sets, icon size, icon padding, alignment and horizontal/vertical layout.
Additionally, you can drag the icons in the order you want them to appear on your landing page.
Pull in your RSS feed through the RSS Content block. Your RSS feed will update with refreshed content the first time the page is visited. It will update again on the first page visit 3 hours after the last refresh occurred.
The Map block allows the ability to adjust the Location, Height and Zoom of a map image. This may be useful when sending event invites and reminders.
Using video within your landing page allows you to quickly get your message across to potential prospects with ease. Studies show that video can increase conversions by as much as 80%.
Using the Video block within the landing page composer, you can quickly embed Youtube/Vimeo videos within your landing page.
The Spacer allows you to drop a block into your content to add a horizontal rule across content. Unlike typical horizontal rules, you have extensive customization options to increase the thickness, horizontal and vertical padding and color of the line.
Save a landing page as a template directly from your editing session.With the Save As Template option, you can select which folder in the template listing you want to save to.
The Content Catalog brings a fresh approach to designing your landing pages, while giving your marketing assets a professionally designed look with a few clicks of the mouse.
The Content Catalog allows you to select from our growing library of landing page templates to use within your Act-On account and easily edit for a look that is consistent with your brand or color scheme.
Act-On has uploaded quite a few landing page templates in your account by default, so you can quickly begin creating landing pages.
The Landing Page Composer now includes the ability to upload an html file with placeholders that will allow you to easily modify images, text, buttons and custom content using Act-On’s content block controls. Just make sure your designer uses the following:
- Rich Text block:<div data-aoBlockType=”richText”><p>Rich Text Block</p></div>
- Button block: <div data-aoBlockType=”button”><p>button</p></div>
- Image block: <div data-aoBlockType=”image”></div>
- Custom Content Block: <div data-aoBlockType=”customContent”><p>Custom Content Block</p></div>
Once uploaded, just click the Content block to edit these using the new Landing Page Composer’s content block controls.
The Redirect URL can be set for a landing page using either the Global URL, an Individual Redirect URL or selecting an existing landing page in Act-On.
The Global URL is the default URL that a landing page will redirect to if another option is not set. To set up the Global URL go to Settings > Other Settings > Custom Account Settings.
The Individual Redirect URL option allows you to type in any URL that you would like to redirect to.
The Landing Page Redirect will allow you to select an existing landing page in Act-On.
The Displayed URL is the URL that will be shown in the browser's address bar. You can easily create new public URL's by clicking the + sign and entering a descriptive name for the URL.
Keep in mind that this description is only used within Act-On, so make sure it's something easily recognizable. To edit URL settings, hover over the URL and click the pencil icon.
Page sections are used to house the content of your landing page as well as format the layout of your page. All content added to your landing page will need to be placed within a section.
Think of each section as a separate column and within each column you can add up to 12 rows for content, creating a responsive grid that scales on the fly depending on the device or screen size being used. The numbers on the image to the right will show you the order the blocks will appear on mobile devices.
In the Design tab, you can view the edits you make to your landing page in the preview window. Make a mistake? No worries, there are now Undo/Redo buttons in the top-right of the editor.
Add any background image or color to your entire landing page or to a specific row or column. Once you have selected your image or color, you can adjust the Opacity and Location.
Many of the more modern websites out today have a menu or “banner” that will stay at the top of a web page when scrolling through. Now you have this option in the new Landing Page composer with one click!
If you would like to have your top section stay fixed to the top when scrolling, just toggle on the Lock Top Section option under Page Properties.
In an effort to supply more web-safe fonts for landing pages, Google Fonts have been added after the standard fonts for the Font Family options.
By default you will have access to what Google considers to be the most popular fonts, but if you have a certain Google Font in mind - simply start typing the name of the font you would like to use and the selector will generate the options that match.
After designing your landing page, you will want to review it for accuracy and make sure it displays correct on Desktop, Mobile, and Tablets. From the Review tab you can view how your landing pages render on desktop, tablet and mobile.
Additionally, you will be able to preview both vertical and landscape views for tablet and mobile.Please note:
The landscape view for tablet is the equivalent of the desktop view.