New Year, New Theme

Well first Happy New Year to everyone. I know I’m a bit early but I ready to get this sucker rolled out. I’ve been working on a new theme. It’s based on the Theme Andreas04 1.02, 07/03/06 from Tara Aukerman http://themes.wordpress.net/columns/3-columns/97/andreas04-10/. Her theme is based on a theme from Andreas Viklund http://andreasviklund.com/. Checkout the rest of Tara’s excellent themes http://tara.elmadera.com/wordpress/design.

I liked it because it offered something more than the main body content and a right ridebar. This Theme actually uses three sidebars on the right of the main content. And these sidebars are widgetized. The first sidebar is the full width of the two sidebar columns. The second and third sidebars are half the width of the first sidebar. I’m not crazy about the colors. They will be changed some time later.

Thanks Tara and Andreas for the unique design.

Let me know your comments.

Relocate WordPress File Upload section

Last week I posted an email to the wp-hackers list asking why in the infinite wisdom of the developers doesn’t the File Upload area on the Posts and Pages editor follow the same functionality as the Custom Fields, Post Excerpt. My point is the File Upload section is huge and take up a lot of screen. Screen area that is not used for every post. The reply from the group was other plugins that will remove the File Upload area entirely. Not really what I wanted. There was a whole other thread on how questions like this should be directed to the WordPress community forums and not the wp-hackers list. But that is a whole other rant.

So I started looking into this. And decided to sit down and fix this. Download the plugin here.

This plugin has been tested on WordPress 2.0.2 – 2.0.5. Have not tested on 2.1beta versions. That will be soon.

development note

The plugin performs two functions:

  1. When the admin user loads the Posts or Page editor a new ‘box’ is created at the bottom of the chain. This box is a place holder for the second step.
  2. When the page loads JavaScript code is added to the HTML head. This JavaScript will call ‘getElementById()’ to find the reference to the iframe ID of the File Upload section and the reference ID for the new ‘box’ created in step 1. Once the IDs are found the next ste is to call thhe JavaScript function ‘appendChild()’ to append the File Upload reference to the new ‘box’. Simple as that.

Installation Instruction

Pretty standard WordPress plugin installation.

  1. Download the plugin here..
  2. The downloaded file is zipped. As the plugin needs to be unzipped to function you can unzip before or after sending this to your server. Upload the plugin file to your WordPress site into the /wp-content/plugins folder.
  3. Signin to your WordPress admin interface. Navigate to the Plugins Management page and Activate the ‘Relocate File Upload’ plugin.
  4. That should be it. Now go to either the Posts or Pages editor screens and see if the File Upload section has been moved to the bottom of the boxes. You should now be able to collapse and expand the section, rearrange the boxes.
  5. If anyone has problems with this plugin please email me.

What is your definition of ‘Enterprise’?

It’s kind of strange but this week I’ve had no less than 5 separate conversations with 5 different sets of people on the topic of ‘Enterprise Web Content Management System or Application’. The context of these conversations are similar. All centered around client proposals where they ask for something specific ‘Enterprise-class’. Never do our clients specify the desired functionality as in – ‘We need to host this from multiple servers around the world where content is entered by various authors’. Normally the client will just through in ‘CMS must be Enterprise-class’ to add weight to the subject and basically send everyone onto a panic. Mostly the intention is to describe the CMS requested as not being a simple system because well the client is special and they don’t really want something ordinary.

So here are my thoughts on any Enterprise web solutions. These are just common requests from the client in no particular order:

“Need to be accessed by 10 different countries” – The web server is centralized. It can be accessed from anywhere. It’s not like the old pre-Web days when an application lived on the network and you had to install multiple copied in various domain but keep the data synchronized realtime. On the contrary, Web Applications like a CMS are centralized. If 10 people from 10 different countries need to access the same system then there is no trick to having them access the same single server. Though there might be some language issues. I’ve seen requests were the client wants to maintain the site in English but have the site burned into various languages when published. This will feed to different instances of the site that handle the language presentation. First I will say machine language translation is not always accurate. There are problems with the context of verbs and adjectives when translated from say English to Spanish, Russian, etc. Besides, this multi-language functionality is really part of the CMS and does not affect the server being accessed by the author.

“The system needs to be up %99.99” or “We expect a very high volume of traffic”. Well okay. Mostly this means setting up multiple servers or better going with a reputable ISP to ensure the server stays up. As for the load issues something to consider is as you go up the scale for commercial CMS system you run into a point where the CMS itself is using almost as much system resources as the content delivery.

