0

The email/print icons on an article shows up as text instead of graphics (the cog is an "8", e-mail shows as "ME-mail" or the print icon as a square "[]Print"). Obviously some font is not loading correctly.

How can I find out what's wrong?

Running Joomla 3.6.2 with Joostrap Ripped template.

  • These icons should be coming from the IcoMoon fontset. Can you inspect the element (Firebug, Chrome Dev tools, etc) and see if this is being overridden by anything? – Lodder Sep 5 '16 at 18:01
  • What do you mean by "overridden"? If I "inspect" the <span class="icon-cog"> there is no font-family=icomoon specified at all. (Looking at computed, which should show all, right? – thoni56 Sep 6 '16 at 10:29
  • Hmm, well this template is $49 which covers forum support, so I'd suggest posting on their forum as it's their issue. it's very hard to tell without seeing a live preview of the site (and being logged in). They appear to use Font Awesome so perhaps they haven't mapped the CSS classes correctly – Lodder Sep 6 '16 at 10:34
  • I have posted but with no response as of now. And I was hoping to learn something for myself over here. BTW, page example is events.responsive.se/events/index.php/devlin2016/… – thoni56 Sep 6 '16 at 10:49
  • The icons are showing perfectly fine for me. Please try clearing your Joomla and browser cache – Lodder Sep 6 '16 at 12:57
0

The template had neither mapped the CSS classes for icons correctly nor included the Icomoon font CSS.

Through the support of Joostrap I added the following to the beginning of template/<name>/index.php:

$doc = JFactory::getDocument();
$doc->addStyleSheet($this->baseurl.'/media/jui/css/icomoon.css');

So that the beginning of it reads:

<?php
/**
 * @package     Joostrap.Template
 * @subpackage  Joostrap v3.1.6
 *
 * @copyright   Copyright (C) 2005 - 2014 Joostrap. All rights reserved.
 * @license     GNU General Public License version 2 or later; see LICENSE.txt
 */
defined('_JEXEC') or die;
require_once __DIR__ . '/functions/tpl-init.php';

$doc = JFactory::getDocument();
$doc->addStyleSheet($this->baseurl.'/media/jui/css/icomoon.css');

?>

You can also read about this in the Joomla docs, which says exactly this:

To include the Icomoon fonts in your template you will have to add the css
stylesheet (/media/jui/css/icomoon.css) or include it in your .less file
when you generate the .css stylesheet(s).

$doc = JFactory::getDocument();
$doc->addStyleSheet($this->baseurl.'/media/jui/css/icomoon.css');
|improve this answer|||||

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.