+ Start a Discussion
Ram Shiva KumarRam Shiva Kumar 

Boot Strap Glyphicon s are not coming

HI iam tring to impemnt the glyphicon   by using the boot strap, iam getting only text  not getting the glyphicon . here is my code,

<apex:page   showHeader="false">

<html lang="en">

<head>
<!-- If you zip folder has subfolder for css -->
<link href="{!$Resource.sfdc}/css/bootstrap.min.css" rel="stylesheet"/>

</head>
<body>

<div class="container">
  <h2>Glyphicon Examples</h2>
  <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p>
  <p>Envelope icon as a link:
    <a href="#"><span class="glyphicon glyphicon-envelope"></span></a>
  </p>
  <p>Search icon: <span class="glyphicon glyphicon-search"></span></p>
  <p>Search icon on a button:
    <button type="button" class="btn btn-default">
      <span class="glyphicon glyphicon-search"></span> Search
    </button>
  </p>
  <p>Search icon on a styled button:
    <button type="button" class="btn btn-info">
      <span class="glyphicon glyphicon-search"></span> Search
    </button>
  </p>
  <p>Print icon: <span class="glyphicon glyphicon-print"></span></p>
  <p>Print icon on a styled link button:
    <a href="#" class="btn btn-success btn-lg">
      <span class="glyphicon glyphicon-print"></span> Print
    </a>
  </p>
</div>

</body>
</html>



</apex:page>

Please any body suggest me how to  use the Glyphicons in VF page from Boot strap.


Regards,
Siva.
Rahul SharmaRahul Sharma
Looks like there is some problem with your static resource file, works fine when I use CDN:
<apex:page   showHeader="false">

<html lang="en">

<head>
    <!-- changed following link to point at CDN -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>

</head>
<body>

<div class="container">
  <h2>Glyphicon Examples</h2>
  <p>Envelope icon: <span class="glyphicon glyphicon-envelope"></span></p>
  <p>Envelope icon as a link:
    <a href="#"><span class="glyphicon glyphicon-envelope"></span></a>
  </p>
  <p>Search icon: <span class="glyphicon glyphicon-search"></span></p>
  <p>Search icon on a button:
    <button type="button" class="btn btn-default">
      <span class="glyphicon glyphicon-search"></span> Search
    </button>
  </p>
  <p>Search icon on a styled button:
    <button type="button" class="btn btn-info">
      <span class="glyphicon glyphicon-search"></span> Search
    </button>
  </p>
  <p>Print icon: <span class="glyphicon glyphicon-print"></span></p>
  <p>Print icon on a styled link button:
    <a href="#" class="btn btn-success btn-lg">
      <span class="glyphicon glyphicon-print"></span> Print
    </a>
  </p>
</div>

</body>
</html>



</apex:page>