Category: Tips

Embedding Web Fonts: A cautionary tale

So for work, the designer says “Hey, can we use this font in the webpage” and like an idiot, I say “sure, why not?”. Well, FF and Safari don’t support .otf files (for whatever reason) So I download FontForge, open it in X11 (on my mac) and convert it to .ttf, which works great.

Then I messed around in IE, trying to make it work, even downloading this tool:

Microsoft WEFT

Worst thing EVER. Don’t do this. Don’t get this. Don’t even look at this. You will feel violated if you use it.

So…how to embed an OTF font in a website (make sure you have a license to do so kids):

  1. Convert OTF file to .ttf (use fontForge)
  2. Embed with @font-face
  3. When adding the font to a style, in IE you CAN NOT call it by the name you gave it with the @font-face declaration. You have to call it by it’s name. So if the font’s name is myfontLTSTDBOLDITALICROMAN you have to do: body{ font-family: myfontLTSTDBOLDITALICROMAN; } Sucky? Very. Works? yes.

Have a nice day

WordPress plugin DB access framework

While designing a recent WordPress plug-in for TruthMedia that was designed to follow MVC, I had an awful lot of database work to do, and it needed to all be properly secured, which was a lot of work, and while making a rather large change to the way the database worked, I realized that writing all the db code by hand was crazy inefficient.

So I wrote a class that you can extend with any model class of your own, and it will automatically have create, read, update, and delete functionality with no more work required. It also uses all of the WordPress security features to properly escape everything and prevent injection. Although, if you can crack it I’d love to hear from you!

Click here to download!

This is how it works:

  1. Create a new class (ex. person)
  2. Give that class instance variables (ID, FirstName, LastName, Address, PhoneNumber, PostalCode, HairColour…)
  3. Make sure that you add accessor methods (getters and setters) for the ID (although it’s good practice to have them for all instance variables). Depending on your project, it may be a good idea to run stripslashes() on your string get functions so that they don’t show up with escaping. You may want to run WordPress’ attribute_escape() on setters, however, again, depending on your set up this may be unnecessary.
  4. Write your SQL code to create a table named (wordPress prefix)(plugin prefix)person (ex. wp_wec_person)
  5. Make sure you call your primary Key personID **This is very important, without this, the system breaks down**
  6. If you wish to store variables in this class, you can modify them to be private, and they won’t be written to the database

In your class, extend the class name, so for example:

class person extends wec_db {

var $ID;

var $FirstName;

function __construct($id = null, $autoload = true){

//If we are given an ID
if(!empty($eventID)){

$this->setID($eventID);


if($autoPopulate){

$this->read();

}

}

}

//getters and setters, and any other methods for this object

}

Setup Note: to keep your plugin from stepping on the toes of others, make sure you change the prefix at the top of the class. Also, changing the name of the class to (plugin prefix)db (example:wec_db) will make sure that it doesn’t interfere with anyone else’s if they’re using this class!

Usage:

Create / Add

$person = new person();

$person->setFirstName(‘Joe’);

$person->setLastName(‘Blow’);

$person->add();

Read

$person = new person($personID);

Update

$person = new person($personID);

–or–

$person = new person($personID, false);

$person->setFirstName(‘Jane’);

$person->update();

Delete

$person = new person($personID, false);

$person->delete();

Post any questions in the comments! I’d love to hear from you!

Cause a field to be auto-focused when the page is done loading

So, wouldn’t it be user friendly, if when you went to a form page in a document, if the cursor was automagically positioned at the first field in the form?

Why, yes it would. Try:

	
Event.observe(window, 'load', function(){
     try {
          $('eventName').focus();
     } 

     catch (e) {}
});

after your </form> tag. This requires the prototype javascript library

How to do multiple virtual hosts on OS X

  1. Download and install VirtualHostX (don’t forget to back up your existing config!!)
  2. Download and install Gas Mask (manages multiple hosts files, dumb name though)
  3. If you want to do this with WordPress and you have a database locally and another one on a dev server somewhere, you can do the following code:

if(eregi(“^mywebsitename.com$”, $_SERVER[HTTP_HOST]))

{

define(‘DB_NAME’, ‘dbremotename’);

/** MySQL database username */

define(‘DB_USER’, ‘dbremoteuser’);

/** MySQL database password */

define(‘DB_PASSWORD’, ‘dbremotepassword’);

/** MySQL hostname */

define(‘DB_HOST’, ‘dbremotehost’);

define(‘WP_SITEURL’, ‘http://mywebsitename.com&#8217;);

define(‘WP_HOME’, ‘http://mywebsitename.com&#8217;);

}

else{

define(‘DB_NAME’, ‘dbremotename’);

/** MySQL database username */

define(‘DB_USER’, ‘dblocaluser’);

/** MySQL database password */

define(‘DB_PASSWORD’, ‘dblocalpassword’);

/** MySQL hostname */

define(‘DB_HOST’, ‘dblocalhost’);

define(‘WP_SITEURL’, ‘http://mywebsitename.com&#8217;);

define(‘WP_HOME’, ‘http://mywebsitename.com&#8217;);

}