eZ Community » Forums » General » Tag Cloud colors!
expandshrink

Tag Cloud colors!

Tag Cloud colors!

Thursday 23 February 2012 9:42:30 am - 4 replies

An easy way to liven up the tag clouds EZ generates: tie the font color to the font size!

Just change the style code in "ezjapan\extension\ezwebin\design\ezwebin\templates\tagcloud\tagcloud.tpl",

FROM:

style="font-size: {$tag['font_size']}%"

TO:

style="font-size: {$tag['font_size']}%;color:rgb({$tag['font_size']},{$tag['font_size']},0)"

Or something similar. You can experiment with different color sets by replacing different combinations of the rgb color attribute:

  • rgb({$tag['font_size']}, 0, 0)
  • rgb(0, 0, {$tag['font_size']})
  • etc...

Absolutely no coding required!

Anyone have another/better/easier way to do this?

Modified on Thursday 23 February 2012 9:44:25 am by Michael Grant

Thursday 23 February 2012 11:10:21 am

Hey Michael,

I don't know, if this is better but you can also do this with a short jquery code.

Friday 24 February 2012 2:06:14 am

Hey Michael,

I don't know, if this is better but you can also do this with a short jquery code.

Yes, JQuery is another option!

Do you have any code examples?

Friday 24 February 2012 9:36:26 am

I would set up an array of colors and link the index of that array to the font size - that way you're always assured of getting a good color.  Relying on the rgb value could have unexpected results.

Friday 24 February 2012 2:39:08 pm

Hey Michael,

I don't know, if this is better but you can also do this with a short jquery code.

Yes, JQuery is another option!

Do you have any code examples?

I think it should works:

 $('.mycloud li a').css('color', function(index) {
 
  return 'rgb: (0,0,'+$(this).css('font-size') + ')'});

but I have never tried it blunk.gif Emoticon

Modified on Friday 24 February 2012 2:49:13 pm by David Hohl

expandshrink

You must be logged in to post messages in this topic!

36 542 Users on board!

Forums menu

Proudly Developed with from