WP-ExtJS

Background

WP-ExtJS is a WordPress Plugin that enables bloggers to leverage the power and flexibility of the ExtJS Javascript framework directly within pages or posts.

If you’re not familiar with ExtJS – head on over to Sencha.com and check out this awesome Javascript framework.

Why Do I Need This?

Publishing content via WordPress and designing web based applications using Javascript are very different approaches to publishing web data.  Wordpress is typically used by bloggers as a Content Management System for publishing articles.  We know that it makes the process of publishing and maintaining blog articles extremely fast and easy.   The issue arises however, when I want to display data from an outside source using some of the beautiful and powerful Javascript components such as the datagrid, treepanel and listview.  This plugin enables you to do just that from right inside a page or post on your WordPress blog.

How Do I Use the Plugin?

First, you need to download and install ExtJS somewhere on your web server.  You can get a copy from http://sencha.com.  Unzip and install the files from the archive into a web accessibly directory on your web server.  Take note of the path to the directory where you place the files – you will need this when installing and configuring the wp-extjs plugin.

Once the plugin is installed and activated it enables a new custom post type called “ExtJS Snippets” which you can use to store your ExtJS scripts. After creating a snippet, take note of the numeric id assigned by WordPress.

These javascript snippets can be referenced within pages and posts through use of several shortcodes.  A shortcode is a WordPress-specific code that lets you do nifty things with very little effort. Shortcodes can embed files or create objects that would normally require lots of complicated, ugly code in just one line. Shortcode = shortcut.

The shortcode for WP Extjs looks like this:

[wp-extjs snippet_id=958 border=’1′ style=’background: #333333′ title=’example’ height=400 width=100%]

When WordPress processes the content of a page or post and finds that shortcode, it transfers control to my plugin which calls a special renderer to display the content of your Javascript snippet and you end up seeing something like this:

[wp-extjs snippet_id=958 border=’1′ style=’background: #333333′ title=’example’ height=400 width=100%]

Screenshots

How do i get the plugin?

You may download the plugin from the WordPress.org Plugin Repository.