Re: [gantry-joomla-user] please help me!!! How can I use cyrillic google fonts in gantry with joomla 2.5.

711 views
Skip to first unread message
Message has been deleted

Grant Preston

unread,
Jun 26, 2013, 1:02:59 AM6/26/13
to gantry-framework...@googlegroups.com
You can import the font to use on your site using css. this works for any Google Web Font. The file you want to create and add to your site if you haven't already done so would be a custom css file. Name it the same name as your template and add -custom.css at the end.

Example your template is called gantry then you name your file gantry-custom.css and then place it in your templates css directory. Joomla Root/templates/gantry/css/gantry-custom.css

Then visit google web fonts page and you will need to copy the code for importing that font. It's something like @import followed by the URL. Can't recall exact code off hand.

Then put in your custom css file what you want affected by that like

p  {font-family: 'cyrillic';}

You may or may not need the 's around the font name.

Any how that should do it.

On Jun 25, 2013, at 9:45 PM, Nikita Dubrovin <dubrovi...@gmail.com> wrote:

please help me!!! How can I use cyrillic google fonts in gantry with joomla 2.5.

what kind of php variable I should point and where?

I think that this is defined by file [joomla_root/libraries/gantry/features/fonts.php].

thank you in advance
your answer is very important for me

--
--
You received this message because you are subscribed to the Google
Groups "Gantry Framework for Joomla Users" group.
To post to this group, send email to
gantry-framework...@googlegroups.com
To unsubscribe from this group, send email to
gantry-framework-for-j...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/gantry-framework-for-joomla-users?hl=en
 
Gantry Framework Homepage: http://www.gantry-framework.org
 
---
You received this message because you are subscribed to the Google Groups "Gantry Framework for Joomla Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to gantry-framework-for-j...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

Luke Douglas

unread,
Jun 26, 2013, 8:13:41 PM6/26/13
to gantry-framework...@googlegroups.com
Nikita,

While I prefer to embed the fonts directly on the website because it makes for faster page load times as well as not having to 'depend' on another external service, Google does have some fonts that I prefer to use.  If you want to use the Google fonts, read this page and you'll be able to do it.

https://developers.google.com/fonts/docs/getting_started

Luke

Message has been deleted

Anatoliy Kirilenko

unread,
Jul 6, 2013, 5:21:26 PM7/6/13
to gantry-framework...@googlegroups.com
hi,


in "root/libraries/gantry/features/fonts.php" file somewhere on line 111 find this:

$variant = $variant ? $variant : '';

and change it to

$variant = $variant ? $variant : '&subset=latin,cyrillic';

now you will use google cyrillic fonts (if they have, some of them dont have, for example "yanone kaffeesatz" dont have cyrillic)

Best Wishes,
Anatoliy

Luke Douglas

unread,
Jul 6, 2013, 6:04:17 PM7/6/13
to gantry-framework...@googlegroups.com
This is a 'very bad' idea.  It is modifying core template files to achieve something that can be done using the '[template]-custom.css]' file.  If you modify the fonts.php file, and perform a Gantry update, it is conceivable that this file will be over-written with the update and all of your core hacks will be overwritten.

NEVER, EVER hack core files.  Period! Put it in stone!  Etch it across your forehead! Get a tattoo that says it!  NEVER, EVER hack core files!!!!!!

Luke
Message has been deleted

Anatoliy Kirilenko

unread,
Jul 6, 2013, 9:02:48 PM7/6/13
to gantry-framework...@googlegroups.com
you are right,
but you can put "font.php" in your template "features" folder, which will override gantry core file (but in every gantry update you need to check that file, if there are some changes).
so the best way i think is to add your google font, for example this:

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Cuprum&subset=latin,cyrillic' rel='stylesheet' type='text/css'>

in "index.php" before </head> tag (and to turn off gantry google font)

Best Regards,
Anatoliy

Luke Douglas

unread,
Jul 7, 2013, 1:53:06 AM7/7/13
to gantry-framework...@googlegroups.com
Nikita,

Here is part of my 'standard-styles.css' that I embed in my clients [template]-custom.css file that has the guide for embedding or importing fonts, and how to use them in your CSS sheets.

/*=================== Begin Font Embedding ============================*/
/*--------------------------- Compiled by Luke Douglas, Webbering.com ---------------------------------*/

/*
Tip: Using many font styles can slow down your webpage,
so only select the font styles that you actually need on your webpage.
*/

/* ----- Embed Local Fonts ----- */
/*
1) Download otf or ttf file from royalty free site
    a) http://www.dafont.com/
2) Convert otf or ttf file to webfonts via online converters
    a) http://convertfonts.com/
    b) http://www.fontsquirrel.com/tools/webfont-generator
    c) http://www.font2web.com/
3) If not created yet, create a 'fonts' directory in your template root directory
4) Copy the converted fonts (.eot, .woff, .ttf, .svg) into the 'fonts' directory
5) embed and use fonts as shown below but replace font name to the one you are using
*/

/* Use embedded fonts from 'fonts' directory */
@font-face {
    font-family: 'Shardee';
    src: url('../fonts/shardee.eot');
    src: url('../fonts/shardee.eot') format('embedded-opentype'),
         url('../fonts/shardee.woff') format('woff'),
         url('../fonts/shardee.ttf') format('truetype'),
         url('../fonts/shardee.svg#Shardee') format('svg');
}
/* Example: Using embedded font class styling */
.Shardee { color: #ffffff !important; }

/* ----- Embed External Google Fonts ----- */
/*
Go to http://www.google.com/fonts/ and get '@import' code
*/

/* Import Google font */
@import url(http://fonts.googleapis.com/css?family=Permanent+Marker);

/* Example: Using external Google font class styling */
.permanent-marker { font-family:'Permanent Marker', serif; }

/* ----- Embed External Font-Face.com Fonts ----- */
/*
Go to http://www.font-face.com/ and get '@font-face' code
*/

/* Import Font-Face.com fonts */
@font-face {
    font-family: DeliciousRoman;
    src: url(http://www.font-face.com/fonts/delicious/Delicious-Roman.otf);
    font-weight:400;
}

/* Example: Using external Font-Face font class styling */
.delicious-roman {font-family: DeliciousRoman, Helvetica, Arial, sans-serif;}

/*==================== End Font Embedding =============================*/

I hope this helps you as well as anyone else.  By having a standard guide, it makes adding fonts so much easier.  I really don't like having to think. LOL

Luke
Reply all
Reply to author
Forward
0 new messages