Problem with FontAwesome, I do not recognize any icon

1

I'm using bootstrap but I've been trying to add FontAwesome for a while and it will not let me do the one that puts me on the page for a while now

<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/solid.js" integrity="sha384-+Ga2s7YBbhOD6nie0DzrZpJes+b2K1xkpKxTFFcx59QmVPaSA8c7pycsNaFwUK6l" crossorigin="anonymous"></script>
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/fontawesome.js" integrity="sha384-7ox8Q2yzO/uWircfojVuCQOZl+ZZBg2D2J5nkpLqzH1HY0C1dHlTKIbpRz/LG23c" crossorigin="anonymous"></script>

in the header and when placing any icon in the body, for example

<i class="fab fa-apple"></i>      

and I do not get anything.

I've tried it on the page I'm doing and nothing and try from a practically virgin file and still do nothing.

    
asked by Victor Escalona 18.03.2018 в 00:59
source

3 answers

5

The problem is that you are not importing Font Awesome brands .

Since version 5 it was divided into "brands", "solid" and "regular" for its free version

The solution is to import the script with the icons of "brands" https://use.fontawesome.com/releases/v5.0.8/js/brands.js , apart from the icons that you want to use, whether they are "regular" or "solid"

<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/brands.js" integrity="sha384-sCI3dTBIJuqT6AwL++zH7qL8ZdKaHpxU43dDt9SyOzimtQ9eyRhkG3B7KMl6AO19" crossorigin="anonymous"></script>
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/fontawesome.js" integrity="sha384-7ox8Q2yzO/uWircfojVuCQOZl+ZZBg2D2J5nkpLqzH1HY0C1dHlTKIbpRz/LG23c" crossorigin="anonymous"></script>
<i class="fab fa-apple"></i>

Another option is to import all Font Awesome https://use.fontawesome.com/releases/v5.0.8/js/all.js , which I do not recommend unless the use of the icons in your application justifies it.

<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js" integrity="sha384-SlE991lGASHoBfWbelyBPLsUlwY1GwNDJo3jSJO04KZ33K2bwfV9YBauFfnzvynJ" crossorigin="anonymous"></script>
<i class="fab fa-apple"></i>
    
answered by 18.03.2018 / 02:14
source
1

I tried and it worked like this

I hope it works for you:)

  <script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js" integrity="sha384-SlE991lGASHoBfWbelyBPLsUlwY1GwNDJo3jSJO04KZ33K2bwfV9YBauFfnzvynJ" crossorigin="anonymous"></script>

Link this url and for example use this like this

 <h1><i class="fab fa-apple"></i>Hola soy una manzana</h1>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" media="screen" href="main.css" />
    <!-- <script src="main.js"></script> -->
    <script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js" integrity="sha384-SlE991lGASHoBfWbelyBPLsUlwY1GwNDJo3jSJO04KZ33K2bwfV9YBauFfnzvynJ" crossorigin="anonymous"></script>
</head>
<body>
    <h1><i class="fab fa-apple"></i>Hola soy una manzana</h1>
</body>
</html>
    
answered by 18.03.2018 в 01:24
1

Another answer: I hope it also serves you.

    <!DOCTYPE html>
<html>
<head>
  <script defer src="https://use.fontawesome.com/releases/v5.0.4/js/all.js"></script>
  <script defer src="https://use.fontawesome.com/releases/v5.0.4/js/v4-shims.js"></script> 
<script defer src="https://use.fontawesome.com/releases/v5.0.4/js/fontawesome.js"> </script>

</head>
<body>
  <!-- "close" is an alias to "times", V5 is <i class="fa fa-times"></i> -->
  <i class="fa fa-close"></i>

  <!-- Renamed to "image", V5 is <i class="fa fa-image"></i> -->
  <i class="fa fa-picture"></i>

  <!-- Needs the "fab" prefix, V5 <i class="fab fa-twitter"></i> -->
  <i class="fa fa-twitter"></i>

  <!-- "far" prefix, lose the "-o", V5 <i class="far fa-circle"></i> -->
  <i class="fa fa-circle-o"></i>

    <i class="fab fa-apple"></i>   
</body>
</html>
    
answered by 18.03.2018 в 04:29