1. 417Diver
  2. Commercial Templates
  3. Tuesday, 12 March 2013
  4.  Subscribe via email
I was searching through the forums and didnt notice a how to on inserting new google fonts using http://www.google.com/webfonts#

I want to add them to the drop down list on the evolution black template in the logo tab.
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Steven

The list of Google fonts available for your templates are stored in your templates googlefonts.php (../templates/j51_yourtemplate/elements/googlefonts.php).

Simply add to the list already in place using the following format..

$googleFonts['FontName'] = 'FontName';


Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Exactly what I was looking for.
For everyone else that wanted to do this here is an example.

Go to http://www.google.com/webfonts# pick your font you like and to the right click the add to collection (blue button).

Then at the bottom click use.

Towards the bottom you will see integrate the fonts into your CSS.

http://missouriairparks.com/images/integrate.png

IE font-family: 'Merriweather Sans', sans-serif;

You take the
$googleFonts['FontName'] = 'FontName';
and add it into the correct location of the list on a new line under (../templates/j51_yourtemplate/elements/googlefonts.php).

When you have
$googleFonts['FontName'] = 'FontName';
pasted to the file you will need to add the Merriweather Sans like this
$googleFonts['Merriweather Sans, sans-serif'] = 'Merriweather Sans';


Hope this helps everyone else.
  1. more than a month ago
  2. Commercial Templates
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Very cool & this should be a sticky post. I don't need it right now, but a very good reference.

;) ~Kat
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
Edited the howto so its easier to read. :laugh:
  1. more than a month ago
  2. Commercial Templates
  3. # 4
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

I would like to Open Sans font and other add Polish characters (ąółźć etc.) How do I edit the file googlefont.php or another to implement a different encoding.
Normally, it should do so:

<link href='http://fonts.googleapis.com/css?family=Lato|Open+Sans&;subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic' rel = 'stylesheet' type = 'text / css'>


Thanks
  1. more than a month ago
  2. Commercial Templates
  3. # 5
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

In your templates styles.php (../templates/[YourTemplate]/php/styles.php) you will see where your google font is been loaded (starting from approx. line 44). Within this code you will see various instances of the following which loads the font...


<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=<?php echo $hornav_fontstyle ?>" />


You can edit these to include all the characters available for that font by replacing this with something like the following...


<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=<?php echo $hornav_fontstyle ?>&subset=latin,cyrillic-ext,greek-ext,greek,vietnamese,latin-ext,cyrillic" />


Hope this helps?

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 6
Accepted Answer Pending Moderation
0
Votes
Undo
Hello,
The problem has been resolved. I added code in the right place and everything is OK. If possible it is good if it could be the admin panel select the encoding of the font, then you can get rid of problems with the encoding of fonts. Thank you for your help.
  1. more than a month ago
  2. Commercial Templates
  3. # 7
Accepted Answer Pending Moderation
0
Votes
Undo
I am looking for the basic "Courier New" or similar font but Google Fonts - surprisingly - doesn't have anything close to it.

Can you please make a suggest? Or how can I change the module, article and other headings to Courier New??

I'm surprised Google Fonts doesn't have anything close to it ... it's such a basic, global, old skool font.

Suggestions?
  1. more than a month ago
  2. Commercial Templates
  3. # 8
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Your best option would be to simply use 'Courier New'. For which area of the template would you like to use this font. To set this as your default font simply add the following to the Custom CSS field of your templates parameters..


body {
font-family: "Courier New", Courier, monospace;
}


Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 9
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

For the top-2 module positions you can use something like the following...


.top-2 {
font-family: "Courier New", Courier, monospace !important;
}


You can add this to the Custom CSS field of your templates parameters (Extensions -> Template Manager -> [YourTemplate] -> Custom CSS.

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 10
Accepted Answer Pending Moderation
0
Votes
Undo
Hello,

I want to have google font "Bad Script" for the text in header-2 position, in Cyrillic.
So I added $googleFonts['Bad+Script'] = 'Bad Script'; to /elements/googlefonts.php
and then added a custom css

.header-2 {
font-family: 'Bad Script', cursive !important;
}

and nothing happens.
The Google Subset Info is set to Cyrillic.

2. and another question
How can I add some fonts wich I have in my folder and use them with some modules text?

The template is Ashley.
  1. more than a month ago
  2. Commercial Templates
  3. # 11
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

1. Add the following to the already existing list of font in your googlefonts.php...


$googleFonts['Bad+Script'] = 'Bad Script';


Would you have a URL to an example of your header-2 text?

2. May I suggest the following forum post on this query... http://www.joomla51.com/forum/8-commercial-templates/7277-change-fonts#18921

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 12
Accepted Answer Pending Moderation
0
Votes
Undo
1. I added exactly the same code to my googlefonts.php
screenshot:
http://share.bgyoga.com/internet/fonts.jpg

The domain of hte header is bgyoga.com
  1. more than a month ago
  2. Commercial Templates
  3. # 13
Accepted Answer Pending Moderation
0
Votes
Undo
Thank you

The Google font will only load if it is selected within one of the fields of the templates parameters. If this is not the case try importing the font via CSS instead (Custom CSS field)...


@import url(https://fonts.googleapis.com/css?family=Bad+Script);
.header-2 {
font-family: 'Bad Script', cursive !important;
}


Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 14
Accepted Answer Pending Moderation
0
Votes
Undo
I tried this, but no success...
  1. more than a month ago
  2. Commercial Templates
  3. # 15
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

May I suggest sending temporary administration access to your Joomla installation to info@joomla51.com and we will examine this issue further. For our reference please paste a link to this post in your email.

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 16
Accepted Answer Pending Moderation
0
Votes
Undo
Thank you Ivbogo

Your 'Bad Script' font should be now displaying correctly. Your editor had set an inline font in your test module which was overriding the font set in the Custom CSS.

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 17
Accepted Answer Pending Moderation
0
Votes
Undo
Unfortunately, still not.

On the screenshot it is still not Bad Scrip font... What am I missing? :)

http://share.bgyoga.com/internet/header-2.jpg
  1. more than a month ago
  2. Commercial Templates
  3. # 18
Accepted Answer Pending Moderation
0
Votes
Undo
My apologies..

I have added the following to the Custom Code fields which appears to have done the trick...


<link href='https://fonts.googleapis.com/css?family=Bad+Script&;subset=latin,cyrillic' rel='stylesheet' type='text/css'> 


Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 19
Accepted Answer Pending Moderation
0
Votes
Undo
Now it IS WORKING! :)

Thank you for your time and effort.
  1. more than a month ago
  2. Commercial Templates
  3. # 20
  • Page :
  • 1
  • 2


There are no replies made for this post yet.
Be one of the first to reply to this post!