Version: 1.5.0 Joomla! 1.5 P

KC Cufón Font Replacement plugin Joomla! 1.5

There are a number of different solutions to display non-web based fonts on a website. Cufón is a JavaScript based solution that requires no flash or images. We have created a plugin that uses Cufón to display your fancy fonts.

We strongly suggest that you use an alternative method to display your fancy fonts as the Cufón software has not been updated in many years. We no longer provide support for this out-dated font replacement method. Using @font-face or Google font is a much better solution now.

 

The information presented below is only for the Joomla 1.5 version. The latest version information can be found here.

Description

Joomla! 1.5 Version

Cufón is a JavaScript alternative to the flash based sIFR method or image based FLIR method of replacing your web-based font with any font you have a TrueType (TTF), OpenType (OTF), Printer Font Binary (PFB) or PostScript font file for. (Please ensure that the font you use does not violate EULA and copyrights due to fonts being embedded in the website.)

The h1 & componentheading and h2 & contentheading CSS selectors are using Cufón on this website. The plugin will allow you to have up to six different fonts for different CSS selectors sets.

Change Log

1.5.0 - Feature additions:hoverable tags, text shadow and linear gradient, fixed problems with local host, window servers & non-root Joomla installations
1.4.0 - Upgraded to version 1.09i of Cufon Javscript file, add option to force Mootools to be loaded before the plugin, added 2 more font files for a total of 8 fonts
1.3.0 - Spanish language file added, removed a large font file so plugin would install on smaller hosting accounts
1.2.0 - Added the ability to have 6 fonts/selectors sets.
1.1.1 - Use DS for file delimiter and updated the documentation
1.1.0 - Added 1 more font/selector set for a total of 4 sets and documentation updated.

Requirements

PHP 5.0 or higher

Installation/Upgrading

Installation & Upgrade Instructions

Cufón Joomla! plugin parameters

Follow these instructions to install the plugin for the first time or to upgrade to a new version of the plugin.

  1. Login to the backend of your Joomla! site as an Administrator or Super Administrator
  2. Under the Extensions menu go to Install/Uninstall
  3. Click the Browse button in the Upload Package File box
  4. Find the plugin_kc_cufon x.x.x.zip file that you previously stored on your hard drive and click Open
  5. Click the Upload & Install button beside the Browse button
  6. The plugin will be installed
  7. Under the Extensions menu go to Plugin Manager
  8. Find the plugin_kc_cufon plugin and enable it, change Enabled: to Yes
  9. If you have a Google Analytics plugin installed position it after the kc_cufon plugin in the Plugin Manager list.

Usage

Usage Instructions

  1. Before changing the font files, make sure that Cufón is working with the default fonts. So, make sure the plugin is Enabled and the Number of Different Fonts is set to 2.
  2. Go to the frontend of your site and refresh it. You should now see your h1 and h2 tags in the Cufón fonts. If the Cufón fonts are showing continue on with the Usage Instructions, if they aren't you need to get this working before continuing, refer to the FAQ section.
  3. To use the plugin you just need to create your Cufón font file(s). Visit the Cufón generator to create your Cufón font file.
  4. Upload the font files to /plugins/system/kc_cufon/fonts folder.
  5. Then set the plugin parameters to use the font files and specify which selectors are to use those font files.
  6. You can set your CSS selectors for the fonts as you normally would using your normal CSS stylesheets.
  7. You must use a Strict doctype in order for Cufón to work in IE browsers. All Cufón-enabled pages must be UTF-8 encoded. Compatible encodings, such as US-ASCII, are also fine.
  8. Detail information and documentation about Cufón can be found at the Cufón site.

Download

Downloading the Plugin

The KC Cufón Font Replacement plugin is released under the GNU GPL license, please read and agree to these terms before downloading the software.

Download the Joomla! 1.5 plugin file.

FAQ

Troubleshooting

My custom font is not displaying, what could be wrong?

