Eavify Your World! [jQuery Plugin + EA Tools 0.3]

Empire Avenue is gaining in popularity and many WordPress bloggers seem to enjoy the Empire Avenue plugin I released about two weeks ago. I am pleased to see that it is proving useful to some of you. Today, I am however even more pleased to announce not only version 0.3 of EA Tools, but a brand new jQuery plugin named Eavify, which can be used on ANY web page – not only WordPress blogs.

Just like EA Tools, Eavify converts (e)TICKER into a pretty link to the user’s EA profile. It also features the EA badge as a tooltip. Please visit the Eavify’s page for more information and to install it.

If you are a WordPress blogger, you still want to use the EA Tools plugin. As of version 0.3, it integrates Eavify to convert tickers into links, instead of changing the post contents as it did so far. This also means that it no longer only works on posts, but on the whole page. You can customize this to fit your needs. Visit Eavify’s page for more information on customization.

Bookmark and Share
Posted in Tools, WordPress by Olivier at August 4th, 2010.
Tags: , , , , , , ,
  • http://topsy.com/olussier.net/2010/08/04/eavify-your-world/?utm_source=pingback&utm_campaign=L2 Tweets that mention Eavify Your World! [jQuery Plugin + EA Tools 0.3] – olussier.net — Topsy.com

    [...] This post was mentioned on Twitter by Brad Grier, Olivier Lussier, Olivier Lussier, Mathieu Duchesneau, Beto Waizel and others. Beto Waizel said: RT @olussier: Add #EAv ticker links on ANY web page using Eavify! http://bit.ly/bS9xqe [...]

  • http://topsy.com/trackback?url=http%3A%2F%2Folussier.net%2F2010%2F08%2F04%2Feavify-your-world%2F%3Fsms_ss%3Dtwitter&utm_source=pingback&utm_campaign=L2 Tweets that mention Eavify Your World! [jQuery Plugin + EA Tools 0.3] – olussier.net — Topsy.com

    [...] This post was mentioned on Twitter by Claire McGonigal, humantrader. humantrader said: Eavify Your World! [jQuery Plugin + EA Tools 0.3]: http://bit.ly/9gPuSx via @addthis @helpimahostage Sweet! #EAv [...]

  • http://eavproblog.com/2010/09/sunday-digest-september-5/ Sunday Digest – September 5 | (e)ANGLER on EAv

    [...] Eavify Your World! [jQuery Plugin + EA Tools 0.3] – olussier.net (e)OL Just like EA Tools, Eavify converts (e)TICKER into a pretty link to the [...]

  • http://backlinkz.org/get-free-unlimited-one-way-backlinks-here.php Get free unlimited one way backlinks here!

    Hey friend…

    Get unlimited one way backlinks free here!…

  • stu

    Works great. Wondering how to render it the large format 167×197 in tooltip using qTip and other js files you provide. Looking through the files I see references to the sizes but I can only get the small one to appear after fiddling with it for an hour. Can you tell me which file controls this function? Thanks.

  • http://olussier.net/ Olivier

    Thanks for your interest! I haven’t tried it myself, but you should be able to use the larger badge with a few hacks. Follow these steps and it should work:

    In jquery.eavify.js find the line that begins with “content:” and in that line change “&s=1″ with “&s=2″. This will make it generate the large badge instead.

    Next, you need to make the tooltip larger. If you open eavify.css, you will see that “iframe.EATickerTooltip” has a width and height of 100px. The CSS is loaded from the server automatically though, so you can’t easily change the dimensions. Instead, you will assign the tooltip another class name and define your own CSS for that class. Copy the CSS block for “iframe.EATickerTooltip” into your site’s CSS. Change the class name from “EATickerTooltip” to something else, let’s say “EATickerLargeTooltip”. Also, change the width and height (190 and 167 should do but you may need to adjust later). So it should look like this:

    iframe.EATickerLargeTooltip {
    width: 190px !important;
    height: 167px !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    }

    All that is left to do is to tell Eavify to use that class instead of the default “EATickerTooltip”. To do this, you need to set the “tooltipClass” option to “EATickerLargeTooltip” when calling the eavify function. Your code should look like this:

    jQuery.Eavify.init(function() {
    jQuery(‘#MyContent’).eavify({ badge: true, tooltipClass: ‘EATickerLargeTooltip’ });
    });

    The tooltip should now have the “EATickerLargeTooltip” class and therefore get the right dimensions, as defined by your CSS.

    Let me know if it works or if you have any question.

  • stu

    I tried the first 2 step you mentioned when I first installed but without success because of the new class (doh) – I will try this out a little later and update you with the result. Thanks Olivier!

blog comments powered by Disqus