Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

link subscrevendo

Bom dia, estou com um problema de conflito de estilos, criei um rodape em um outro arquivo e ai quando dou um 'require_once' pro meu index, o estilo se sobscreve e a pagina até perde varias funções, o arquivo do rodape é o seguinte: `

<head>
    <link rel="stylesheet" id="compiled.css-css"
        href="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/css/compiled-4.19.1.min.css?ver=4.19.1"
        type="text/css" media="all">
</head>


<body>
    <footer class="page-footer font-small special-color-dark pt-4">

    ....

    </footer>
</body>
```

E o index no qual estou tentando colocar ele é:

<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="utf-8">
    <meta http -equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.16.0/dist/bootstrap-table.min.css">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>

<body id="body">
    <div class="table responsive">
        <div class="container">
            <table id="tabela_dividas"><br>
                <?php
                if (is_admin()) { ?>
                    <h2>Gerar dividas</h2>
                    <p><button type="button" class="btn btn-danger" onclick="abriModalDividas()">
                            Gerar Divida
                        </button></p>
                    <thead>
                        <tr>
                            <th scope="col" data-field="id_cad" data-visible="false"></th>
                            <th scope="col" data-field="divida" data-checkbox="true"></th>
                            <th scope="col" data-field="nome">Nome</th>
                            <th scope="col" data-field="cpf">CPF ou CNPJ</th>
                            <th scope="col" data-field="tipo_negocio">tipo de negocio</th>
                        </tr>
                    </thead>
                <?php } else { ?>
                    <h2>Dividas</h2>
                    <p><button type="button" class="btn btn-danger" onclick="abriModalDividas()">
                            Negociar dividas
                        </button></p>
                    <thead>
                        <tr>
                            <th scope="col" data-field="id_dividas" data-visible="false"></th>
                            <th scope="col" data-field="divida" data-checkbox="true"></th>
                            <th scope="col" data-field="nome">Nome</th>
                            <th scope="col" data-field="tipo_divida">Tipo de dividas</th>
                            <th scope="col" data-field="valor">Valor</th>
                            <th scope="col" data-field="status">Status</th>
                        </tr>
                    </thead>
                <?php
                }
                ?>

            </table>
        </div>
    </div>


    <script src="https://code.jquery.com/jquery-3.5.0.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script src="https://unpkg.com/bootstrap-table@1.16.0/dist/bootstrap-table.min.js"></script>
    <script src="jQuery-Mask-Plugin-master/src/jquery.mask.js"></script>
    <script src="tata-master/dist/tata.js"></script>

    <?php require_once 'rodape.html'?>
</body>

Como consigo resolver isso? Imagino que deve haver algum jeito de isolar esse link que está chegando do rodape pra um não sobscrever o outro ou sla oque.

1 resposta
solução!

Boa tarde, Matheus.

Veja bem, o require importa todo o conteúdo do arquivo que você discriminou no comando. E, como o seu arquivo rodape.html que você postou primeiramente possui as tags HTML <head>, <body> e um link para folha estilo próprias, e a página index tem também essas tags, pode haver essa confusão aí.

Se você entrar no código fonte pelo navegador verá um resultado parecido com esse:

<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="utf-8">
    <meta http -equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.16.0/dist/bootstrap-table.min.css">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>

<body id="body">
    <div class="table responsive">
        <div class="container">
            <table id="tabela_dividas"><br>
                <?php
                if (is_admin()) { ?>
                    <h2>Gerar dividas</h2>
                    <p><button type="button" class="btn btn-danger" onclick="abriModalDividas()">
                            Gerar Divida
                        </button></p>
                    <thead>
                        <tr>
                            <th scope="col" data-field="id_cad" data-visible="false"></th>
                            <th scope="col" data-field="divida" data-checkbox="true"></th>
                            <th scope="col" data-field="nome">Nome</th>
                            <th scope="col" data-field="cpf">CPF ou CNPJ</th>
                            <th scope="col" data-field="tipo_negocio">tipo de negocio</th>
                        </tr>
                    </thead>
                <?php } else { ?>
                    <h2>Dividas</h2>
                    <p><button type="button" class="btn btn-danger" onclick="abriModalDividas()">
                            Negociar dividas
                        </button></p>
                    <thead>
                        <tr>
                            <th scope="col" data-field="id_dividas" data-visible="false"></th>
                            <th scope="col" data-field="divida" data-checkbox="true"></th>
                            <th scope="col" data-field="nome">Nome</th>
                            <th scope="col" data-field="tipo_divida">Tipo de dividas</th>
                            <th scope="col" data-field="valor">Valor</th>
                            <th scope="col" data-field="status">Status</th>
                        </tr>
                    </thead>
                <?php
                }
                ?>

            </table>
        </div>
    </div>


    <script src="https://code.jquery.com/jquery-3.5.0.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
    <script src="https://unpkg.com/bootstrap-table@1.16.0/dist/bootstrap-table.min.js"></script>
    <script src="jQuery-Mask-Plugin-master/src/jquery.mask.js"></script>
    <script src="tata-master/dist/tata.js"></script>

<!-- o início do arquivo importado -->
    <head>
    <link rel="stylesheet" id="compiled.css-css"
        href="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/css/compiled-4.19.1.min.css?ver=4.19.1"
        type="text/css" media="all">
</head>


<body>
    <footer class="page-footer font-small special-color-dark pt-4">

    ....

    </footer>
</body>
<!-- o fim do arquivo importado -->
</body>

Entendeu? É apropriado que uma página HTML tenha apenas uma tag <head>, uma <body>, etc.

Talvez se no arquivo constar apenas o seguinte, resolva o seu problema:

    <footer class="page-footer font-small special-color-dark pt-4">

    ....

    </footer>

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software