Changing colors using <script> tags

43 views
Skip to first unread message

Joep Sloot

unread,
Jan 6, 2012, 3:01:01 PM1/6/12
to cufón
Hi everyone,

I'm quite new to Joomla and just started using Cufon for a custom font
for the menu items in my main menu.
The font is set, but I'm having trouble changing the text color of
'hover' links and all active links.
By default, the text color for links is set to white and I don't want
to change that.
I want to customize the color of the menu items only.

The styling page on github.com says I have to include the following
code 'before the JavaScript files':
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="cufon-yui.js"></script>
<script type="text/javascript" src="Vegur_400.font.js"></script>
My question is, in what file should I include this code?

Another question: can I use normal CSS (color:#FF366F;) to refer to
the colors in my template's CSS file?
Or should I use the following code (and if so, in what file should it
be included?):
Cufon.replace('h1', {
color: '-linear-gradient(white, black)'
});

Thanks in advance for your answers!

Simo Kinnunen

unread,
Jan 6, 2012, 7:47:02 PM1/6/12
to cu...@googlegroups.com
Hi,

The color property works as long as you're using things supported by regular CSS. For gradients you'll need the replace call.

As for which files you are supposed to use, I don't know. You have the freedom to use any file you like. Therefore, you should probably get more familiar with Joomla and find out where the "correct" files are.

Also note that the code you posted is just an example, your own files may differ.

Simo

> --
> You received this message because you are subscribed to the Google Groups "cufón" group.
> To post to this group, send email to cu...@googlegroups.com.
> To unsubscribe from this group, send email to cufon+un...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/cufon?hl=en.
>

Joep Sloot

unread,
Jan 7, 2012, 2:41:52 AM1/7/12
to cufón
So, what you're saying is that normal CSS commands should work?
But what about the JavaScript call, do I have to use that?

Simo Kinnunen

unread,
Jan 7, 2012, 2:50:44 AM1/7/12
to cu...@googlegroups.com
Hi,

Usually, yes. There are sometimes exceptions, one of which I mentioned in the previous message.

You always have to have a replace call, otherwise Cufón doesn't know what to replace. If you are having a hard time integrating this into Joomla, perhaps following our documentation and constructing a basic example first would make it easier.

There may also be a plugin for Joomla, although if there is it will be a 3rd party one and therefore I cannot give any guarantees about functionality or ease of use.

Simo

Joep Sloot

unread,
Jan 7, 2012, 7:03:14 AM1/7/12
to cufón
Okay, the color of the active links is now set (with simple CSS
commands).
Now I'd like to insert the :hover code to enable hovered links, github
says it's this piece of code:
Cufon.replace('h1', {
hover: true
});
Do you happen to know if this should be put in index.php or one of the
CSS files?

Simo Kinnunen

unread,
Jan 7, 2012, 7:06:58 AM1/7/12
to cu...@googlegroups.com
Hi,

JavaScript code does not go into CSS files :)

Simo

Joep Sloot

unread,
Jan 7, 2012, 9:42:35 AM1/7/12
to cufón
I guess I'm going to put it in the index.php file then :)
Thanks a lot for your help!

Joep Sloot

unread,
Jan 7, 2012, 2:58:07 AM1/7/12
to cufón
The color problem for the active links is fixed; I put !important
after the color setting in the CSS file and it seems to work fine.
The hovered links on the other hand don't change immediately, and
that's what I need the JavaScript call for, right?
My problem is that I don't know where to put this <script>blabla</
script> piece of code.

Does anyone know?

On 7 jan, 01:47, Simo Kinnunen <sor...@gmail.com> wrote:
Reply all
Reply to author
Forward
0 new messages