1

I'm a Joomla beginner, and I'm creating a personal website using Bootstrap 3 and Joomla! 3.3. I saw something about Glyphicons not work with the custom B3. [I used the Customizer]

My template has the following structure:

template/
 - css/ bootstrap.css | template.css | screen.css
 - fonts/ glyphicons-halflings-regular.eot | glyphicons-halflings-regular.svg
          glyphicons-halflings-regular.ttf | glyphicons-halflings-regular.woff  
 - images/ logo.png
 - js/ boostrap.js  
 - component.php
 - favicon.ico
 - index.html
 - index.php
 - template_thumbnail.png
 - template_preview.png
 - templateDetails.xml

In bootstrap.css file, @font-face looks like this:

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

The default Bootstrap version loaded is 2.3.2 in Joomla!3.3, but I'm using the Bootstrap version 3 loaded this way:

?php defined('_JEXEC') or die;

$doc = JFactory::getDocument();
$doc->addStyleSheet('templates/' . $this->template . '/css/bootstrap.css');
$doc->addScript('/templates/' . $this->template . '/js/bootstrap.js', 'text/javascript');
?>

What is wrong?

  • 1
    Are you importing the bootstrap css file correctly? How are you importing the Bootstrap css file? How are you trying to embed a glyphicon? Please show some code – Lodder Aug 31 '14 at 17:13
  • 1
    When you call an icon, does your page throw up an error (check the console). Sometimes it can be as simple as a path issue and you'll see a message about a file not being found. – Brian Peat Aug 31 '14 at 23:50
  • @Lodder, I trying use the bootstrap 3. I know that Joomla!3.3 don't work with <link rel=...> within the <head> tag. In this case, how is the correct way to load this files[css & js]? As above? – prleoassis Sep 1 '14 at 16:27
  • @BrianPeat, the most basic icons to be loaded, such as print and mail in component are not loaded. – prleoassis Sep 1 '14 at 16:32
  • 1
    Where is the code of implementing glyphicon ? please add that so we can figure out. – subashbasnet8 Feb 6 '15 at 9:56
1

The question doesn't make clear if you load bootstrap 2 and bootstrap 3 at the same time, and also it's not clear how you try to use glyphicons in your code. The right (and working) way is for example:

<span class="glyphicon glyphicon-ok"></span>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.