Before you start all this, visit your ISPs FAQ pages and search for "htaccess." You need to check if your ISP allows you to use htaccess files. If these are not permitted, then you won't be able to use SSI.

The best way to explain this is to create a sample page that uses SSI. You have an index.html page and twelve subpages. Every page has its content. It also has universal elements that exist on all pages: a logo banner at the top, navigation bar on the side (links to page one, page two, and so on,) and a footer with more navigation items (copyright, contact, and so on.) See as an example.

Open your index page's HTML and copy the left-side navigation bar. Copy the entire block.

Open a new blank page and insert the navigation bar. Do not add HTML, HEAD, BODY, or anything else. Just the navigation bar.

Save the new page as navbar.html. You can name it whatever you like. Tip: I add the prefix ssi-, so I know what these files are (for example, ssi-navbar.html.) It's up to you.

Do the same for the header banner and the footer text. Copy the HTML into new blank files and save them as ssi-banner.html and ssi-footer.html.

Now go back to the index.html page. At the place where you have the navigation bar, delete the HTML and replace it with the following:

<!--#include file="ssi-navbar.html" -->

This is an SSI link. When a visitor's browser opens your website, the server will fetch the navbar.html file, insert it into the HTML, and send the page to your visitor. She will see the navbar in your page, as it should be.

If you named your navbar as links.html, then change the file name in the SSI link into links.html. Just edit it to use the file names that you gave your files.

Note: Don't retype that. Copy and paste it into your index.html and edit it. The spaces, or lack of spaces, is important. If you add or remove a space, it won't work.

Do the same for the rest of your index.html page. Copy the banner HTML code, paste it into a new page named ssi-banner.html, and replace the banner HTML code in the index.html page with the SSI code

<!--#include file="ssi-banner.html" -->.

Do the same for the footer HTML code.
If you upload this to your website and open the page on your browser, you'll see that the banner, navbar, and footer are missing. You'll only see the content of your page, but none of the universal elements.