Force import of css and js into site pages

0
<nav class="navmenu center">
   <ul>
      <li class="first scroll_btn active" onclick="atualizarPagina('Home.htm');"> <a>Home</a></li>
      <li class="scroll_btn" onclick="atualizarPagina('Empresa.htm');"><a>Empresa</a></li>
      <li class="scroll_btn" onclick="atualizarPagina('Servicos.htm');"><a>Serviços</a></li>
      <li class="scroll_btn" onclick="atualizarPagina('Contato.htm');"><a>Fale Conosco</a></li>
    </ul>
</nav>

<div id="conteudoHome">
   ...
</div>

<div id="conteudo">

</div>


    function atualizarPagina(site) {
        if (site == "Home.htm") {
            $("#conteudoHome").css("display", "block");
            $("#conteudo").css("display", "none");
        }
        else {
            $("#conteudoHome").css("display", "none");
            $("#conteudo").css("display", "block");
            $.get(site, function (data) {
                $("#conteudo").html(data);
            });
        }
        void (0);
        scroll(0, 0);
    }

Every page, for example Company.htm, has only one html of the container.

So when the user accesses the site like www.x.com.br/Empresa.htm, it does not matter the css and js of index, and loses all the formatting of the site.

I wanted to know how to make access to www.x.com.br/Empresa.htm, import all css and js.

And taking advantage of the question, I wanted to know if this type of site (not containing a complete structure for each page) compromises something of SEO, such as indexing google these things, because I read in some places that affect SEO. p>     

asked by anonymous 25.06.2014 / 14:37

1 answer

1

You can not "inherit" this structure with pure HTML. You'll need either some server-side mechanism (such as MasterPages , in C #), or the closest you get to the client side is using a Backbone.js style platform for your JavaScripts and something like @import of CSS for your styles.

On the Backbone, this is not a subject for this answer - if you want to know more, go to the official website and read about; on the @import of the CSS, you can make a /css/company.css sheet as follows:

@import url("main.css");

#conteudo {
    font-size: 16px
}

At the same folder level, the file main.css :

body {
    background-color: yellow;
}

Then refer to Company.htm as follows:

<!-- ... -->
<link rel="stylesheet" href="css/empresa.css">
<!-- ... -->
    
25.06.2014 / 14:58