sIFR Plugin for WordPress: wpSifrLite

I want ft60 font

donwload link : http://neutronics.syokz.org/?download=Biru%202.0%20font

Hello,

Thank you for this AWESOME plug-in. I come from the official documentation of sIFR. Without you it would have been hell to implement, but you made it a paradise.

I’ll promote your plugin so badly!

I found my way to put the font I needed. But I still a question though ; how could I use different fonts on the same page via your plugin?

Great work; I love the plugin!

One more thing: can you update the plugin to include the .fla used to create your .swf files? I’d like to select my own fonts. Thanks!

Brian, I included the fla file with the plugin (also included two AS files that are used by the fla file but no need to touch those files, just open the fla file).

Ben, Currently this wordpress plugin only handles one sifr font. In the future, if I see more interest in the plugin I will rewrite it to handle many fonts.

Now, if you want to do this manually, open up the sifrlite.js file and wpSifrLite.php file and scroll to the bottom. In the JS file you see two fonts currently defined but with the same class and tag filters. That’s ok because the php file on the bottom only calls one of them (one font). So, if you wanted to use both the fonts defined in the JS file, you would have to change the class,tags filters for the second font and call that second font in the php file. Does this make any sense?

Hi there,

Thanks for the great plugin. I’m really looking forward to giving it a try. Just one question:
I can’t figure out how to switch the font. When I open the fla there’s nothing there (no text) to switch to another font. Am I just supposed to type anything? Does the size matter?
Sorry for the probably obvious question, but the sifr site didn’t really help either.
Thanks.

Size doesnt matter and its set by the css property you give to the h2 or div or any tag you want. As far as changing the font in the fla, open the fla, right click on the box and click on edit or edit in place. You will see some text, click on it, look down and under properties change the font to whatever you want. Hope this helps, if not, give me a link to the font and I will update the plugin with the font you want.

Worked like a charm. Thanks so much.

Nice plugin. It was certainly quick to implement. I have had to tweak the .js file to allow me to place the sifr class within a link, but other than that, it was pretty easy. I suggest you put in the functionality to allow SIFR within links (like blog post titles) and give the option to edit in a rollover color, etc. Just a thought. Other than that, great plugin for an easy implementation.

Thanks for the comments Brian, I will definitely consider your suggestions when i release the next version of this plugin. Right now it’s just plain and simple and modifications have to be done manually.

