Remove empty LEGEND tags in Silverstripe search form

Posted in silverstripe, xhtml on May 1st, 2009 by David – 3 Comments

I’m pretty obsessive about my HTML validating with no errors and no warnings. It bugs me that when I use Silverstripe’s incredibly convenient $Searchform in the template that it outputs an empty legend tag inside the fieldset.

There’s an easy way to fix this:

  1. Create a templates directory inside mysite.
  2. Copy sapphire/templates/SearchForm.ss to mysite/templates/SearchForm.ss
  3. Edit your copy of the file and remove that pesky <legend></legend> line
  4. Refresh your page that uses the searchform and bathe in the warm glow of a error and warning free page!

Thanks to Maksfeltrin in the Silverstripe forums for pointing this out.

Strip <span> tags from HTML in vim

Posted in vim, xhtml on April 6th, 2009 by David – Be the first to comment

When upgrading a website you might see source code like this:

<span style="font-family: Arial; color: #0000ff; font-size: small;">Some text goes here</span>

You’re using CSS now and all those <span> tags are ruining it. In gvim, do this search and substitute:

%s/<span.\{-}>//g

Then to get rid of the </span> tags, do this:

:%s/<\/span>//g

Dynamic Font/Image Replacement in Silverstripe

Posted in What I'm Working On Today, silverstripe on March 10th, 2009 by David – 12 Comments

I’ve recently started creating sites with SilverStripe CMS, and I’m loving it.

My client wants nicely rendered non-standard font titles that fade in and out, without using javascript.

Here’s how I’m going to accomplish it:

  1. In Silverstripe’s mysite/code/Page.php I overload the onBeforeWrite() call in my Page class. This intercepts the data before it is written to the database. I can get the title of the updated page from $this->Title
  2. I will then use PHP’s GD (graphics) library to create a PNG with a transparent background. I’ll use imagettftext() to load a font from a TTF file and write it to the empty PNG image. I can use Director::baseFolder() to work out the root of the site and store the title images in $this->ThemeDir.’/images/titles’.
  3. I will make sure that ‘images/titles/’ is writeable by the web server. I will make the filename the same as the title, with spaces converted to _ but otherwise stripped of punctuation.
  4. In the SilverStripe template I have created for the client, I will output a heading element with a span inside it. The span will contain the text of the title, so that search engines can read it.
  5. I will output inline CSS using the ’style’ attribute of the heading element. It will look at the image file that was created in the CMS, get the width and height, and then set the title as the background.
  6. I will then apply jQuery effects to the title so that on page load it fades in, pauses for a few seconds and then fades out again. What the user sees is an image of the rendered text.

It won’t be a strain on the server as the text title is only generated when the page is saved in the CMS. It’ll still be read by search engines and non-graphics browsers, meaning that it is still accessible. But best of all it will look absolutely beautiful, without requiring a Flash plugin.

I’ve got most of the pieces of this working, I just haven’t glued it together yet. I’m looking forward to it! I’ll let you know how it goes.

Download ImageTitle.php (the ‘library’ I use to interact with GD)

1px high DIV in IE6

Posted in css, xhtml on February 23rd, 2009 by David – Be the first to comment

Very occasionally I’ll use an empty DIV for decoration, and in CSS use height: 1px.

In IE6 to make this work you need to put comments inside the DIV, otherwise it’ll display at the height of the font you’re using.

<div class=”line”></div>

becomes

<div class=”line”><!– –></div>

You don’t need any line-height fixes in the CSS. Yes, it’ll add to your markup a bit, but you should probably be explaining why you’re using meaningless, empty DIVs anyway.

Minimal sIFR3 demo

Posted in css on February 23rd, 2009 by David – Be the first to comment

I like sIFR, but it really bugs me that I have to read through an entire tutorial to get something really basic up and running. This is a simple sIFR3 demo, using the basic cochin.swf file and an almost minimal amount of code to see it in action.

Download my minimal sIFR3 demo here.

I believe you’ll need to upload it to a webserver to run it, you won’t just be able to open the index.html file to see it working.

Batch reduce resolution of images in Ubuntu Linux

Posted in bash, linux on February 22nd, 2009 by David – 1 Comment

Open a terminal window or shell (who needs a GUI!?)
sudo apt-get install imagemagick
cd image_folder
mkdir resized
for f in *jpg
do
convert -resize 30% $f resized/$f
done

Easier than Photoshop, I reckon!

I needed this today for some photos I was uploading. Photos from recent cameras are huge and Australian bandwidth doesn’t cut it. So this really helps.

Obviously you only need to do the first line once. I found this in the Ubuntu forums but it took me a while to find the right combination of keywords in Google. View the original thread.

I needed to change jpg to JPG, because the camera used uppercase and Linux is case-sensitive. 30% was good for me but you may need to change that.

If you don’t understand this, ask me, I’m happy to help!

Strip ^M from file in vim

Posted in vim on February 20th, 2009 by David – Be the first to comment

If there are ^M at the end of every line when you view them in vim, you can do this:
:%s/^M//g
To get the “^M” bit, hit ctrl-v and then ctrl-m.

Fixing Windows File Permissions in Linux

Posted in bash on February 20th, 2009 by David – Be the first to comment

Find all files (not directories) and remove the eXecutable bit. I don’t know what the characters on the end do:
find . -type f -exec chmod a-x {} \;

Make all directories executable to user, read/writable to groups others (good for when the web server is in ‘others’):
find . -type d -exec chmod 755 {} \;

Make all files read/write/executable for user, readable for the group and others:
find . -type f -exec chmod 644 {} \;

Unix Time in MySQL and bash

Posted in bash, mysql on February 4th, 2009 by David – Be the first to comment

A quick one today. I was working on a mysql database that used unix timestamp produced by PHP’s time() function.

I needed to be able to quickly convert this time to a human-readable format. In bash,

date -d @timestamp

is a quick way to convert.

In a terminal shell eg:

# date -d @1224992980
Sun Oct 26 14:49:40 EST 2008

In a MySQL client, you could also use

select date(from_unixtime(column_name)) from table_name;

Or if you want a little more flexibility in the output, for example outputting 27/02/09, you could do:

select date_format(from_unixtime(column_name), ‘%d/%m/%y’) from table_name;

This post is one of my most popular posts. Did you find the information you were after? Please tell me in the comments!

Assorted Handy vim Commands, Part 1

Posted in vim, xhtml on January 28th, 2009 by David – 1 Comment

To reverse the order of lines, eg 1-5
: 1,5 g/^/m0
For example,

one
two
three
four
five

becomes

five
four
three
two
one

To remove blank lines
: %g/^$/d

Delete all lines that don’t contain “string”
: %v/string/d