German Characters Problem (öäüß)
-
-
- Khalid Ghazi
- Newbie
- Posts: 17
- Thanks: 0
-
Hey everybody,
any idea why the formatting of the typical German characters (öäüß) is bold? Any solution to this issue?
I am using the standard font of the Gantry-based Stratos Template on Joomla 3.1.5.
See the attached screenshot for more details!
Thank you.
-
-
-
- Who?
- Preeminent Rocketeer
- Posts: 25562
- Thanks: 613
- Joomla freelancer
- That font by default doesn't contain German characters so they are using fallback font which actually contains them. You will have to use some other font that has support for German umlauts included
- Check my services at: Mihha-Vision
-
-
-
- Khalid Ghazi
- Newbie
- Posts: 17
- Thanks: 0
-
Hey Igor,
Thank you for this clarifiction.
One more question, if you mind.
The Stratos template uses the Ubunto font by default which is really nice and clean and much better than an other regular font. What about the Bootstrap Awesome font included in the fonts folder? Does it support German characters? If yes, how can I use it instead? If not, are there any Bootsrap-based fonts which support German characters and can be used with the Stratos template?
I appreciate your assistance.
Thank you in advance.
-
-
-
- prim
- Preeminent Rocketeer
- Posts: 17290
- Thanks: 217
-
Read 1-7 here:
www.rockettheme.com/forum/index.php?f=39..._v=viewtopic#p797571
The CSS file should be named rt_stratos-custom.css (if that's your template) and put it in the css directory. - Please reply with a direct link to the issue & create a new thread for each new issue.
A template is only as good as the content that goes into it
- DanG
-
-
-
- Khalid Ghazi
- Newbie
- Posts: 17
- Thanks: 0
-
Hey prim,
thank you for the link to the tutorial.
I followed your instructions step by step, but for any reason the new font (Caviar) won't load. The css file "rt_stratos-custom.css" itself is loaded instead. All the fonts have a German subset and are located in "../templates/rt_stratos/fonts".
This what I put in the "rt_stratos-custom.css" (UTF-
@font-face {
font-family: 'caviar_dreamsbold';
src: url('../fonts/Caviar_Dreams_Bold-webfont.eot');
src: url('../fonts/Caviar_Dreams_Bold-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/Caviar_Dreams_Bold-webfont.woff') format('woff'),
url('../fonts/Caviar_Dreams_Bold-webfont.ttf') format('truetype'),
url('../fonts/Caviar_Dreams_Bold-webfont.svg#caviar_dreamsbold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'caviar_dreamsbold_italic';
src: url('../fonts/CaviarDreams_BoldItalic-webfont.eot');
src: url('../fonts/CaviarDreams_BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/CaviarDreams_BoldItalic-webfont.woff') format('woff'),
url('../fonts/CaviarDreams_BoldItalic-webfont.ttf') format('truetype'),
url('../fonts/CaviarDreams_BoldItalic-webfont.svg#caviar_dreamsbold_italic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'caviar_dreamsitalic';
src: url('../fonts/CaviarDreams_Italic-webfont.eot');
src: url('../fonts/CaviarDreams_Italic-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/CaviarDreams_Italic-webfont.woff') format('woff'),
url('../fonts/CaviarDreams_Italic-webfont.ttf') format('truetype'),
url('../fonts/CaviarDreams_Italic-webfont.svg#caviar_dreamsitalic') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'caviar_dreamsregular';
src: url('../fonts/CaviarDreams-webfont.eot');
src: url('../fonts/CaviarDreams-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/CaviarDreams-webfont.woff') format('woff'),
url('../fonts/CaviarDreams-webfont.ttf') format('truetype'),
url('../fonts/CaviarDreams-webfont.svg#caviar_dreamsregular') format('svg');
font-weight: normal;
font-style: normal;
}
The customcss.php (UTF- looks like this and is located in "/templates/rt_stratos/features":
<?php
/**
* @package Custom Feature (Add custom CSS file) - RocketTheme
* @version April 1, 2012
* @author RocketTheme www.rockettheme.com
* @copyright Copyright (C) 2007 - 2012 RocketTheme, LLC
* @license www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 only
*
*
*/
defined('JPATH_BASE') or die();
gantry_import('core.gantryfeature');
class GantryFeatureCustomCSS extends GantryFeature {
var $_feature_name = 'customcss';
function isEnabled() {
return true;
}
function isInPosition($position) {
return false;
}
function init() {
global $gantry;
// This makes Gantry load our custom.css
$gantry->addStyle("rt_stratos-custom.css");
}
}
Notice that I modified
$gantry->addStyle("custom.css");
to
$gantry->addStyle("rt_stratos-custom.css");
in customcss.php.
I also cleared the browser as well as the joomla cache. But NO CHANGE takes effect.
Would you please help me further.
This the link to my project website:
www.bochumer-moscheen.de/jcms/
Thanks a lot.
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
you need to assign the fontfamily to some elements like
html body > * {
font-family: "caviar_dreamsregular", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
#rt-mainbody h2 {
font-family: "caviar_dreamsbold", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
Little note: the php-feature you added is not needed at all ...
-
-
-
- prim
- Preeminent Rocketeer
- Posts: 17290
- Thanks: 217
-
As Henning noted, the PHP stuff is not needed because Gantry has this feature built-in now.
The template is rather old, that's why i said you should only do steps 1 to 7 in that tutorial
- Please reply with a direct link to the issue & create a new thread for each new issue.
A template is only as good as the content that goes into it - DanG
-
-
-
- Khalid Ghazi
- Newbie
- Posts: 17
- Thanks: 0
-
Ok, now I understand what I need to do. I have to declare all those font-related classes in the customized css file so that Gantry can load them instead. My question, however, is how can I find what all those css classes are called. In other words, from which less/css file is Gantry loading the default font-related classes and styles. I need to find all those classes so that I can override them with my customized "rt_stratos-custom.css".
@Henning
I have just tested
html body > * {
font-family: "caviar_dreamsregular", "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}
and this works fine.
Thank you guys.
-
-
-
- Henning
- Preeminent Rocketeer
- Posts: 29362
- Thanks: 954
- Volunteer
-
My question, however, is how can I find what all those css classes are called. In other words, from which less/css file is Gantry loading the default font-related classes and styles. I need to find all those classes so that I can override them with my customized "rt_stratos-custom.css
Answer:
Firebug or devtools of your choice ...
see also
www.rockettheme.com/blog/coding/1767-bas...omizing-with-lesscss
-
-
-
- Khalid Ghazi
- Newbie
- Posts: 17
- Thanks: 0
-
Hey Henning,
After doing some css experiments, I have found out that the file "variables.less" located in "/templates/rt_stratos/less" is where the font family is globally declared. If you change the font family declaration there, it will have a global effect on the whole website. I know, this might be a radical way of doing things (if we take into consideration the possible template updates); but for me it is the quickest way to reach the the effect desired. Otherwise I would have to firebug evey single font-related css declaration and modify it in the customized css file. This would be a tidious job for me, given the fact that I am not developer or a coder.
Maybe somebody would find this helpful in getting rid of the problem related to the special German charachters (öäüß) when using to the default font (Ubuntu) delivered with the Stratos template. My new font is called Cantarell and support German charachters. It is found here:
www.fontsquirrel.com/fonts/Cantarell?q=cantarell
Thanks to the Rocketers Igor, prim and Henning for their valuable assistance. - Last Edit: 11 years 3 months ago by Khalid Ghazi.
-
Time to create page: 0.057 seconds