“We need to interface this CMS into various back-end system” – This is another common request from clients. But again has nothing to do with wether the CMS is commercial or free. The ability to connect the CMS into other client systems is more a function of the “hack-ability” of the code itself. Here is an example. A client back in the Spring requested a CMS. Of the functionality requested the needed an Event Management system. The Event tool was to be designed to allow external users to signup and create events. Up to this point in the discovery we planned on using a commercial CMS because the client had another site using the same CMS and we assumed the client would appreciate not needing to learn another package. But the problem is the commercial CMS is a closed system. It is very hard to write custom modules to integrated into it. At this point we started looking for external Event systems like Meetup.com or Upcoming.org. The client decided they wanted the Event tool integrated into the site not something separate. At this point I changed the CMS recommendation to be WordPress. I consider WP to be a very easy to learn CMS. So the client should have no real issues getting the hang of the new tool. Also WP is all PHP, no new template language to learn for the developer. Writing a custom Event tool for WP is a simple task since we have the WP source and can hack it if/when needed. In the end the solution was a perfect fit for the client needs.

“We need a workflow” – From the many commercial and free CMS packages I’ve seen in the last 12-18 months there is a split. Not all the commercial package offer a workflow. Also some of the free one also offer a simple workflow. But it’s not a rule that if you offer a commercial CMS you are also providing a Workflow.

“We need commercial support’ – This is agreed. If the client is a big company they generally are used to the license fees and support fees associated with a commercial package wether it’s a CMS or not. If the client is such that they want to be able to pickup the phone and contact someone fix some issue they by all means go with the commercial package. But also be aware some free CMS packages like WordPress and even Movabletype (I known MT is not free) offer VIP commercial support contracts.

So what is your definition of “Enterprise”?

Changes to WordPress edit-pages

I’ve been working on a client project since March. For this client I build a custom Event system that lets users signup to create events in the system. These events are created as actual WordPress Pages. Each Event is setup in such a way that the events State and City are nodes in the URL. So for example an event in Austin, TX would be http://www.siteurl.com/events/tx/austin/event-title. Pretty cool. All of these events are maintained via forms outside of WordPress. This was key because the client didn’t want the user to have access to the back-end system.

This Event system seemed to work great for the first few months. The problem was when the admin users go into WordPress admin to edit a page they have to first list all the pages in the system then select the page to edit. Well in the span of 4 months there are over 2500 event page in the system. Each event would create it’s event city and state pages as parents when needed. This caused the page listing (edit-pages.php) to take almost 90 seconds to load from the server. This was very frustrating if the user just wanted to change copy on a static page in the system. Many of the admin users got around this by copying the URL of the edit page. I wanted to offer a different solution. I started looking at the code.

Note: All of the following discussion is WP version 2.0.2.

The edit-pages.php appears to just be a simple building script that calls another function, page_rows() from the admin-functions.php. The problem I was seeing is there were some useless calls/queries being made. For example line 28 in edit-pages.php does a select all (select *) in the query to determine if to show the table headers. This is total overkill. You only really need the count of items not all the query result. Plus if you still for some reason needed the query column just pull in the columns needed not everything. Using the asterisk will pull in the biggest column, post_content.

Another big issue I saw was the admin library function page_rows from admin-functions.php was also running the same query but recursive. This in my mind was the reason for the long delay in building the display for the 2500 event pages. So I went to work. I first changed the query on line 28 of edit-pages.php to be just a count. If the count returned was greater than zero the code follows the logic to display the table header.

Next, because the Events pages were created into a hierarchy I wanted to change the way the page_rows function displayed content. I wanted to display the information in tiers. The default view of the page listing would display everything with a page parent of zero. There are the top-tier pages. I then added a new query to page_rows to check if each page contained children. If they did I displayed the title as a link. This link contained a GET variable which is the page id. This would in turn feed back to the edit_pages.php code and then we could display then next tier of page, pages that are children of the page_id provided for the GET variable. This would allow the user to drill through the tiers of content pages.

Next, I wanted to provide something to allow the user to return to the other tiers without needing to use the back button or start from the beginning. I wanted to provide a bread-crumb. This would be displayed above the table listing. The bread-crumb also would not be displayed if the user was on the top-tier page. This was easy enough to implement. Take the parent page_id passed in via the GET variable and call a new function get_parents_array in admin-functions.php. The function will build an array of each tier of the hierarchy from top to bottom by taking the parent id and determine if that page has a parent. All the way up to when the parent is zero. Then we take the returned array and display as a node listing.

