- So you've decided what pages you'd like to have in your website, now let's make them! To create a new web page, you create a new file with a name that ends in .html. At the top of the code panel, click on the + symbol next to the tabs. This will create a new file. Give it a name. Remember, it must end in .html (including the dot!) so that the browser knows it's a web page.
- If you want to change the name of a file, click on the cog icon to the right of the filename, and click the pencil. Type in the new name and press Enter. You can also delete a file by clicking the bin icon instead of the pencil.
- You might be wondering why you can't change the name of the index.html file. "index.html" is a special name used for the homepage of a website. That's the first page you land on when you visit a website. When you go to a website's homepage, the browser looks for the file called "index.html" and displays it on your screen.
- Go the the file blank_page.html in the code panel (by clicking on the tab with that name). Select all of the text in the file by doing the following: Click anywhere inside the code panel, then press and hold the Ctrl key (or if you are using a Mac, the cmd key) and while holding it, press the A key at the same time. Notice how all the text becomes highlighted.
- Now, with the text selected, press and hold the Ctrl (or cmd) key again and then while holding it press the C key. This copies everything that was selected.
- Go to your new file and click inside the code panel (which is blank at the moment). Press and hold the Ctrl (or cmd) key and then while holding it, press the V key. This pastes everything that was copied into your new page.
- You can use these keyboard shortcuts in most programs to copy and paste stuff, including text and files!
- Change the text in between the
<title> </title>
tags so your new page has a descriptive title. - In between the
<main> </main>
tags in the new file, use the tags you have learned to add stuff to the page, such as paragraphs, headings, images and lists! Repeat the steps above for each new page that you want to add.
- Remember, when there are too many tabs to be able to see them all, you can use the < and > icons in the top left corner of the tabs to scroll between them.
- On the next card you're going to learn how to make links so that you have a way to get to the new pages.