if you’ re new to web design & landing page creation, or if in the past you’ve left the nuts-and-bolts design of your landing up to someone else, this document will help you get the most out of your Rocket Lander landing page template (RLLPT). You will require the following tools:
| Tool | File Uploader | File Editor |
|---|---|---|
| Dreamweaver (paid) | ||
| FileZilla (free) | ||
| BulletFTP (free) | ||
| MonstaFTP (free) | ||
| Notepad (available on your computer) | ||
| Your Web hosting Tools (free) | ||
| Chrome, Firefox, IE - web browsers (free) | ||
Installation should take less than 5 minutes.
Once installed, the folder/file structure will look like this:
<landing-page-name>/
├──── index.html › landing page (single file template that contains all contents)
├──── thankyou.html › Confirmation page displayed after visitor submits form (converts)
├──── assets/ › includes jquery, bootstrap, css etc. source files
├──── images/ › contains all images used in landing page
We recommend uploading your (RLLPT) before you start editing the files. We have found it is easier if you preview your RLLPT in working state on your server first, then simply swap/edit the files as required. As long as you have copies of your original files, you will never make an irreverable mistake. And, if there are any issues in uploading, you can figure them out now rather than at launch.
You can edit the text in your template by opening the index.html & thankyou.html file with your code editor, locating the placeholder text and replacing with your text/html.
Make sure you replace only the text between the code markers <!-- Start EDIT --><!-- End EDIT -->, and not the code like "<p>" , "</h1>", "<div>" etc. (unless intended). You can also use your editors find/replace function to locate specific text/images/elements etc. inside the code. For best results, make sure the text you add is approximately the same length in the code as the text you replaced.
TIP: If you are intimidated by code? Don’t be – it’s just text. You’ll be cutting and pasting snippets in no time. Before you get started editing, take a moment to scan through the html and get a feel for where all the information is in your template. Every design is different, but in general, fonts and styles are at the top, content is in the middle, and jQuery/Javascript, Google tracking codes are at the bottom.
Remember to replace the placeholder text inside both the index.html & thankyou.html file
Your Rocket Lander comes with placeholder images correctly positioned on the page. In most cases, you will want to replace/swap them out for your own images. This is especially true of product images and your own logo.
All image source files used in your landing page are located inside the folder: /<template-name>/images
The easiest way to change your Rocket Lander images is to open the existing image in your photo editor, paste or place your image over top, size your image to fit the space, then save using the same file name. This will insure that your new image is the exact same name & dimensions as the original placeholder image.
TIP: For best results, make sure that your replacement image is the exact same size in pixels (width x height) as the image you are replacing. It also saves you time and hassle if you replace the placeholder image using the same file name and format (jpg, png, etc.). So if, for example, you want to change logo.jpg, save your own image as logo.jpg and overwrite it on your server.
To replace video - If your template uses a video background or video content, simply locate the videoURL inside the index.html file and replace with the url to your own video from youtube.
Your RLLPT includes the latest Google analytics tracking snippet. To get your landing page to start reporting traffic and conversion statistics inside your Analytics account, you will need to add your Analytics Account Tracking ID to your landing page template. Here is how to do it:
<template-name>/assets/google-analytics.js using your file editor.
The template uses a form to capture user information. The contents of the form are sent to an email address you speciify. To add your email address:
assets/mailer.php at line 81$my_email = {add your email address}To edit the contents of the message text:
Once you are happy with your landing page you are ready to launch to the public. The basic premise of launching your LP involves sharing the URL to your landing page. For SEO reasons you can create a descriptive url that describes your landing page i.e. http://domain.com/my-landing-page-campaign. Here is how to do it:
domain.com/{template-name}/ domain.com/your-landing-page/ 
The application uses the latest version of Bootstrap, jQuery and other related JavaScript libraries. You can add/edit the usage as required by your project. Here is the complete list of Bootstrap/jQuery plugins. Please note that most plugins are included in the application using an absolute link to the hosted CDN version.
Credits & Contributions
You can customize the look & feel of your theme by modifying the css styles located inside the external CSS file used by your theme. You can also add your own custom CSS rules. Your theme is located here:
assets/css/styles.css
You can learn more about customizing the CSS from the official Bootstrap website. We also recommend searching google for additional Bootstrap design/development resources.
If you want to use the provided fonts, cool! No reason to mess with a good thing. But if you’re looking for a new font, go to Google Fonts (http://www.google.com/fonts) and follow the instructions to find, copy, and paste your new font. Here is is the general guideline on how to change the font for your template. Each Rocket Lander includes the use of 2 Google fonts. One font is used to display headline text. The other is used to display paragraph text.
The template uses a form to capture user information. The contents of the form are sent to an email address you speciify. You can customize the form by adding new fields or replacing with a 3rd party form i.e. survey monkey survey form, mailchimp subscription form, google form etc.
Integrating 3rd party form tools:
You can create a hybrid android app of your landing page. Creating an android app will allow users to download and install your landing page on a mobile device. Create app for Android device, Create app for iPhone, iPad and other IOS devices.
Social share buttons are built-in to your landing page using the "AddToAny" sharing service. This service is free and no configuration is required. Your visitors can quickly & easily share your landing page with one simple click.
Your rocket landers uses Bootstrap, jQuery and other related JavaScript libraries. You can add/edit the usage of these components as required by your project. Refer to the author website for additional info. Here is the list of contributors that were used to create the Rocket Landers experience: