Most developers or established tutorial makers prefer to write technically advanced and glamorous tutorials like “How To Make A Mentally Disturbed Frog Jump Out Of Your PC Scream with The Help Of jQuery And Some CSS”, or something similar. Sometimes it can be really difficult to find relevant information on the basics – one of the most common questions we get here on Cashrevelations is “how to edit the landing page template”?
This is a short and simple tutorial on how to edit an HTML template – with the help of this tutorial and some practice you can edit landing or squeeze page templates all by yourself.
Finding An HTML Template & Unpacking It
First you need an HTML template you can practice on. You can search on Internet – there are both free and premium alternatives. Or, if you are tired to search the Internet, you can simply go to our Downloads section or to our article 150 Free Landing Page Templates.
Most templates, or any type of file downloads, come packed in a ZIP file and you must unpack them before you can begin to edit them. Right click on the ZIP folder and choose “extract all” – this will open your extraction wizard. Just click “next” and then select the location to extract your templates to. If you have problems with uncompressing (unzip) the templates you could try an online tool like WobZip.org.
Edit The HTML Template
First, make sure your template is an HTML template and nothing else – frequently we get questions from troubled people who try open a PHP page in their browser or try to install a usual HTML template on a WordPress blog or the opposite. The simplest way to test if you have an HTML template is to first locate you template and double click on it – if it opens in your browser and looks like a usual page, then it is an HTML template.
Locate your HTML template and right click on it – choose “Open with Notes” or “Open with WordPad”. By now, you see the source code for the template. Find the text you want to change – remove it and paste or write in your own text. In upper left corner, under File, click Save – it’s important that you save after any changes in your HTML document.
We Repeat:
- Right click on the template
- Choose “Open with Notes” or “Open with WordPad”
- Locate the text you want to change and remove it
- Paste or write in your own text to the template
- Under File (upper left corner), click Save
Open your HTML template in your browser by double clicking on it. If everything looks all right, then you are finished with your editing. But usually it doesn’t look all right at all.
One problem is that text lines often are too long. You can adjust the length of the text lines with a <br /> tag. Just put <br /> where you want to break the text line.
If you want to change the appearance of your template (body color, headline size or text size etc.) you need to change it from the CSS file – most modern landing page or squeeze page templates use CSS for styling. But editing CSS should not make you nervous.
If you make a copy of your template before you begin with your editing, then you can experiment all you want – and it is exactly what you should do. Don’t be afraid to play and change in the CSS code, nothing bad will happen – if something get broken, just make another copy from the original template.
To get information on CSS and how to edit CSS, we suggest you visit CSS Tutorial and CSS Reference by W3Schools. They provide you with information and coding examples in a very pedagogical way – they even have interactive example pages you can practice on.
Summary Of How to Edit An HTML Template
Editing HTML templates – all the process, from downloading and all the way to the ready template – consists of six easy parts:
- Download A Template
- Unpack Or Unzip The ZIP Archive
- Right click on The Template
- Choose “Open with Notes” Or “Open with WordPad”
- Paste Or Write In Your Own Text To The Template
- Under File (Upper Left Corner), Click Save
You have now edited the HTML template all by yourself. It is easy, and you sure will save some money when you don’t need to hire someone to do it for you. The only you need is practice and a bit of patience – and it also doesn’t harm to make a copy of the original template before you start editing.
[...] Look іntο thіѕ article: Hοw Tο Edit HTML Templates – Tutorial [...]