Semplice blog

Musings from the Semplice technical department.

Drupal 7 ajax page navigation with history

Submitted by Ed on 6 December, 2012 - 13:08

Many clients these days ask for ajax enabled sites for smooth navigation between pages (here's an example http://debbievinick.com). To achieve such behaviour and maintain backwards compatibility with non-javascript browsing (of most interest in that category are search spiders, e.g. Googlebot) the fundamental problem is that for each page you must serve two versions: 1 full page for when you land on the url directly, and 1 ajax version which just returns the content to be updated.

...or do you?

How to copy text messages from your iPhone to an Android device

Submitted by Ed on 11 June, 2011 - 22:47

So you've given up waiting for iTunes to do a full sync of your phone and bought yourself an Android phone. Bringing over your email and contacts is a doddle because you're using Gmail, right?

Text messages however are a little trickier.

First you'll need to do an iPhone backup (if you haven't done so recently), then find the file 3d0d7e5fb2ce288813306e4d4636395e047a3d28 with the extension .mdbackup or .mddata in your iTunes backup folder.

This file is a SQLite database, and needs to be converted to XML format and here's the script to do it:

http://semplicewebsites.com/sms.php

Give your Facebook page a friendly "Vanity URL"

Submitted by Ed on 25 May, 2011 - 15:53

All the major Facebook pages have neat personalised URLs, such as:

...where as your page may still have an long URL like this:

So how do you get a vanity URL for your page? Well there are two easy steps:

Converting text to basic latin (aka removing accents) with JavaScript

Submitted by Ed on 29 June, 2010 - 16:44

I was recently working on a decision engine for a quiz site (KwizMi.com) . The quizzes allow you to define a table of questions and answers, and users playing the quizzes have to try and guess all the answers in a given period of time.

The problem I stumbled upon is best illustrated by the following example:

  • Question: Which "GP" plays at centre-back for Barcelona?
  • Answer: Gerard [Piqué]

Why you should never put test data on the live site

Submitted by Ed on 22 January, 2010 - 12:36

A humorous screenshot from a test page set up by Facebook developers, and accidentally(?) made visible to the public:

At the time of posting it is available here: http://www.facebook.com/e (sign in required) but I expect this to be taken down soon...

DON'T FCUKING ERASE THIS

Highlight external links with favicons

Submitted by Ed on 18 January, 2010 - 10:30

Many sites like to apply distinct styling to their external links to let users know they will leave the site if they click on them. Wikipedia is a good example of this, using a blue box-arrow icon applied as a background image to links with the "external" class.

A slight more colourful approach would be to use the target website's favicon. This not only makes for an arguably more visually appealing design, but in certain circumstances, allows users to quickly see to which domain a link will probably take them:

BeforeAfter
External links styled with an icon (left) and with the target site's favicon (right)

Selecting a font for server side images based on available characters

Submitted by Ed on 11 November, 2009 - 16:47

There are many scripts available for rendering image headers or buttons on the server to ensure the correct font is displayed to the user. Typically these take at least two parameters: the text to be rendered, and the font to render them in.

Problems can occur (especially with multi-lingual sites) when the text to be rendered contains characters not available in the first choice font (such as Japanese or Russian text). Here is one solution:

Automatically optimize your CSS and JavaScript files with PHP

Submitted by Ed on 21 September, 2009 - 11:37

If, like many people, you like to spread your JavaScript and CSS over a handful of files you may be introducing an unnecessary overhead to your server. If you have a simple page, but 6 CSS files and 6 JavaScript files, users will have to make 13 separate requests to your webserver to load the page. By collating these files you can reduce this to 3 page requests, removing the stress of multiple requests on both the client and server.

Textbox watermark label with Protoype Javascript library

Submitted by Ed on 10 September, 2009 - 15:23

First we'll outline the desired functionality:

  • The textbox should show the label inside the textarea, possibly in a different colour to when normal text is entered, to highlight that it is just a label.
  • When the textbox gains focus (clicked on / tabbed to) the label should disappear.
  • When the textbox loses focus the label should reappear if (and only if) no other text has been entered.
  • The solution should degrade graceful in the absence of JavaScript

As we want to write good semantic XHTML we'll start with the following code:

Speed up page load times when running Google ads

Submitted by Ed on 9 September, 2009 - 15:16

Google ads are an easy way to monetize your site, but their implementation leaves a lot to be desired. To insert a Google ad block on a page one has to insert two script blocks: one to set the adverts parameters, and one to load the external Google script.

The problem is that the scripts have to be inserted in the body at the place where the advert is desired. This is because Google uses JavaScript's document.write to generate an iframe, which then loads the ad. If Google's servers are being a bit laggy then your visitor has to wait for the Google script to finish loading before the rest of the page is rendered. The closer your ad is to the top of the page, the worse the resulting problem is.

Subscribe to Front page feed