Difference between revisions of "Making an "Under Construction" page"
(→Download the background image) |
(→Upload to your hosting package) |
||
| Line 83: | Line 83: | ||
=Upload to your hosting package= | =Upload to your hosting package= | ||
| + | Both '''index.html''' and '''Background.png''' must be uploaded to the '''httpdocs''' folder on the hosting server. | ||
| + | |||
| + | There are a few ways to upload your files, but if you've never done this before, we recommend [[Manage files via Plesk control panel|using the hosting control panel]]. | ||
| + | |||
| + | For other options, see [[Uploading your website]]. | ||
Revision as of 19:10, 16 February 2023
Here's an quick under construction page which you can get set up on your hosting package in just a few minutes. You'll also learn some useful skills along the way!
Contents
Making the page
All you need to make a basic HTML page is a text editor. On Windows, the easiest option is Notepad. On Mac, TextEdit is the default choice.
Please don't use Word to make your page. It won't work.
Open your text edit, then copy the text in the block below and paste it into your text editor.
<html>
<head>
<title>Under construction</title>
<meta name="description" content="This website is under construction">
<meta name="keywords' content="my website, my business, my products">
<meta name="viewport" content="height=device-height, initial-scale=1">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style>
/* Container holding the image and the text */
.page {
position: relative;
text-align: center;
color: black;
display: flex;
justify-content: center;
overflow: hidden;
height: 100vh;
}
/* Centered text */
.centered {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-45%, -65%);
font-size: 2em;
}
/* style of space behind the image */
body {
background-color: black;
}
</style>
</head>
<body>
<div class="page">
<img src="Background.png" alt="Under construction page">
<div class="centered">
<p><center>
My website
</br>
Coming soon
</center></p>
</div>
</div>
</body>
</html>
Save the file
In TextEdit
Download the background image
Right-click this link and click Save link as... and then click Save.
Upload to your hosting package
Both index.html and Background.png must be uploaded to the httpdocs folder on the hosting server.
There are a few ways to upload your files, but if you've never done this before, we recommend using the hosting control panel.
For other options, see Uploading your website.
