Drag and drop categories and taxonomies : woocommerce full admin new release

After a 12 months of silence here comes a new release of my preview version of a special enhanced admin interface for woocommerce. Its main purpose is to provide a better interface for viewing and admistering products, from the point of view an organized shop manager that works intensively with categories

The new version labelled 0.3 adds drag and drop for categories. This feature is for the moment limited to dealing with sub categories, whereas a real drag and drop component should also deal with category order, but for the moment do not expect that much : use this plugin to sort categories and sub categories on big databases where you need to get a clear idea of a hierarchy tree.

The idea for this feature came after I had to deal with a big migration from Magento to Woocommerce, where a lot of categories were imported with their products and I needed to check that everything was OK. having no public theme yet, I needed a more convenient interface for viewing the results of the import.

Link :

Other plugins work with taxonomies :

  • Taxonomy terms order is the most famous of all plugins with more than 20000 downloads . It uses the admin menu style interface for allowing taxonomy order.

Bridging prestashop features to wordpress

Like to have the best of both worlds ? seems prestashop and wordpress can communicate, though coding standards can make the develpment of such an integration difficult, even  for experienced PHP developers :

Using prestashop modules or content for automatic  product display in your wordpres blog

  • The plugin "Prestashop Integration" defines a new wordpress shortcode that will display  prestashop products in a wordpress installation. Pretty straightforward to get running, no big surprise here.

Using Prestashop Authentification Information to get worpdress behave as logged in

  • if you are familiar with Symfony and Composer, you can try this external authentification class : PrestashopBridge. for myself, in spite of expert wordpress knowledge, some knowledge of prestashop and composer tools,  I did not manage to get it working : only for the rough guys !
  • If you want to share users between two installations you have plugins available
    • prestashop-user-compatibility synchronises passwords of prestashop installation to wordpress: but it requires to have synchronized users. This plugin seems to be more like a one time helper for migrating from prestashop to wordpress
    • This is why I build prestawpbestworlds, because I want the best of both worlds : this is a premium plugin for wordpress (cost 99$) :  a one way  real time user and login status synchronizer that will allow currently prestashop customer to user wordpress as connected user, without even having to login again. Login, user creation, logout are all processed via prestashop connection information.

Gravity forms : create a new composite field

Ever wanted to create a new type of advanced field for gravity forms ?  for example, I needed to create a dimension field with two select boxes, limiting the choices available for selecting a dimension in centimeters and millimiters. Well it took me quite a while to find out that a lot of documentation on the web is outdated : the "simple field addon" published on git hub simply does not work on latest gravity forms (version 2.0.6 as of today)... Instead of trying to debug that one I found a better explanation of extending fields on gravity forms GF_FIELD documentation page. It turns out that extending that main class in a simple file that you can include in your theme (or create a plugin from it), works fine. here is a sample code taken from the standard time field, quickly transformed to a centimeter / millimeter select box. NO GUARANTEE that this works, it is in development, it still contains some code from the original time field,  I will post updates as I progress, feel free to use it and make your own plugin out of this one


