Holding Page

WordPressIf you've already bought a domain name and rented some web hosting space you are the proud possessor of some cyber real-estate! Congratulations!

If you have got FileZilla up and running you can put files on your server space.

So you might as well put something on it to let people who are surfing the web know you are there if they punch in your web address!

Below the dotted line here is the html (hypertext markup language) markup for a basic holding page, ie. just one page that will show on the browser if someone visits your web address.

This is how you do it:

  • Copy all the text between <!DOCTYPE html> at the top and </html> at the bottom of this page
  • Paste it into a text editor such as Notepad or Notepad++ (which you can download free and it's a good text editor!)
  • Save the file somewhere on your computer as index.html (the file name has to be index.html because that's the first file served up if anyone enters your web address in their browser)
  • Use FileZilla to transfer this file to the root directory on the server space you have rented
  • I've also made provision for an image on the markup document (image.jpg)
  • If you wish, you can upload an image to the root directory too, to make your holding page look cool!
  • Make sure the image file is called image.jpg, or change the markup to whatever filename the image has. Either will work
  • Before you upload it, resize the image to about 150 x 150 pixels. If the image is too big it will mess up the layout

Have fun!

Comments invited and are very welcome, thank you!
.................................................................................................................

<!DOCTYPE html>
<html>
<head>
<title>Holding Page Title</title> <!-- change to whatever title you would like between the 'title' tags -->
<style>
h1 {
text-align: center;
margin-top: 50px;
margin-botton: 50px;
color: #0073BA;
font-family: sans-serif;
}
.container {
width: 60%;
margin: auto;
padding-bottom: 70px;
background-color: #C4F9FD;
text-align: center;
color: #00598E;
font-family: sans-serif;
font-size: 25px;
}
img {
margin-right: 150px;
margin-top: 30px;
}
</style>
</head>

<body>
<div class="container">
<img src="image.jpg" alt="Image Title or Name" />
<h1>Greetings</h1>
<p>I'm in the process of building a website<br/>
and I'll be using WordPress<br/>
As soon as it's ready I'll put it up here.<br/><br/>
Thank you for your patience<br/>
and I look forward to your visits when it's done!
</p>
</div>
</body>

</html>

Leave a Reply

Your email address will not be published. Required fields are marked *