My custom font is not displaying, what could be wrong?

  1. Make sure that you have the Cufón plugin enabled.
  2. Did you change the 'Number of Different Fonts' pulldown menu item in the plugin Parameters to reflect the number of font/CSS selector sets you are using.
  3. Ensure that you have Mootools or another JavaScript framework enabled like JQuery (they need to be loaded before the Cufón plugin is loaded). If you are using Mootools, set the Load Mootools parameter to Yes to ensure that Mootools is loaded before the Cufón plugin.
  4. When you created the font file, did you limit the domains that the font file would work on? If so, did you include the current domain you are trying to get Cufón to work on. Make sure that you have the www version of the domain as well as the non www version in the list of allowed domains.
  5. Have you made sure that you are using a Strict doctype and that all cufón-enabled pages are UTF-8 encoded. Compatible encodings, such as US-ASCII, are also fine. Quirks mode isn’t supported but might also work in some cases.
  6. Running Cufón on a localhost does not work in most cases, you have to use it on a web hosting environment.

Read about known bugs and issues of Cufón.

What Browsers are supported?

What Browsers are supported?

Find the list of supported browsers.

How do I style my Cufón CSS selectors?

How do I style my Cufón CSS selectors?

Find detailed information on Cufón styling. To apply special styling to Cufón-enabled elements use:
.cufon-active <CSS selector>

How can I specify a CSS selector with a class or id?

How can I specify a CSS selector with a class or id?

You can use any CSS selector to specify what text should be replaced. For example you could use: p.readmore which would change all paragraphs that have a class of readmore. If you want the links to also be changed to the Cufón font, then set the parameter: 'Set the selectors for font 1 links to be hoverable.' to Yes, for that Font/Selector group. If you wanted all of your h1 tags and the text in your header to be changed to a Cufón font and assuming that the header is wrapped in a div tag with an id of header you would use: h1,#header for your CSS selector.

How can I make my menu items use my Cufón font?

How can I make my menu items use my Cufón font?

You just need to specify the CSS selector that uniquely identifies your menu items. For example, if you wanted your top nav menu to use a Cufón font and it was wrapped in a div tag with an id of topnav, then your CSS selector would be #topnav. Be sure to set the parameter 'Set the selectors for font 1 links to be hoverable.' to Yes for this selector.

How do I specify text shadows?

How do I specify text shadows?

Text shadows are specified using normal CSS format. See: http://www.w3.org/Style/Examples/007/text-shadow.en.html. In the plugin parameters text input box for text shadow you would enter what comes after the 'text-shadow:' part of the definition. For example:

-1px 0 black, 0 1px black

How do I specify linear gradients?

How do I specify linear gradients?

Color linear gradients are specifed with the starting color going to an ending color. The simples would be to specify 2 colors, but you can get more complex and specify multiple colors and strengths. In the plugin parameters text input box for Linear Gradient you would enter for example:

red, 0.2=#fff, 0.8=#23d559, rgb(0, 0, 0)

Suport

Support

Please see our Support Forum to for help. This extension is no longer supported due to being out-dated method of font replacement.

Joomla! & WordPress Hosts

Liquid Web is our recommended web hosting provider for Joomla! & WordPress websites. This is the host that we use for websites that we build. Liquid Web has an excellent reputation, fast servers and most importantly awesome service! They have technicians that are familiar with Joomla! & WordPress. Their technicians go above and beyond what other hosting providers do, in our opinion.

  

Liquid Web Managed Word Press  

Support Development

Please consider a small donation to support development of the extensions on this site.



Joomla! Login

This is the normal Joomla! login module not the VirtueMart login module. Click the 'Create an account' button to see how you are redirected to the VirtueMart registration form when the KC VM Registration Redirect plugin is enabled.

Joomla! & WordPress Web Design and Development

If you are interested in having a website designed or redesign or need custom Joomla! or WordPress development, please visit Keashly.ca Consulting to view our Portfolio of Joomla! & WordPress website work.

Trademarks and logos remain the property of their respective organizations.
The Joomla!® name is used under a limited license from Open Source Matters in the United States and other countries.
Keashly.ca Consulting is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Site Map Back to Top