I will be using eclipse for my text editing but you can use any text editor. A lot of the steps in this blog are not necessary but they will help us stay organized later. The first thing I like to do is create a new project. You can do this by going to the file menu and clicking New. The Project we want to choose is under the General tab. Also a right click anywhere in the project explorer pane will also bring up a menu with New, then select project.
Click the next button and enter a name for your new project. I choose MyNewProject.
The New Folder window will appear. Enter a new for your folder (I choose html) and then click Finish.
We now have a project with one folder underneath it. Eclipse has many built in templates. So lets use one for an html 5 web page. Following the same steps as above right click on the www (I renamed my html folder to www), select New then scroll down and select Other. Scroll down to the Web folder and select HTML file.
Click Next and enter a name for our temporary landing page. I choose temp.html.
Click Next and make sure Use Html Template is checked. Scroll down and select New HTML FIle (5) and click Finish.
This will create our html page with some boiler plate code already created for us.
This is eclipse's template for an html 5 document. We know this is an html 5 document because of the first line in the file - the doctype. Add the following few lines of code to our document between the body tags.
Save the file. Lets take a look. Right click on the file and elect Open With and Choose Web Browser. This will open a browser in eclipse and your web page should look something like the following:
I have my eclipse configured to display in an external web browser. You can do this by going into the preferences of eclipse. Expand the General selection, click Web Browser and then select Use external web browser radio button. Click Apply and Ok and now your web pages will be viewed with your default browser in a separate window.
So we have a new html file. It isn't pretty but it is enough to replace our current index page provided by our web hosting company. We need a SFTP program to transfer our new file to our server space provided by our web hosting company. I am going to use Filezilla . You will need to enter the sftp credentials provided by your hosting company into the site manager of filezilla. The left side of filezilla is your computer and the right side is the server provided by your hosting company. On the left navigate to your newly created web page. On my mac this is in Users / *your login name* / Documents / Projects / my project name / www / temp.html (your path will vary depending on where you created your project).
On the right, open your domain folder and you will see an index page. Drag your temp.html file from the left to the right. You can delete the index.html file on the right and rename your temp.html to index.html. You can see from the image I choose to rename the original index.html provided by Platon to platon_index.html. I then renamed my temp.html to index.html. You can now visit your domain and you will see your newly created landing page.
