Category ‘XHTML & CSS’

GeSHify: a GeSHi syntax highlighting extension for Expression Engine

30 . January 2008
written by Clemens Lang at Jan 30th 2008, 21:51

I recently wanted to post some source code on this Expression Engine-powered blog - I thought about some syntax highlighting to improve readability. However, after asking Google and the Expression Engine forums search it turned out there had been several attempts to integrate a syntax highlighter into Expression Engine, but these plugins or extensions were either outdated or not available anymore. *sigh*

Update: GeSHify has moved! Visit it's new home http://geshify.com/. This page is probably outdated!



So I figured out it would end as it always does (notice how I exaggerate here to keep the pathos of the text) - I had to do it my way. And here it is: GeSHify for Expression Engine.
GeSHify supports the following features:



  • Customizable intelligent caching (this one is very important, since GeSHi is not the fastest code highlighter out there)

  • Supports GeSHi 1.0 and GeSHi 1.1 (currently alpha) - and you can even switch between both using some clicks in the control panel

  • Customizable tag (in case you want to keep the original functionality of [ code ] instead of overwriting it, which is the default setting)

  • HTML-argument-style settings: you can pass something like lang=actionscript to the code tag

  • Default settings manageable using the control panel, so you don't have to pass all arguments each time you're pasting code



Want to see an example? Sure, no problem:
  1. <?php
  2. function activate_extension()
  3. {
  4.  global $DB;
  5.  $DB->query($DB->insert_string('exp_extensions',
  7.    'extension_id' => '',
  8.    'class' => 'Geshify',
  9.    'method' => 'pre_typography',
  10.    'hook' => 'typography_parse_type_start',
  11.    'settings' => serialize($this->settings_default),
  12.    'priority' => 8,
  13.    'version' => $DB->escape_str($this->version),
  14.    'enabled' => 'y'
  15.   )
  16.  ));
  17.  $DB->query($DB->insert_string('exp_extensions',
  19.    'extension_id' => '',
  20.    'class' => 'Geshify',
  21.    'method' => 'post_typography',
  22.    'hook' => 'typography_parse_type_end',
  23.    'settings' => serialize($this->settings_default),
  24.    'priority' => 8,
  25.    'version' => $DB->escape_str($this->version),
  26.    'enabled' => 'y'
  27.   )
  28.  ));
  29. }
  30. ?>

If you know PHP and the Expression Engine API you might notice this is the place where the extension hooks into Expression Engine. If you don't you probably don't care either wink

Read on for Documentation and Download

Read the rest of this entry »

Posted in Internal, Web Development, PHP, XHTML & CSS | No Comments »

Forms with WuFoo

20 . December 2007
written by Clemens Lang at Dec 20th 2007, 22:08
Do you create web forms a lot? Doing a lot of copy and paste on this task?

I've been listening to Technikwürze Podcast, Episode 104 (a german podcast about design and webstandards) and they've been talking about WuFoo, an online service to create HTML forms. You can create forms using drag and drop on their site. If you want their server side validation, their statistics and their database power, you can purchase a paid subscription plan, but what I want to point out today is their XHTML/CSS export feature.

When you create a form, click the code-button and choose “XHTML/CSS code only” on the right they'll serve you the correct XHTML and CSS code for the form you designed ready somewhat ready to include it into your web site. I moved all their CSS rules into some kind of “namespace” so they wouldn't interfere with my site's CSS rules (particularly my CSS files require the form to be in an element with class “wf” assigned to it and the IDs being used in the form are prefixed with “wf_”). I added some jQuery JavaScript for the cool eye candy-effects and that's it. Now I can easily insert WuFoo-generated forms in my site (and oh boy, I will).

Note that you will have to take care of form validation yourself - you're not using the WuFoo guys' servers and I didn't include client-side validation in my JavaScript.

If you'd like to use my modified CSS file and my jQuery JavaScript code scroll down for a highlighted version or get it here: CSS and jQuery JavaScript. The CSS and XHTML code has been released under a CreativeCommons Attribution 2.5 license and I'm hereby releasing the jQuery code under the same license.

Read the rest of this entry »

Posted in Internal, Web Development, Design, JavaScript, XHTML & CSS | No Comments »

Google announces OpenSocial API

4 . November 2007
written by Clemens Lang at Nov 4th 2007, 14:06

Are you a Facebook member? Did you join MySpace for some of your friends don’t have Facebook accounts? There’s a solution, and it’s called OpenSocial.

OpenSocial is an API for social networks. There’s nothing new about APIs, but the Google is taking a flying leap by standardizing the different APIs of different social networks into one API. You might ask: “Why Google?” Actually Google is just developing the OpenSocial API, but it’s not an idea Google had on their own - they have a couple of influential partners in the social web business: hi5, MySpace, Ning, Facebook and Xing, just to name a few.

I can already hear some people moan about Google doing it - but in this case the fear-mongering that Google will soon know everything about us doesn’t seem quite eligible. To quote one of the social networking companies’ CEOs that was giving a demo of an OpenSocial app at the Google Campfire One: “This is Flixter working directly with MySpace. [...] Google doesn’t control the data in any way” (Joe Greenstein, CEO of Flixter, approx. 55:00 on Campfire One: Introducing OpenSocial on YouTube)

I can’t wait to see what developers are going to do with OpenSocial - would be nice, if Google got everyone together using OpenSocial.

[via Kaffeeringe]

Posted in Web Development, JavaScript, XHTML & CSS | No Comments »

 <  1 2 3 >