HTML 5 – bloody hell, it’s got more Capes than a Geoffrey, as this link demonstrates.
Archive for the ‘HTML, CSS, JS’ Category
Presenting the meta_tag plugin for the Smarty templating engine!
Click here to download block.meta_tag.txt
Click here to download outputfilter.meta_tag.txt
This plugin allows you to change the page title and meta tags from any template used to generate page output.
Purpose
Typical web page display scenario:
Web page “Home” consists of Smarty templates:
- header.tpl – generic page header, HTML declaration, <HEAD> & <BODY> tags etc.
- navigation.tpl - site navigation.
- home.tpl – the main content for a given page, in this example “home”.
- footer.tpl – the page footer – closing </HEAD> & </BODY> tags, javascript tracking etc.
In this example, the page title and meta data would be in header.tpl, whether as Smarty variables:
<title>{$page_title}</title>
…or hard-coded values:
<title>Hello world!</title>
Using the meta_tag plugin, title and meta tag values can be updated from any other template used to generate the page.
The following example contained in footer.tpl would add “Product description” to the page title:
{meta_tag type=’title’ method=’add’}Product description{/meta_tag}
The following example contained in home.tpl would replace the page title with the text “Important business report”:
{meta_tag type=’title’ method=’replace’}Important business report{/meta_tag}
The following example contained in footer.tpl would add the text “jacket,blue,leather” to the meta keywords:
{meta_tag type=’keywords’ method=’add’}jacket,blue,leather{/meta_tag}
So… what’s the point?
Often when you’re displaying dynamic data across several templates it isn’t practical to customise the page title and meta information using Smarty assign(). Also,the logic used in templates processed after the page header might contain information which would be useful to reference in the header.
Caveat
It’s preferable to call load_filter just once per output, BEFORE the instruction to display() or fetch():
$smarty->load_filter(’output’, ‘meta_tag’);
$smarty->display(”template.tpl”);
In a scenario where multiple templates are used, they should all be contained within one container template, to ensure the output filter isn’t called repeatedly. In the above example, template.tpl might be:
{include file=’generic/header.tpl}
{include file=’generic/navigation.tpl}
{* load main page body – filename is contained within var $template*}
{include file=’`$template`}
{include file=’generic/footer.tpl}
Installation:
Click here to download block.meta_tag.txt
Click here to download outputfilter.meta_tag.txt
Change the file extension on both files to .php, then copy them to your Smarty plugins directory (smarty/plugins). Detailed usage instructions can be found in the comment block of each file.
Microsoft is urging developers to tag websites in preparation for the release of IE 8.
According to a post made on an MSDN blog, a public beta of IE 8 will be available in the third quarter of 2008 and it threatens to “render content in its most standards-compliant way by default”. As this is the first time Microsoft has stooped to such murky depths, we are warned that this will play havoc with content written for IE 7. The advice: to implement a specially created meta tag instructing IE 8 to render the content as if it were IE 7.
This is all a lot of fun, I’m sure you’ll agree, and it does seem to offer a pretty straight-forward solution for achieving backwards compatibility. However, given that the two rendering engines are so markedly different, the most excitement will surely be reserved for the future hours spent hacking IE 8 content to display correctly in IE 7. I, for one, can’t wait for that.
Our latest project, a fully searchable database of the UK and Ireland’s richest inhabitants, is now live.
Find out how last year’s contenders have faired, identify the wealthiest people in your region and more at the Times Online website.
The new BBC homepage, launched today, allows users to customise their experience by selecting content and creating garish colour schemes. It’s hardly a new idea, but it’s well implemented, and if nothing else, it’s worth the admission fee for the kitsch analogue clock displayed in the header.
Please note – I despise the term Web 2.0, but as there’s no recognised alternative term that I can think of, I will continue to use it under duress.
Five viral microsites promoting the new MTV series Bedroom Diaries have been launched. Production by us here at Include.
www.ipartypartypartyandmisbehave.com
www.itfreaksmeoutthatiquitefancyherbutiquitefancyhimtoo.com
www.inmyreligiongirlsaretotallyofflimits.com
www.isleptwithsomeoneandthecontraceptiondidntworkandbroke.com
www.isitsohardtofindaguythatisntatotalxxxxx.com
You can find out more about the series at Bebo.
Junior Web Developer – London, UK
Include – http://www.include-digital.com
Include is a digital design agency based in London. Our clients include Universal, EMI and The Sunday Times.
We have an immediate requirement for a Junior Web Developer to join the team in our London office. Previous commercial experience is preferred but not a requirement; enthusiasm and the desire to learn is.
The position would ideally suit an ambitious individual who is looking for an entry point into the industry. The successful candidate will have the opportunity to progress within the agency.
Responsibilities include:
* HTML and CSS authoring, with an awareness of W3C guidelines.
* Updating existing websites and HTML emails.
* On occasion, answering the telephone, making tea, and generally mucking in.
Experience of the following is desirable:
* Designing digital media – primarily websites, HTML emails and online advertising.
* Photoshop, ImageReady or Fireworks.
* Flash/Actionscript.
* PHP/MySQL.
The post requires:
* Good verbal and written communication skills.
The position offers a starting salary of £18,000 plus 20 days’ holiday. The successful candidate will be given ample opportunity to develop skills in-house, with external training provided where required.
To apply:
Please send your CV to jwdjan08@include-digital.com, including any relevant URLs or portfolio material.
For more information on Include, please visit http://www.include-digital.com.
ABSOLUTELY NO AGENCIES! THEY SMELL OF POO AND KIDNAP CHILDREN! FRED WEST WAS A RECRUITMENT AGENT AND HE CAUSED NO END OF BARNEY RUBBLE!
Twittervision is a fun Twitter / Google Maps mashup that shows a never-ending stream of banal Twitter messages in realtime from across the globe.
SiteVista is a new service for testing HTML emails across a wide range of email clients. Each test results in two screen grabs: the email displayed in the software’s preview panel, and another showing the entire message when opened. Currently, the service supports:
Support for the following email clients is due imminently:
SiteVista is a great idea that deserves to do well. The price point is currently way too high (it’s at least 50% too expensive), and the lack of Lotus Notes support (yes, Lotus Notes still matters, as it is used by many large corporations) is a let down, but these things may well come in time.
Whilst working on a Flash website recently, I was surprised to note that all Javascript-executed new window commands were being caught by my browser’s pop-up blocker. This happened in both Firefox 2.0 and Internet Explorer 6 (I’ve so far resisted Microsoft’s attempts to force IE7 on me, although I don’t think I can hold out for long).
I’ve always used the Flash-calls-javascript-function-on-HTML-page approach before. Here’s an example of the code I might use to assign the getURL() event to my button click in Flash:
myBtn.onPress = function() {
getURL("javascript:openNewWindow('http:www.bbc.co.uk', 'bbc', 'width=400,height=200')");
}
where openNewWindow() is a Javascript function defined in the holding HTML page which simply calls the open() method of the document.window object.
Logically, I thought this approach would work, as the Javascript function is being executed as a result of user-interaction. However, this proved not to be the case, despite the fact that other sites that seemingly deploying the same solution successfully circumnavigated my over-zealous pop-up blockers.
Macromedia (ok, Adobe – some habits die hard…) themselves seemed also to advocate this as a valid approach. Where was I going wrong?
Eventually I downloaded the sample files (availabled for Mac or PC) and examined the code – all three lines of it! There was only one difference – the assignment of the getURL() method to the onRelease() event, rather than the onPress() event in my example above. Unconvinced this would make a difference, I duly updated my code so as to eliminate the possibility and guess what? It worked! My pop-ups were now being allowed to open.
There doesn’t seem to be much in the way of online documentation for this phenomenon. Brian’s post over at Midwest Macromedia Studio Users Group comes near the mark, but rather than the method of assigning the event to the button, it is actually the event type itself that plays the significant role in deciding whether a blocker will be triggered or not. onPress() events will always trigger a pop-up blocker while onRelease() events escape undetected.
So given that I’m happy to use an onRelease() event rather than on onPress() event, is everything now rosy? Unfortunately not. I also needed to include links opened in new windows using inline anchor tags within HTML formatted textfields. Here’s an example of how the code would be assigned to the textfield:
myTf.htmlText = 'Click <a target="_blank" xhref="http://www.bbc.co.uk/" mce_href="http://www.bbc.co.uk/">here</a> to view';
This will invariably result in the new window being blocked.
If anyone has a workaround for this, please let me know!