if ( ! class_exists( 'GFForms' ) ) {

class GF_Field_Doublenumberselect extends GF_Field {

	public $type = 'doublenumberselect';

	public function get_form_editor_field_title() {
		return esc_attr__( 'doublenumberselect', 'gravityforms' );

	function get_form_editor_field_settings() {
		return array(

	public function validate( $value, $form ) {

	public function get_field_input( $form, $value = '', $entry = null ) {

		$is_entry_detail = $this->is_entry_detail();
		$is_form_editor  = $this->is_form_editor();

		$form_id  = absint( $form['id'] );
		$id       = intval( $this->id );
		$field_id = $is_entry_detail || $is_form_editor || $form_id == 0 ? "input_$id" : 'input_' . $form_id . "_$id";

		$form_sub_label_placement  = rgar( $form, 'subLabelPlacement' );
		$field_sub_label_placement = $this->subLabelPlacement;
		$is_sub_label_above        = $field_sub_label_placement == 'above' || ( empty( $field_sub_label_placement ) && $form_sub_label_placement == 'above' );
		$sub_label_class_attribute = $field_sub_label_placement == 'hidden_label' ? "class='hidden_sub_label screen-reader-text'" : '';

		$disabled_text = $is_form_editor ? "disabled='disabled'" : '';

		$hour = $minute = $am_selected = $pm_selected = '';

		if ( ! is_array( $value ) && ! empty( $value ) ) {
			preg_match( '/^(\d*):(\d*) ?(.*)$/', $value, $matches );
			$hour        = esc_attr( $matches[1] );
			$minute      = esc_attr( $matches[2] );
			$the_rest    = strtolower( rgar( $matches, 3 ) );
			$am_selected = strpos( $the_rest, 'am' ) > -1 ? "selected='selected'" : '';
			$pm_selected = strpos( $the_rest, 'pm' ) > -1  ? "selected='selected'" : '';
		} elseif ( is_array( $value ) ) {
			$value       = array_values( $value );
			$hour        = esc_attr( $value[0] );
			$minute      = esc_attr( $value[1] );

		$hour_input   = GFFormsModel::get_input( $this, $this->id . '.1' );
		$minute_input = GFFormsModel::get_input( $this, $this->id . '.2' );
		$hour_placeholder_attribute   = $this->get_input_placeholder_attribute( $hour_input );
		$minute_placeholder_attribute = $this->get_input_placeholder_attribute( $minute_input );

		$hour_tabindex   = $this->get_tabindex();
		$minute_tabindex = $this->get_tabindex();


		$hour_label = rgar( $hour_input, 'customLabel' ) != '' ? $hour_input['customLabel'] : esc_html__( 'CM', 'gravityforms' );
		$minute_label = rgar( $minute_input, 'customLabel' ) != '' ? $minute_input['customLabel'] : esc_html( _x( 'MM', 'Abbreviation: Minutes', 'gravityforms' ) );
         $option1 = self::getNumberSelect($hour  );
	     $option2 = self::getNumberSelect($minute );
	$label1=" <label for='{$field_id}_1' {$sub_label_class_attribute}>{$hour_label}</label>";
	$label2=" <label for='{$field_id}_2' {$sub_label_class_attribute}>{$minute_label}</label>";
		 $select1 ="<select type='{$input_type}' maxlength='2' name='input_{$id}[]' id='{$field_id}_1' value='{$hour}' {$hour_tabindex} {$hour_html5_attributes} {$disabled_text} {$hour_placeholder_attribute}> {$option1}</select>$label1</i>";
         $select2 ="<select type='{$input_type}' maxlength='2' name='input_{$id}[]' id='{$field_id}_2' value='{$hour}' {$hour_tabindex} {$hour_html5_attributes} {$disabled_text} {$hour_placeholder_attribute}> {$option2}</select>$label2</i>";

			return "<div class='clear-multi'>
                        <div class='gfield_time_hour ginput_container ginput_container_time' id='{$field_id}'>
                        <div class='gfield_time_minute ginput_container ginput_container_time'>

	public function get_field_label_class(){
		return 'gfield_label gfield_label_before_complex';
public function getNumberSelect($value)
	for ($i=0; $i<100; $i++)
				$selected  =  ($value==$i?"selected":"");
				$str .="<option value='$i' $selected>$i</option>";
	return $str;
	public function is_value_submission_empty( $form_id ) {
		$value = rgpost( 'input_' . $this->id );
		if ( is_array( $value ) ) {
			// Date field and date drop-downs
			foreach ( $value as $input ) {
				if ( strlen( trim( $input ) ) <= 0 ) {
					return true;

			return false;
		} else {

			// Date picker
			return strlen( trim( $value ) ) <= 0;

	public function get_value_save_entry( $value, $form, $input_name, $lead_id, $lead ) {

		// if $value is a default value and also an array, it will be an associative array; to be safe, let's convert all array $value to numeric
		if( is_array( $value ) ) {
			$value = array_values( $value );

		if ( ! is_array( $value ) && ! empty( $value ) ) {
			preg_match( '/^(\d*):(\d*) ?(.*)$/', $value, $matches );
			$value    = array();
			$value[0] = $matches[1];
			$value[1] = $matches[2];
			$value[2] = rgar( $matches, 3 );

		$hour   = empty( $value[0] ) ? '0' : wp_strip_all_tags( $value[0] );
		$minute = empty( $value[1] ) ? '0' : wp_strip_all_tags( $value[1] );
		$ampm   = wp_strip_all_tags( rgar( $value, 2 ) );
		if ( ! empty( $ampm ) ) {
			$ampm = " $ampm";

		if ( ! ( empty( $hour ) && empty( $minute ) ) ) {
			$value = sprintf( '%02d:%02d%s', $hour, $minute, $ampm );
		} else {
			$value = '';

		return $value;

	public function get_entry_inputs() {
		return null;

	public function sanitize_settings() {
		if ( ! $this->timeFormat || ! in_array( $this->timeFormat, array( 12, 24 ) ) ) {
			$this->timeFormat = '12';


GF_Fields::register( new GF_Field_Doublenumberselect() );


Beyond mobirise website builder

Six months after writing my mobirise review, I'm still amazed at the quality of this free software. It has spawned a new business model for my web design business in the west of Brittany where I deal with an important  market share  of customers who do not wish to pay for wordpress or CMS powered web design : small and medium companies just need to be online, not to pay for extra content management services they absolutely do not need.

SELF HOSTED web site creation 

This is why I am investigating domain management and webdesign, and two new tools have caught my attention. Remember SILEX FLASH CMS ? their original website has gone down and there is a new SILEX, are these the same guys ? anyway this is a good web design interface that generates static HTML and sends it straight to your FTP. the project is available online for try and test and abuse (free) !! and also hosted on github. But I honestly don't know if it generates modern pages like MOBIRISE does... I have also been looking at another self hosted solution, that runs on CPANEL, this is useful for hosting business where you want to give your customers access to website design : look at KOPAGE if you want something dynamic  integrated into your webhosing CPANEL package, or Aloha Editor, opensource javascript application that provides a very neat editing interface for HTML pages, and its PHP integration CreateJS. Or opensource SITECAKE

FREE website creation tools

apart from squarespace or WIX, a dozen of website creation tools allow to start free : investigating domain reservation api led me to try moonfruit which has lot of initial templates to start from. But the real deal breaker is pagecloud, which promises to create your HTML5/  CSS compliant webpage straight from photoshop


To conclude,  let's return to static generation : I have found a really net webdesign app that will cost you 70 bucks, I really like the HTML it produces, and that's all for now, here is a screenshot, enter BLOCAPP for mac, their front page says it all : simplicity, quality, clarity ...





10 features for a perfect wordpress starter theme

These are very important features we'd like to recommend if you want to develop your own commercial themes. Remember that themes are supposed to be used and reused on many sites, which means various configuration options, either codebased of configuration based

  • Theme customizer :
    • Logo upload for theme customization is now a standard wordpress feature, documented on the codex. The custom header feature allows you to uypload your logo, and possibly cropping of the uploaded image. Interesting when trying it variations of formats and or colors.
    • Layout options :
      • theme customizer should allow you to define layout options like : full width, fixed width with max width specification (1020, 960, you pick). Of crouse any serious theme layout should be full responsive and grid based, and compatible with drag and drop content editors like page builder of visual composer
      • good options should allow to define default behaviour for all custom options within pages or posts 'see second pargraph below)
      • color schema should be easy to customize : ideally you should show off a dozen color schemas with your theme
  • Menus 
    • handling a main menu - with unlimited hierarchy levels and responsivness -  is the minimum for a good theme, but I suggest your prepare other locations for secondary menus : top menu (for social networks), bottom menu (adress, legal ...)
  • Custom post types
  • Handling custom Font
    • it is necessary to provide som e sort of easy font customizing, either in the code via a filter or action, or via backend admin interface
    • icons : the font awesome library provides more than 300 hundred icons, it is quite necessary to provide this iconset within your theme. It is good to provide tinymce integration for quick icon integration within text
  • Custom options for pages :
    • custom box for choice of sidebar display :
      • custom sidebar selection (the free plugin Custom Sidebars is available for this feature if you don't want to implement it in your theme. But it does not allow you to remove a sidebar from a page)
      • sidebar position (right, left, none, both)

WordPress 4.0 ready for long texts

I was working on long texts this morning on wordpress tinuymce, that was in a 3.9 version : a big part of the work was scrolling forth and back from the bottom of my text and the tool bar. Moreover, I was switching from safari to Chrome to find out that Chrome allows resizing while Safari does not : small details, big trouble for writing on wordpress.

A big progress came with my 4.0 update : event though the resizing corner has disapeared on chrome, the editor now adapts to your content, and the toolbar stays on top of the screen instead of scrolling up with the page. For tinuymceadvanced users, make sure you have upgraded your plugin if you want this new content editing feature to work !



Information management with WORDPRESS / PART II : bulk editing

While comparing wordpress woocommerce with magento, I pointed out the very efficient bulk editing feature for products in magento : it's quite amazing to find out that new versions of wordpress bring features you would not even imagine. Version 2.7 of wordpress, brought to the world in december 2008, brought the famous Batch and inline editing, also known as BULK EDITING. Our main interest of bulk editing in wordpress for information management is the bulk editing of tags and categories. Codex mentions fields that can be bulk edited.

Bulk Edit allows the fields, Author, Comments Allowed, Status, Pings Allowed, and Sticky, to be changed for all the selected Posts

Limitations : wordpress codex highlights the fact that Categories and Tags can be ADDED in bulk to a set of Posts, but it is not possible to CHANGE, or DELETE, a Category, or Tag, for those Posts.

the delete category feature is an important issue, as moving products, posts, or other elements does involve adding categories but obviously you'd need to remove categories from posts : this was the subject of a discussion topic on wordpress forum where some piece of code was posted : read Remove Categories with bulk edit to find this piece of code that could be transformed into a plugin or simply added to your theme.

Woocommerce extra bulk edit

woocommerce plugin is a perfect exemple of the extensibility of the bulk editing feature : price information (% increase or decrease), sale information,status, weight and stock information can be bulk edited. developers will find interesting coding information for adding extra fields to the bulk editing feature in woocommerce codebase.




Other extensions and plugins

for coders

for non coders

WordPress media library : display image size

I found with great disapointment that my new mac book does not always display image sizes in finder, little goodie that windows does perfectly. Well I don't exactly like the mac/ pc debate and turned to wordpress media library with a little code snippet that displays  a new column with image dimensions, found on the great stackexchange. Good candidate for basic wordpress extension.

add_filter('manage_upload_columns', 'size_column_register');

function size_column_register($columns) {

    $columns['dimensions'] = 'Dimensions';

    return $columns;

add_action('manage_media_custom_column', 'size_column_display', 10, 2);

function size_column_display($column_name, $post_id) {

    if( 'dimensions' != $column_name || !wp_attachment_is_image($post_id))

    list($url, $width, $height) = wp_get_attachment_image_src($post_id, 'full');

    echo esc_html("{$width}&times;{$height}");


Locomotive CMS

I liked the look and design of a french travel agency website, http://www.doublesens.fr/ : a quick investigation into the inner engine that powers the simple layout , clean drop down menu and wift responsivness led me to LOCOMOTIVE CMS a promising new CMS built on rails and specialized on custom post types. Its website features a nice comparison with best in the world WORDPRESS CMS. One thing is would need though  a good image uploader like wordpress knows !

5 dropbox alternatives.. and wordpress link

Dropbox has made its way as standard way of transferring files to the cloud : we use it extensively and the free package, obviously, has led us to use the paid  extension for extra storage.

For our daily webmasters tasks, linking cloud files to wordpress has never been easier since I discovered a very professional plugin, delivered with a slick interface and full language translations : Out of the box is a dropbox plugin for wordpress : dutch author Floris de LEUUW proved very efficient answering basic coding issues when I tried the sister plugin for google drive "Use Your Drive". I particularly like the gallery feature which allows slick display of images hosted on your dropbox or cloud account.

Exchanging files has become so common that now a lot of alternatives have come up

  • Infinit claims to provide unlimited storage, free : its distinctive feature is a focus on friends and networks
  • Kabuto provides 2gb storage

Paid alternatives for file storage


woocommerce order product list

The latest version of woocommerce adds a feature to the order list  :  the Purchased column describes items purchased for that order : the number of items is displayed and a click on the line displays all order products.Interesting behaviour when there are many products per order : if you have one or two product per average order, it might be better to display everything in the column, to get a whole view of various recent orders , like a sales report:

woocommerce-order-sales-reportthe code is very simple, use the manage_shop_order_posts_custom_column action to add some text to the purchased column :


add_action( 'manage_shop_order_posts_custom_column' , 'po20140324_addColumns_column', 10, 2 );
function po20140324_addColumns_column( $column ) {
 global $post, $woocommerce, $the_order;

    switch ( $column ) {

        case 'order_items' :
            $terms = $the_order->get_items();

	      if ( is_array( $terms ) ) {
             	foreach($terms as $term)
		echo '<br />' . $term['item_meta']['_qty'][0] .' x ' . $term['name'] .'';
              } else {
              	_e( 'No product to display ? ', 'woocommerce' );



managing multiple wordpress installations

In a previous article, we took some time to  describe our own hack to provide multiple wordpress installation on a single web host, with multiple databases instead of multiple prefixes.

In this article we describe how to manage multiple wordpress install

http://infinitewp.com/ : a client/ server installation that requires a webhost for the management software and a plugin on each wordpress installation you want to manage. This plugin is free and comes with a lot of features that simplify multiple wordpress website management :
Additional plugin (50$) allows cloning / duplication of a wordpress site


https://managewp.com is a subscription based wordpress management tool

twenty fourteen wordpress theme : remove sidebar

The new twenty fourteen theme that comes with wordpress default installation is a very good responsive theme, than easily be customized to render a CMS website with pages only. But if you want to remove the sidebar you have to manipulate a few files


  • sidebar.php : add "return" at the beginning of the file, after the opening php code, and after the comments
  • style.css : commentline 3914 that adds a left margin the content div when displayed on big screens, and line 3565


Woocommerce : how to choose your theme

There are thousand of free and premium themes available for woo commerce. Before choosing one, make sure you have checked a few important things

  • most professional wordpress / woocommerce themes are responsive : they can display your website in mobile phones. But you do need to check the websites on all formats including IPADS, Iphones, and Android. Prepare a list of all resolutions devices can have, including windows powered phones that can turn out very tricky if someone uses internet explorer (see below)
  • after you have checked the theme on various sizes, check it on various browsers : a wordpress theme that works on Internet explorer 8 is the sign of very good HTML standard compliance, so you need to be able to check on various versions of Internet Explorer, which means many computers available !
  • Have a look at the stylesheet : it should be not too big and include not too many extra useless formatting.  But a good woo commerce theme comes with its own woo commerce stylesheet, and removes the original woo commerce style sheet

WordPress tables with tinymce

If you want to build tables within wordpress there are two options

  • use tinmce advanced with table tools
  • use a plugin

Using a plugin is the option I have chosen, and among many available plugins I have chosen websimon tables because it is quite simple, comes with custom styles including alternate row colors. The only thing is that editable fields are not wysiwyg, which is easily implemented via two basic code modifications that we detail here

in edit_table.php, call the wp_editor function instead of displaying textarea fields :

$settings = array( 'media_buttons' => false , "editor_height"=>100,"textarea_rows"=>2, "width"=>"200","textarea_name"=>'cell' . $cell_counter );
wp_editor( stripslashes($cell[$col_counter-1]),"idcell" . $cell_counter,$settings);


and in shortcode.php, you need to specify a call to the content filter in order to add necessary p and br tags. Job Done !

5 flipping book applications

We used Calameo to publish our PDF as flipping books : but it turns out that this solution, while offering hosting services for free can turn out expensive when used on a monthly payment basis, especially when you work with your own dedicated hosting service.

we then looked into HTML 5 systems

  • Digital Brochure seems to bring modern layout look and feel : less details but more design
  • flex paper zine seems to do a good job and has a trial version, but it comes a at higher cost

WordPress drag and drop content management : plugin comparison

I have tested and used Visual Composer for many sites : very efficient drag and drop responsive content manager that integrates within the wordpress page editing screen. Only drawback of this kind of system is that it forces you to use fixed column size : you have the choice of divisions of page, like most responsive grid systems, so you have to accomodate the 1/2, 1/3, 1/4 parts of your page.

On the other hand most of the plugins I've tested  only works from the backend :  first solution below  work from the front end and it's better to visually understand what's going on depending on your layout width. But let's look deeper.

  • WordPress Front end builder incorporates front end editing and mobile / tablet screen display picker which looks like it works with media queries.The row management interface is very intuitive and allows for various content width configuration. wordpress-layout-rows



  • MiniMax Layout Builder  has very slick backend integration, same style as visual composer, with column layout picker for each row :
    • unlike visual composer, Minimax sits within the tinymce framework and as such it is good because it does not surcharge your screen but has the drawback of limiting the editing height to the initial height of the editor. You can have multiple elements in a single column, as illustrated below. Another drawback I found in the demo is the image uploader, old type (pre wordpress 3.5) - Developers can get more technical info on how to  integrate recent wordpress media manager  on shibashake.com
    • Like visual composer, minimax has some sort of templating recording but not as good because it is implemented in the form of locally stored text files



wordpress drag and drop form makers : gravity forms vs ninja forms

I've been using gravity forms for years and have been able to implement many user driven web sites. Now a free competitor to gravity forms has arrived, it's pretty mature and extremely popular (more than 100K downloads on wordpress.com  : enter NINJA FORMS !

  • Gravity forms comes at the price of 39$ per site. Ninja forms is ...free in its full version but a lot of features come as priceable plugins.
  • Ninja forms is very similar to gravity forms:  it features a drag and drop interface for building form fields. But I prefer gravity forms interface, which  is more clear, easier to understand and is more effective at displaying the form parameters.
  • In my case I want to perform user front end post submission : in gravity forms  that's native, with ninja forms you'll have to purchase the front end posting extension at the cost of 39$. Advantage goes to gravity forms who has file upload feature in its native form, whereas ninja forms will cost you another 29$ to get file upload extension
    Note : another form plugin does front end user submission and response editing, formidable pro, at the price of 47$ .
  • entry management is very good in both gravity forms and ninja forms. Gravity forms has a very good interface to let you choose which columns are displayed. Shame the entry date is not selected by default, but overall this feature is better implemented in gravity forms too

Conclusion : I know ninja form is free but extended features will go cheaper with gravity forms