Archive for November, 2009

How to group items in HTML select menus

Posted by admin in Web design & development on November 29th, 2009

Here’s something I learnt last week, just as the title says: how to group items in an (x)HTML select drop down list. This trick, which I’d assumed was done with magic (or rather DHTML or JavaScript trickery), is actually very easy to achieve being straight forward HTML markup.

[Found in a referenced post linked to by Laura Carlson's excellent [webdev] reference pages (subscribe to the list server here)…]

…the secret, as explained by “Web Teacher” here, is simply to wrap the items you want to group  in the select list with

<optgroup label="group_title"> and </optgroup>

Another good point made there is that to make a select list multiple choice you just need to add the attribute multiple="multiple" into the opening select tag (and make it clear to the users that this is the case as well as how to actually select mulitiple items…)

,

No Comments

JavaScript Rounded Corners

Posted by admin in Web design & development on November 27th, 2009

Rounded corners with CSS and graphics is OK – but a pain to set up – requiring custom images and plenty of extra markup. JavaScript – particularly when helped by jQuery comes to the rescue and makes it fairly trivial. Requiremtents: must work with IE6, IE7, iE8, FF and Safari (note about IE8 below).

Main contenders:

  1. for jQuery: jquery.corner.js from rc.rctonline.nl
  2. for jQuery: jquery.corner.js from malsup.com
  3. for jQuery: cornerz
  4. stand alone: curvycorners

Using #1 at the moment. Would like to try them all again in the light of the IE8 workaround below. Gotta say I now think #3 (cornerz) looks most promising in terms of size and ability. Going to have another look to see which ones look to CSS first (for those browsers that are modern – and not Internet Explorer) before turning to JavaScript.

Problem with most of these is IE8 doesn’t play nice… fix seems simply to add the behave like IE7 meta tag: <tt><meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE7″ /></tt>

First impressions:

  1. good, non-transparent outside corner
  2. good,
  3. throws errors in IE7, non-transparent outside corner
  4. slow in IE,

, ,

No Comments

MAMP stacked (Mac OS X 10.6)

Posted by admin in Web design & development on November 16th, 2009

When I moved over to Mac OS X 10.6 last week I found I had to fix my MAMP stack. My old MAMP install didn’t work anymore as unfortunately Marc Liyanage’s excellent PHP package fails in 10.6.

The following instructions are mostly the same as before – except it’s not quite so easy now – if you want more than a base PHP install that is. (I even had another look at the commercial MAMP Pro offering. Nah.) For a simple MAMP stack you really only need to turn on Apple’s PHP package and grab a copy of MySQL. If easy is good for you – jump to 1.5.

But I “like” to have phpMyAdmin and don’t like being warned that I’m missing the mcrypt extension for PHP. If you want mcrypt too – start at #1.

Tools & Requirements:

  • You need admin access on your Mac
  • Basic understanding of the filesystem and Terminal.app
  • If you’ve not got it already grab the wonderful and free editor TextWrangler. The config files that need editing are hidden from normal view- but easily reached by TextWrangler which even has a menu item for that: File / Open hidden… .  It also handles authentication beautifully to allow saving without having to manually change permissions to and fro.

1. [extra steps to customise things first eg add mcrypt PHP extension - if you don't need/want it skip past to 1.5.] Go and see Xeon Xai’s blog post Snow Leopard PHP Extensions Installation Tutorial or for a quicker version – go here. These first optional steps to customising your set up (adding PHP extensions and even downgrading PHP from 5.3. to 5.2) has turned out to be more “intereseting” than originally percieved and needs post of its own…

1.5 Prepare your php.ini file by duplicating the supplied stock example file and givining it the right name: In Terminal paste this:

sudo cp /private/etc/php.ini.default /private/etc/php.ini

You’ll need to edit the timezone – replace

;date.timezone = with
date.timezone = Europe/Madrid

For other timezones look to the official list here (note the lost semi colon – that’s the comment character)

1.6 Get PHP looking in the right place for MySQL (once you’ve installed it.) …Still editing php.ini find and replace all instances of /var/mysql/mysql.sock with /tmp/mysql.sock . (Why? – well as documented here it seems php.ini is configured for Mac OS X Server’s bundled version of MySQL)

1.7 Start PHP by un-commenting the LoadModule php5_module line in your /etc/apache2/http.conf file.

1.8 Turn Web Sharing (in System Preferences/Sharing) off-and-on again.

2. Get yourself virtualhost.sh from Patrick Gibson. This little shell script will make the process of setting up proper virtual domains on your development server a cinch. I use “.dev” or “.live” as the TLD to prevent any conflict with the live sites. (Although now I’ve started using Git I may just drop the separation between live and development branch domains on my development box. I still put all my sites in my ~/Sites folder though.

3. MySQL
3.1 If you’ve already got another version installed uninstal MySQL from your Mac. NB – this will delete your databases too! But you’ve got those backed up and you want a clean slate:

  • sudo rm /usr/local/mysql
  • sudo rm -rf /usr/local/mysql*
  • sudo rm -rf /Library/StartupItems/MySQLCOM
  • sudo rm -rf /Library/PreferencePanes/My*
  • edit /etc/hostconfig and remove the line MYSQLCOM=-YES-
  • sudo rm -rf /Library/Receipts/mysql*
  • sudo rm -rf /Library/Receipts/MySQL*

3.2 Get a MySQL Community Server for the Mac and install it.

4. Give your MySQL root user a password; type the following into the Terminal:
/usr/local/mysql/bin/mysqladmin -u root password sniggle
…if you like sniggle as a passowrd that is.

5. Now you can administer your MySQL server with phpMyAdmin and the root user you’ve just defined. (There are other tools too – eg MySQL Administrator – but I’m used to phpMyAdmin from the hosting packeges I use). You may want to virtualhost phpMyAdmin to, for example, “http://mysql/”. Love virtualhost.sh.

6. Then for each [dynamic] site you’ll probably want to add a user and then associate a DB with that user. Do this in phpMyAdmin in one step using the Privileges pane fill in “Add a new User”/then select “Create database with same name and grant all privileges”. Job’s a good ‘un.

Done and not long-winded at-all at-all!

, , , , ,

No Comments