Can't add an favicon via an php include

Question

I am trying to add a favicon it works but not if i use an include to include my header in the code.

I tried with all ways to add the favicon. Also if i put it in the main code it perfectly works. I tried to hard link the favicon too didn't worked

So this is the main page

<!DOCTYPE html>
<!--Head-->
<head>
                <title>Accueil</title>
                <meta charset="utf-8">
                <meta name="viewport" content="width=device-width, initial-scale=1">

                <link rel="stylesheet" type="text/css" href="CSS/header-style.css">
                <link rel="stylesheet" type="text/css" href="CSS/style.css">
                <link rel="stylesheet" type="text/css" href="CSS/footer-style.css">
                <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
                <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
                <script src="myscripts.js"></script>

                <!--bootstrap-->
                <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.0/css/bootstrap.min.css" integrity="sha384-PDle/QlgIONtM1aqA2Qemk5gPOE7wFq8+Em+G/h$
                <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="$
                <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF8$
                <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.0/js/bootstrap.min.js" integrity="sha384-7aThvCh9TypR7fIc2HV4O/nFMVCBwyIUKL8XCtKE+8xgCgl/PQGuFsvSh$

</head>

<!--body-->
<body>

        <!-- HEADER -->
        <?php
                include 'inc/pages/header.php';
        ?>

        <!-- SLIDER -->
        <article class="slider">
                <div id="CarouselIndicatorsPictures" class="carousel slide" data-ride="carousel">
                  <ol class="carousel-indicators">
                        <li data-target="#CarouselIndicatorsPictures" data-slide-to="0" class="active"></li>
                        <li data-target="#CarouselIndicatorsPictures" data-slide-to="1"></li>
                        <li data-target="#CarouselIndicatorsPictures" data-slide-to="2"></li>
                  </ol>
                  <div class="carousel-inner">
                        <div class="carousel-item active">
                          <img class="carousel-item-img img-fluid center-block" src="inc/img/img1.jpg" alt="First slide">
                        </div>
                        <div class="carousel-item">
                          <img class="carousel-item-img img-fluid center-block" src="inc/img/img1.jpg" alt="Second slide">
                        </div>
                        <div class="carousel-item">
                          <img class="carousel-item-img img-fluid center-block" src="inc/img/img1.jpg" alt="Third slide">
                        </div>
                  </div>
                </div>
        </article>

        <!-- NEWSLETTER -->
        <article class="newsletter">
                <h4>Notre newsletter</h4>
                <p>Tu aimerais être tenu au courant de nos nouveauté ? Ne plus jamais rater nos soldes ? Avoir des réductions exclusive ?</p>
                <p>Alors inscris-toi vite à notre newsletter !</p>
                <form action="#" method="post" id="formNewsletter" class="row justify-content-center">
                        <input type="email" class="form-control" name="newsletter" placeholder="Inscris-toi et ne laisse plus jamais passer nos supers offres !">
                        <button type="submit" class="btn btn-info btn-arrow-right">Envoyer</button>
        </article>

        <!-- FOOTER -->
        <?php
                include 'inc/pages/footer.php';
        ?>

</body>



</html>

This is the header file (a bit shorted)

<header>
 <link rel="shortcut icon" href="favicon.ico">
        <div class="row">
                <div class="col">
                        <form class="form-inline form-search">
                                <input class="form-control mr-sm-2 search-btn" type="search" placeholder="Chercher..." aria-label="Search">
                                <button class="btn btn-outline-success my-2 my-sm-0 search-button" type="submit">Chercher</button>
                        </form>
                        <a href="Accueil.php" class="img-header-smallscreen"><img src="inc/img/logo.png" alt="logo" height="50px" width="70px"/></a>
                </div>

                <div class="col icon-bar">
                        <a href="loremipsum.php"><i class="fa fa-info"></i></a>
                        <a href="moncompte.php"><i class="fa fa-user"></i></a>
                        <a class="active" href="#"><i class="fa fa-heart"></i></a>
                        <a href="MyCart.php"><i class="fa fa-cart-plus"></i></a>
                </div>
        </div>
</header>

This is a lot of code i know a huge part is not really important.

I simply want it to show the favicon.

You need to add on head section if you add on head section then favicon is showing — Sajid Ijaz, Apr 09 '19 at 13:04
is the html code ( the one is included in php file ) is present after page load ? — Talal, Apr 09 '19 at 13:05
@poli second is path is not correct because in header file your directory is 'inc/pages/header.php'; but favicon i think is placed on root directory — Sajid Ijaz, Apr 09 '19 at 13:05
Your bootstrap code is cut off... was this a cut & paste accident or are these tags malformed? — scunliffe, Apr 09 '19 at 13:27

Moses Schwartz · Accepted Answer · 2019-04-09T13:22:36.653

1

The favicon belongs in the head section yours is in the header

See W3C Specifications

edited Apr 09 '19 at 13:22

answered Apr 09 '19 at 13:06

Moses Schwartz

2,857
1
20
32

i see so i can't use it in the header? – Poli Apr 09 '19 at 13:26
1

No, the `` tag is for all the content you want to define that isn't rendered in the body of the page (scripts, styles, character set, favicon, etc.). The new HTML5 `
` tag is for grouping content visually in the body that defines the "header" of your page.
– scunliffe Apr 09 '19 at 13:29
@Poli You can try to do it add it dynamically with JS, see this answer: https://stackoverflow.com/a/260876/5144943 – Moses Schwartz Apr 09 '19 at 13:33

score 0 · Answer 2 · answered Apr 09 '19 at 13:27

0

Put this favicon inside tag.Like this:

<head><link rel="shortcut icon" href="favicon.ico"></head>

answered Apr 09 '19 at 13:27

Ghazal Ehsan

87
4

He already has 1 `` , 2 heads on one document are invalid – Moses Schwartz Apr 09 '19 at 13:29
i know this is only sample. he has to copy his tag in head code – Ghazal Ehsan Apr 09 '19 at 13:34

Can't add an favicon via an php include

2 Answers2