My last change was to be nice to the user. If the user drills down 4 levels to find the page they need to edit I want to return the user to this same tier when they save the page. So on the page title link I set a cookie with the page_id for that level. Simple enough.

The zip file contains two files:
1. edit-pages.php – Replacement for the current /wordpress/wp-admin/edit-pages.php core file. Save a copy of your original file. Again these hack is just for WordPress 2.0.2. This hack will not work for WordPress 2.1!
2. admin-functions-supp.php – The contents of this file should be added to your existing /wordpress/wp-admin/admin-functions.php file. The two functions contained are unique and should not conflict withe existing functions.

Download the hack file

HREF Filter

This is my first full complete and functional WordPress plugin. Give me a moment…Okay.

What is it and what does it do? Good question. I support a site that uses WordPress. On this site are some links to an external eCommerce system. The user will generally surf through the main site and click on the link to be taken to a donation page or some other purchase oriented page. Well one morning a few weeks ago I received an urgent phone call from the client. Seems this eCommerce system was down. Which meant the links were dead. The client was calling to ask me to go through the site and for every link to that external system change the HREF to point to an internal page. He was going to start working on the hard part he said, coming up with the copy for the page. I just had to find and replace all the links. Somehow I think I actually heard a snicker in his voice.

Well I go to thinking. I can make the needed changes to the template code where needed. I counted no less than 6 links in the menu and sidebar alone. But what about the dozens of pages of copy. Now, I consider myself a programmer’s programmer. I’ll be damned if I’m going to go through each page and change the links. Also since the external system will most likely be back online I’d have to repeat this little exercise and change the links back to point to the external system again.

So I put together a little JavaScript that will launch via the onLoad event. The first thing to do is find on the links on the given page. No big problem there. Using the JavaScript function ‘getElementsByTagName’ to find all the anchors. Then a simple for loop to check each HREF. If the link began with the external hostname I replaced the full HREF with an internal URL to his new message page. Simple enough. The JavaScript worked like a charm. Only problem is this external eCommerce system seems to be very unstable and there were days when I had to ‘activate’ and ‘de-activate’ JavaScript almost a dozen times. That’s it I cried. I need to put this function into the user’s hands. So I started on the journey to write this working JavScript into a WordPress plugin.

HREF Filter Setup How-to
1. First download the plugin.
2. Unzip this into the WordPress plugins folder ‘/wp-content/plugins’.
3. Access you WordPress admin. Navigate to the Plugins page. Click on the activate link in the right-most column.
4. Once the Plugin is activated, navigate to the Manage -> HREF Filter menu. Note this is not Options but Manage.

HREF Filter Usage
Upon activation there are two Filtered added as examples. There are basically two types of filters supports.

Replace only matched string – Think of this as a search and replace. Enter the searched pattern. Enter in the Replace pattern. For example your search is ‘Miles’ and the replace is ‘Davis’. Then is you have an href like http://www.miles.com/see-miles-play/. This will be filtered and changed to http://www.davis.com/see-davis-play/. The replace value can be any length and can also include the URL node seperator ‘/’.

Replace full HREF value – This is more ‘find the href the contains this pattern and replace the full href value’ filter. For example you have a search pattern of ‘google’ and a replace pattern of ‘http://www.yahoo.com’. Basically any href value that contains the search pattern will be replaced. For the replace you may use values with the leading slash as in ‘/someurl’. This replace filter will be checked and the site URL will be added to the beginning.

Also as part of the Filter setup is the ability to turn the filter off or on. This is handy in that you don’t need to delete and recreate the filter.

As mentioned before, the plugin uses 90% JavaScript code to search/replace the anchor href values. This JavaScript is added to the page’s html header via the WordPress ‘wp_head’ action. As part of this action the function ‘ch_hf_loader’ is called and the JavaScript ‘addLoadEvent’ is called to add the bootstrap function ‘ch_hf_proc_links’. This will start the processing.

You can also call this function ‘ch_hf_loader()’ function direct via PHP to load the needed JavaScript. Also if for some reason you don’t want to auto-load the JavaScript Event, you can also call the function with a single value ‘ch_hf_loader(1)’. This will disable the addLoadEvent call. You then need to call the function JavaScript function ‘ch_hf_proc_links’ yourself to start the processing.

This means once the filters are defined via the WordPress admin interface they will automatically be added to your page’s html head.
Enjoy and feel free to email me with request. I do have plans for the next version of this plugin coming up soon. This is the initial release.