The text is invisible in IE 7 :( I think your demo is either not working (http://www.toolsoup.com/screen-scraping-the-web-with-php/). Any ideas ?

Yeap. It is invisible in IE7 and IE8.

Thanks for catching that, does anyone know why this is happening? I will try to look into it next week…

It worked but I can’t seem to resize the font with my css styling.

Is there anything else I need to change?
h1 {
font-size: 56px;
color: #000;
margin-bottom: 50px;
}

Also, added the class to the h1 tag

Thanks

Awesome plugin!

I used a plugin to turn off the smart quotes rendering incorrectly, but it would be great to actually have it render as proper smart quotes. Would love to see this in future versions!

Thanks!

dylan: try adjusting the width and height for the h1, that might work if changing font size is not working

Marc P: thanks, i will take that into consideration when updating the plugin

Is that a dumb question? But how can i change the color? No matter what color i choose > it appears grey. And what about “text-transform: uppercase;”? Does not change as well. Thanks for your help! Flo

Thanks for your work. It works great for me on a site that I’m finishing up right about now: http://www.nocopycat.be.

for color changing I added an extra class in my h1 tag

h1.Copy {
color:#000;
}

It’s brilliant that it adjusts right away.

Thanks again

Simon

Does anyone know how to fix the IE7& IE8 problem? What do i have to do?

any updates with the IE7/8 issue?

Would be superb if the IE7/8 issue could be fixed - it could be used on pro sites. Hopefully you’re working on it as I type… :)
Great plugin - nice work

Ok, for a while, i had the suspicion that this plugin works perfectly and something else is causing problems in ie. Today, I have tested this plugin without making any changes on a brand new WordPress 2.5.1 Installation in IE and it works properly as expected. Check out page title post on SeoJot to see that it works. Now, something in your current design might cause it to not work in IE but the plugin is not at fault. Thus, if you are still experiencing problems, provide more details with links and someone might be able to help you out. SEOJOT is using a new template I created based on the new WordPress.org website, check it out.

Hey - the Seojot site titles work perfectly in IE7! Cool.

I can’t link to it atm as I’m running it on an unsecured server, but here are the details:
WinXP pro sp3 - p4 3.2ghz - 4GB ram (3GB active)
Apache/2.0.63 (Win32) PHP/5.2.5 Server
Wordpress 2.5.1
Active plugins: wpSifrLite
Inactive plugins: NextGEN Gallery (has been used) — Hello Dolly & Flash video player & Akismet (never been used)
Theme: WordPress Default 1.6
Previously used themes: Back in Black, CITRUS 06 mod, HemingwayEx

Anyone think why this isn’t working for me? (I just get a blank where the sIFR should be)

As a stopgap I’ve changed part of wpSifrLite.php from this:

function sifr_add_to_head() {
echo ‘var sifrpath = “‘. get_bloginfo(’url’) .’/wp-content/plugins/wpSifrLite/”‘;
echo ”;
}

to this:

function sifr_add_to_head()
{
$br = strtolower($_SERVER[’HTTP_USER_AGENT’]); // what browser they use.

if(!ereg(”msie”, $br))
{
echo ‘var sifrpath = “‘. get_bloginfo(’url’) .’/wp-content/plugins/wpSifrLite/”‘;
echo ”;
}
}

Which disables the plugin if the browser is IE (any version) so I just get a normal h1 etc

I’ve not really tested it, it’s a quick hack: in IE7 the page remained waiting for 1 item to load and never declared ‘done’
(thx to Seb for the code)

Hi there
I seem to be facing a queer problem using this plug-in. It seems the h2 tag i am applying class=”sifr” is supposedly getting replaced but the alternate/replacement flash file is unable to load. This is in IE 7.

Advise.
Thanks in advance.

I need to go to your page and firebug the issue so please provide working links. That is really the only way I can attempt to figure out what could be going wrong.

Hi
great plugin!

But I have the same problem with IE (please check: http://www.laondagrafika.com/blog)

How can I change the font and it’s parameters, size, color, etc…?

Thanks!

Nice plugin, the other sifr based plugins don’t have the IE issue, but they also do not have transparent background.

Now, if anyone knows what’s up with the IE issue I hope there’s some follow up here.

Hey there, hoping this works… but yet to implement it.
I was wondering if you have the flash file as I need a font to be included… totally not my choice… but it’s lucida handwriting italic. Would you be able to add this font for me?

I can email it to you if you supply me your mail address.

Thanks in advance!

Mel

Alejandro: you can control the font and it’s parameters via javascript, take a look at the bottom of http://www.allcrunchy.com/Web_Stuff/sIFR_lite/ for more information. Let me know if you need help. Soon, I will update this plugin so that these options can be set inside wordpress.

Mel: I emailed you about the font using the email you provided with your comment.

Hello, I hope you can help me. Your plugin is awsome, but I’m not very good at coding and I have found that it works great in firefox but loads in some places and not in other when runing it in IE6… (not surprising though, IE6 is a real nightmare!).

And I have tried to follow instructions at allcrunchy, but I don’t seem to get it running.
I have put this code in the head of the page:

var futura = new Font(’wp-content/plugins/wpSifrLite/’, {tags:’h1,h2,h3′});
futura.replace();
window.onload = futura.replace;

What am I doing wrong?

Thanx a lot for your work and for your time.

fadingblack: I assume it has something to do with your relative path, can you give me a link to your website where the issue exists?

Thanx for that quick response!!

Yes I saw that the name of the swf font was missing :D. But even after fixing is not working.
The site is on still being built, but if you can take I look I will be very thankful.
http://motiongrafiks.com/mystockstuff/

Oh, an although I use “futura font” the swf name is tha same you use ft60.swf. Just changed the font inside the swf (too lazy to search all the files to change to futura.swf :D)

Thanx a lot in advance.

Thanks info for the support!
Cheers!

Alejandro: No Problem, cool site you have there.

fadingblack: there are a couple issues that i see here, first of all you seem to have a couple unrelated javascript errors that you might want to fix. As far as this plugin, it seems that you are combining two techniques of loading sifr. I would remove the code you put in the head completely and instead, open up the sifrlite.js file and at the bottom where you see “var targetedft60″, I would insert “var futura = new Font(’ft60.swf’, {tags:’h1,h2,h3′});” …that should make it work but you shouldn’t really use sifr on all h1,h2, and h3s so adding the classFilter (look at the bottom of sifrlite.js) is generally a good idea to only sifr some H tags with a sifr class. Good luck!

Thank you SOOOOO MUCH for your help. It works now!
But on IE (6 and 7) the h2 tag does not show :-( Same happened when I first tried your plugin and tested it with the sirf class. It only worked on Firefox. Any idea why?

The reason I wanted to assign the sifr to all h3 tags (for example) is that I have widgeted sidebars, and I could not figure out another way of making the titles of the widgets appear with the sifr font. Maybe there is another way.

Anyway, you helped a lot, but as I said it works like charm on Firefox but the h2 taged text does not show on IE. I have been looking into my css, but no success :-(

Thanx a lot in advance.

Hi!

Very useful plugin. I am developing a new site and it works perfect with h2 and h3 tags. But I have a problem: the site is in Spanish and the Plugin does not show accents (and the font includes that characters).

For example:
Galería de fotos (Photo Gallery) it shows: “Galerde Fotos” on screen.

Thanks for the awesome Plugin and thanks for your help if possible.
Kind regards!!

Hi, thanks for this plugin. I have a problem though. it seems it works ok in all the browsers. the only thing is, in firefox 3.0 and the latest safari h links don’t work. So i can click on it, but it does’nt go to the link.
Any idea how this can be?

Great plugin!

However… Every word that has å, ä or ö in it just disappears. Any way around this?

Hi, great plugin but I have the same problem that Sergio Simarro explain.

There is anyone working on that thing?

Best,

D.

Hi ET!!

I was studying the Plugin the other day and tomorrow I am going to try some modification in order to make it work.

If it works OK, I will post it here.
Kind regards.

Sergio, awesome! I’ll keep this page on my rss reader. I’m working now with the sifr v3 beta… have you see it?

Best,
D.

@Sergio: Any idea why words containing å, ä or ö just disappears? =)

CHAN CHAN CHAN!!! Now it works!! After 4-5 hours of reading and testing, I made it work.

This documentation gave me the inspiration:
http://wiki.novemberborn.net/sifr3/How+to+use

Here are the steps you must follow to allow any character with this Plugin:
1. Open the sifr.fla, double-click on the blank area and it appers (”Do not remove this text”). Below in the properties panel, there is a button on the middle-right side saying “Embed…” (Incorporar… in spanish). You can add there manually the characters you need (for my case: áéíóúÁÉÍÓÚñÑ¿?). Click on ACCEPT and the Export the movie again to the .swf you are using (the ft60.swf by default with this plugin). Save the .fla if you want to keep it.

2. Open the sifrlite.js and at the line 45 it says:

var sVars = 'txt=' + escape(el.innerHTML) + '&textcolor=' + c + '&w=' + width + '&h=' + (height+o.sizeAdjust) + '';

Change escape(el.innerHTML) by el.innerHTML (delete the “escape” function).

And now it works. I don´t know exactly the use of the “escape” function on the 2nd step I made, but deleting it, the plugin works with accents.

So you can all try now. I would be helpful to include accents in future versions of the Plugin, because I think this is now the best sifr for Wordpress I could find.

Kind regards.

Escape function: http://www.w3schools.com/jsref/jsref_escape.asp

Now, that’s a hack! Seems that function encode every character make them readable in every computer in the whole wide world.

Have you tried to change escape() to encodeURI() insted of deleting the function?

I’m going to give it a shot later, but GRACIAS!

Actually I found myself using the original sIFR and embedding into wordpress manually… it works just fine!

Buenisimo tu trabajo, Sergio!

@Sergio Simarro: Thanks alot! Nice “hack”! =)

@ET: It seems to work fine with encodeURI() :)

Oh, great news!

So recap, changing escape() in to encodeURI() gives full support to foreign languages?

Amazing work guys!