server side include (SSI) injection issue

I am working on html website. Where I have more than 30 pages. So I am looking for a solution where I have to use menu in one page and then call that menu on all other pages, So next time when I have to make some changes, I will only change in one file.

By google, I cam to know that I can convert my file extension from html to php and then use <?php include 'menu.php' ?> . But i dont want tyo change the extension here.

So another solution comes out which is Server Side Include (SSI).

But nothing seems changed here. Lets say my menu div is :

<div class="menu">
    <div class="page-logo">
        <a href="dashboard.html">
            <img src="assets/img/logo.png" alt="logo"/>
        </a>
    </div>
</div>

So I copied the menu Div code in separate file and save it as menu.html then uses SSI like this

<div class="menu">
    <!-- #include virtual="/menu.html" -->
</div>

BUT logo doesn't appers on my page. I wonder how this works on other's people, because as far as I know The SSI command is in comments tag <!-- COMMENTS -->

Any idea, What am I doing wrong above OR how can I use the same menu on all pages keeping html extension?

I have used thi smy .htaccess file

AddType text/html .shtml
AddHandler server-parsed .shtml
Options Indexes FollowSymLinks Includes
AddHandler server-parsed .html .htm

For any form of server side programming, you need to configure the server to look for the server side code in your file instead of just passing it directly to the client.

How you do this depends on the specific server you use. If you are using Apache HTTPD, then you can often use .htaccess. This is not recommended:

You should avoid using .htaccess files completely if you have access to httpd main server config file. Using .htaccess files slows down your Apache http server. Any directive that you can include in a .htaccess file is better set in a Directory block, as it will have the same effect with better performance.

It is very common to find that servers are configured to look for PHP in .php files and SSI in .shtml files.

You can configure them to look in other kinds of files, and to start looking if they are not already.

The specifics of how to do that will depend on which web server you use. For Apache, for instance, the manual has this guide for SSI

To permit SSI on your server, you must have the following directive either in your httpd.conf file, or in a .htaccess file:

Options +Includes

This tells Apache that you want to permit files to be parsed for SSI directives. Note that most configurations contain multiple Options directives that can override each other. You will probably need to apply the Options to the specific directory where you want SSI enabled in order to assure that it gets evaluated last.

Not just any file is parsed for SSI directives. You have to tell Apache which files should be parsed. There are two ways to do this. You can tell Apache to parse any file with a particular file extension, such as .shtml, with the following directives:

AddType text/html .shtml
AddOutputFilter INCLUDES .shtml

One disadvantage to this approach is that if you wanted to add SSI directives to an existing page, you would have to change the name of that page, and all links to that page, in order to give it a .shtml extension, so that those directives would be executed.

The other method is to use the XBitHack directive:

XBitHack on

XBitHack tells Apache to parse files for SSI directives if they have the execute bit set. So, to add SSI directives to an existing page, rather than having to change the file name, you would just need to make the file executable using chmod.

chmod +x pagename.html

A brief comment about what not to do. You'll occasionally see people recommending that you just tell Apache to parse all .html files for SSI, so that you don't have to mess with .shtml file names. These folks have perhaps not heard about XBitHack. The thing to keep in mind is that, by doing this, you're requiring that Apache read through every single file that it sends out to clients, even if they don't contain any SSI directives. This can slow things down quite a bit, and is not a good idea.

… and the PHP manual has this guide:

# Make all PHP code look like HTML
AddType application/x-httpd-php .htm .html

---

as far as I know The SSI command is in comments tag <!-- COMMENTS -->

SSI syntax is designed to mirror HTML comment syntax so that if the server fails to parse the file for SSI then the fallback position will be to fail silently instead of breaking the rest of the content of the page.

The SSI parser won't treat it as a comment.